js学习笔记(七)

JavaScript

JavaScript 的类

类

类是面向对象编程中重要的概念，将真实世界中一系列特性相同的事物进行抽象，包含了通用的属性和方法。用于快速的生成对象（特征类似的），可以减少重复代码输入和差错工作量。主要包括继承特性和静态方法的调用。

构造函数constructor()

够造函数用于接收类初始化的参数，并将初始化参数传入到实例（instance：新生成的对象，包含属性和方法），类经由构造函数初始化得到特殊的对象实例。
- 构造函数也是区分类和对象的重要特征。

class animal{   
    constructor(name){  //接收参数的构造函数
    this.name = name   //传入的参数，初始化实例的属性
    this.number = 1   //默认的属性设置
    }
}

利用类的构造函数可以传入参数实例化一系列不同的对象实例，const instance = new class('argv')：

const kitty = new animal('cat') //实例化，传入cat参数作为实例对象name属性，并返回初始化后的实例，存储在前面的kitty对象中
const Tom = new animal('koala')
console.log(kitty.name,Tom.name) //查看实例的name
//实例化需要调用关键字 new

一、类的方法

类中通过函数的方式可以设置一系列方法，同时还可以定义set和get方法来进行赋值和取值操作。
- 与对象类似，可以直接用关键字set，get定义赋值取值方法，间接访问实例内部属性；
- 与对象不同与，不需要,分隔方法，同时定义方法也无需函数关键字，类似于es6标准直接定义（与对象中的函数表达式方法区别）。

class animal{   
    constructor(name){  
    this._name = name   //构造函数初始化实例的属性
    this._number = 1   //_下划线标注，避免外部直接访问
    this._age = 1
    }

    set age(num){
        this._age = num //设置age属性的方法
    }
    set number(num){   //赋值设置number属性的方法
        this._number = num //将_number设置为实参num
    }

    get name(){return this._name} //取属性值
    get age(){return this._age} //取值方法
    get number(){return this._number} //间接访问内部属性

    ageAdd(){   //新增增加年龄的方法
        this._age+=1
    }
}

kitty = new animal('cat') //实例化
console.log(kitty.name)   //get取值方法
console.log(kitty.age,kitty.number)  
kitty.age = 10   //set 赋值方法
kitty.number = 100
console.log(kitty.age,kitty.number)  //查看赋值结果
kitty.ageAdd()   //调用方法
console.log(kitty.age)   //查看调用方法后的结果

二、 继承

当多个类别具有一系列共同的属性和方法时，可以考虑用继承的方式，从父类继承属性和方法给子类。
- 类作为对象的模板，同样父类也可以通过继承作为子类的模板。
- 继承需要使用关键字class child extends parents{}继承父类属性方法，并在构造函数中调用super(params)调用父类的构造函数。

//继承样例
//先将几类共同的特征抽象出一个父类
class Animal{   
    constructor(name){  
    this._name = name   //构造函数初始化实例的属性
    this._number = 1   //_下划线标注，避免外部直接访问
    this._age = 1
    }

    get name(){return this._name} //取属性值
    get age(){return this._age} //取值方法

    static log(){console.log('Animal is wonderful')}  //静态方法只能由类调用，不能由实例调用！
} 

//子类从父类继承 属性和方法
class Dog extends Animal{ //继承父类所有属性和方法
    constructor(name,contry){ //构造函数
        super(name)    //将参数传到父类的构造函数中，利用父类的构造函数

        this._contry = contry //添加的属性
    }

    get contry(){return this._contry} //添加取值方法
    addAge(num){this._age+=num}  //可以操作从父类中集成过来的属性，this指向子类的实例

    static logg(){console.log('Cat family')}    //增加子类的静态方法

}

kitty = new Dog('jerry','us') //实例化，jerry调用了父类的构造函数，us调用了子类的构造函数，增加了新的属性
console.log(kitty.name,kitty.contry) //显示父类取值和子类新增的取值函数结果
kitty.addAge(5)   //子类新增方法调用
console.log(kitty.age)   //显示结果
//kitty.log()   //报错，实例不能调用静态方法
Dog.logg()     //也可调用父类的方法
Dog.log()       //继承了父类的静态方法
Animal.log()  //类直接调用内部静态方法

tips
1.继承时super()方法一定要写在构造函数内第一行，目的是让this指向目前的子类。如果在this指针后调用super会报错。