1、面向对象编程介绍

1.两大编程思想介绍

1.1 面向过程编程 POP

  • 面向过程就是分析出解决问题所需要的步骤,然后用函数把这些步骤一步一步实现,使用的时候再一个一个的依 次调用就可以了。

  • 面向过程,就是按照我们分析好了的步骤,按照步骤解决问题。

1.2面向对象编程 OOP

  • 面向对象是把事务分解成为一个个对象,然后由对象之间分工与合作。

  • 面向对象是以对象功能来划分问题,而不是步骤。

  • 在面向对象程序开发思想中,每一个对象都是功能中心,具有明确分工。

1.3面向过程与面向对象对比

面向过程面向对象
优点性能比面向对象高,适合跟硬件联系很紧密的东西,例如单片机就采用的面向过程编程。易维护、易复用、易扩展,由于面向对象有封装、继承、多态性的特性,可以设计出低耦合的系统,使系统 更加灵活、更加易于维护
缺点不易维护、不易复用、不易扩展性能比面向过程低

2. ES6 中的类和对象

2.1面向对象的思维特点:

  • 抽取(抽象)对象共用的属性和行为组织(封装)成一个类(模板)
  • 对类进行实例化, 获取类的对象

2.2 对象

在 JavaScript 中,对象是一组无序的相关属性和方法的集合,指的是一个具体的事物,所有的事物都是对象,例如字符串、数值、数组、 函数等。

对象是由属性和方法组成的:

  • 属性:事物的特征,在对象中用属性来表示(常用名词)
  • 方法:事物的行为,在对象中用方法来表示(常用动词)
2.2.1创建对象
//字面量创建对象
var ldh = {
    name: '刘德华',
    age: 18
}
console.log(ldh);

//构造函数创建对象
  function Star(name, age) {
    this.name = name;
    this.age = age;
 }
var ldh = new Star('刘德华', 18)//实例化对象
console.log(ldh);	

如上两行代码运行结果为:

2.3 类 class

在 ES6 中新增加了类的概念,可以使用 class 关键字声明一个类,之后以这个类来实例化对象。

类抽象了对象的公共部分,它泛指某一大类(class) 对象特指某一个,通过类实例化一个具体的对象

2.3.1创建类

语法:

//步骤1 使用class关键字
class name {
  // class body
}     
//步骤2使用定义的类创建实例  注意new关键字
var xx = new name();   

示例:

 // 1. 创建类 class  创建一个 明星类
 // (ES6中类没有变量提升,所以必须先定义类,才能通过类实例化对象)
 // 类名首字母大写,类名后不需要加小括号
 class Star {
     // constructor() 方法是类的构造函数(默认方法),用于传递参数,返回实例对象,通过 new 命令生成对象实例时,自动调用该方法。如果没有显示定义, 类内部会自动给我们创建
    // 类的共有属性放到 constructor 里面
    constructor(name, age) {
        // 类里面的共有属性和方法一定要加this使用
        // constructor里面的this指向实例对象
         this.name = name;
         this.age = age;
   }
 }
   // 2. 利用类创建对象 new
   var ldh = new Star('刘德华', 18);
   // 生成实例 new 不能省略,类名后面加小括号
   console.log(ldh);

以上代码运行结果:

通过结果我们可以看出,运行结果和使用构造函数方式一样

2.3.2类创建添加属性和方法
 // 1. 创建类 class  创建一个类
class Star {
    constructor(uname, age) {
      this.uname = uname;
      this.age = age;
    }
    // 多个函数方法之间不需要添加逗号分隔
    sing(song) {
    // 方法里面的this 指向这个方法的调用者
      console.log(this.uname + '唱' + song);
    }
}
// 2. 利用类创建对象 new
var ldh = new Star('刘德华', 18);
console.log(ldh); // Star {uname: "刘德华", age: 18}
ldh.sing('冰雨'); // 刘德华唱冰雨

以上代码运行结果:

Logo

CSDN联合极客时间,共同打造面向开发者的精品内容学习社区,助力成长!

更多推荐