JS高级 面向对象 类 + 构造函数

一、面向对象

1. 面向对象

• 优点
  易维护、易复用、易扩展，由于面向对象有封装、继承、多态性的特性，可以设计出低耦合的系统，使系统更加灵活、更加易于维护
• 缺点
  性能比面向过程低

2. 面向过程

• 优点
  性能比面向对象高，因为类调用时需要实例化，开销比较大，比较消耗资源;比如单片机、嵌入式开发、Linux/Unix等一般采用面向过程开发，性能是最重要的因素。
• 缺点
  不易维护、不易复用、不易扩展

二、类和对象

1. 对象

对象是由属性和方法组成的：是一个无序键值对的集合,指的是一个具体的事物

2. 类

在 ES6 中新增加了类的概念

创建类的关键字是什么？

• class

创建对象的关键字是什么？

• new

在类中有一个 constructor 是什么？什么时候执行？

• 构造函数
• 当实例对象创建时会自动执行构造函数
• 内部的 this 指向刚刚实例化的对象，不需要手动写 return 会自动返回

 // 1. 创建类 class  创建一个 类
 class Star {
     constructor(uname, age) {
         this.uname = uname;
         this.age = age;
     }
 }

// 2. 利用类创建对象 new
var jy = new Star('鲸渔', 18);
var yjy = new Star('远近渔', 20);
console.log(ldh);
console.log(zxy);

2.1 类创建添加属性和方法

类中添加方法需要 function 关键字吗?

• 不需要

类中的方法是通过谁去调用的?

• 由实例对象调用

// 1. 创建类 class  创建一个 类
class Star {
    // 类的共有属性放到 constructor 里面
    constructor(uname, age) {
        this.uname = uname;
        this.age = age;
    }
    sing(song) {
        // console.log('我唱歌');
        console.log(this.uname + song);
    }
}

注意：

1. 通过class 关键字创建类, 类名我们还是习惯性定义首字母大写
2. 类里面有个constructor 函数,可以接受传递过来的参数,同时返回实例对象
3. constructor 函数 只要 new 生成实例时,就会自动调用这个函数, 如果我们不写这个函数,类也会自动生成这个函数
4. 多个函数方法之间不需要添加逗号分隔
5. 生成实例 new 不能省略
6. 语法规范, 创建类 类名后面不要加小括号,生成实例 类名后面加小括号, 构造函数不需要加function

2.2 类的继承

类继承extends和super关键字

共性的方法或属性放到父类中,达到简化代码并且易于维护的效果

// 父类
class Father{   
} 

// 子类继承父类
class  Son  extends Father {  
}    
// ——————————————————————————————————————————————
class Father {
    say() {
        return '我是爸爸';
    }
}
class Son extends Father {
    say() {
        // console.log('我是儿子');
        console.log(super.say() + '的儿子');
        // super.say() 就是调用父类中的普通函数 say()
    }
}
var son = new Son();
son.say();

super必须放到子类this之前

注意：
1.先有类再有实例化 (先有了女朋友才能结婚生子)
2.类里面的属性需要this调用

2.3 类里面this指向问题

案例分析:
class Person {
    constructor(name) {
        this.loverName = name;
    }
    look(name) {
        this.loverName = name;
    }
}
var p = new Person('刘亦菲');
console.log(p.loverName);
p.look("马爸爸");
console.log(p.loverName);

三、构造函数

构造函数和普通函数的区别是什么？

• 构造函数是对对象公共成员的封装，用于创建对象，普通函数是对功能的封装
• 其实构造函数就是函数，在什么时候才会变成构造函数？
  一定是在 new 的时候才是构造函数
• 只有在调用时才知道是什么函数
  普通函数: 函数名()
  构造函数: new 函数名()

结论： 构造函数不是由声明时决定，而是由调用时决定，只要是用 new 关键字调用，就表示该函数为构造函数

1. new 的执行

1. 开辟内存空间，创建空对象（放在堆里面）
2. 将构造函数内部的 this 指向新创建的对象
3. 执行构造函数中的代码
4. 返回新创建的对象

2. 实例成员 / 静态成员

实例成员

• 在构造函数中通过 this 添加的成员,就是实例成员
• 只能由实例化对象使用(只能由创建的对象来使用)

静态成员

• 绑定在构造函数身上的成员
• 只能由构造函数使用