小王的学习笔记（十二）——js中的class

class

js中，生成实例对象的传统方法是通过构造函数。 ES6 提供了更接近传统语言的写法，引入了Class（类）这个概念，作为对象的模板。通过class关键字，可 以定义类。基本上，ES6 的class可以看作只是一个语法糖，它的绝大部分功能，ES5 都可以做到，新的class写法只是让对象原型的写法更加清晰更像面向对象编程的语法而已。所以 ES6 的类，完全可以看作构造函数的另一种写法。

---

在类中可以直接定义方法，其实上类的所有方法都是定义在类的prototype属性上的。在类的实例上调用方法，其实就是调用原型上的方法。
constructor方法是类的默认方法，在调用new时会自动调用constructor方法，一个类中必须有constructor方法

//相当于构造函数
class Animal{
    //每个类都有，不写会默认添加
    constructor(params) {
        //实例属性，实例可以访问到的属性
        this.params = params;
    }
    // 实例方法，定义在Animal的原型上，通过实例调用
    sayHi(){
        console.log('sayHi')
    }
    // 静态方法，定义在构造函数上，只能由构造函数调用，在这里就是指类本身
    static sayNo(){
        console.log('sayNo')
    }
}

创建实例对象，使用class声明的类在构建实例时必须用new关键字来进行。
实例方法定义在类的prototype属性上，通过实例调用，静态方法定义在构造函数上，只能由构造函数调用，在这里就是指类本身。

let animal = new Animal();
animal.sayHi();//sayHi 实例方法
// Animal.sayHi();//Animal.sayHi is not a function 
Animal.prototype.sayHi();//sayHi
// animal.sayNo();//animal.sayNo is not a function
Animal.sayNo();//sayNo 静态方法

直接在类上定义的属性称为是静态属性。静态属性只能由类本身访问，实例不能访问。
添加静态属性的唯一途径：

//静态属性
Animal.test = 'hello';//添加静态属性的唯一途径
// console.log(animal.test);//undefined
console.log(Animal.test);//hello

目前，只有这种写法可行，因为ES6明确规定，Class内部只有静态方法，没有静态属性。

继承

class 可以通过extends关键字实现继承

class Animal{
    constructor(name){
        this.name = name;
    }
    sayAnimal(){
        console.log('sayAnimal');
    }
    static sayHello(){
        console.log('这是Animal的静态方法');
    }
}
//继承Animal
//extends
class Dog extends Animal{
    constructor(name,age){
        //此时的name是继承自父类
        //super
        //此时的this是指实例对象
        super(name);
        this.age = age;
    }
    sayDog(){
        super.sayAnimal();
    }
    //静态方法
    static sayHi(){
        super.sayHello();
    }
}
let dog = new Dog('terry',18);
// console.log(dog instanceof Animal);//true 继承自Animal

dog.sayAnimal();//sayAnimal
dog.sayDog();//sayAnimal
// dog.sayHello();//TypeError: dog.sayHello is not a function
// dog.sayHi()//TypeError: dog.sayHello is not a function
Dog.sayHi();//这是Animal的静态方法
Dog.sayHello();//这是Animal的静态方法 

class 作为构造函数的语法糖，同时有prototype属性和__proto__属性，因此同时存在两条继承链：

1. 子类的__proto__属性，表示构造函数的继承，总是指向父类。
2. 子类prototype属性的__proto__属性，表示方法的继承，总是指向父类的prototype属性。
   所以实例方法不可以继承父类的静态方法，但静态方法可以。