2020.6.4小垃圾整理的ES6class基本语法与继承

class基本语法与继承

1.关于class

定义一个类

class Person{
    constructor(skin,language){
        this.skin=skin;
        this.language=language;
    }
    say(){
        console.log('I am a Person')
    }
}

由于class本质还是一个function 因此它就会拥有一个prototype属性，当new一个class时，会把class的porototype属性赋值给这个新对象的 proto属性。（prototype是函数的一个属性，它是一个指针。对于构造函数来说，prototype是作为构造函数的属性。prototype也可以是一个对象，prototype是对象实例的原型对象。所以prototype即是属性，又是对象。在new一个对象时,可以理解为一个对象没有ptototype属性，所以把ptototype给一个对象的 proto。

console.log(typeof Person); // function
let p = new Person('unkown','unknown');
console.log(p); // Person {skin: "unkown", language: "unknown"}
console.log( __proto__==Person.prototype); // ture

new一个对象时，会经历以下几个步骤（摘自javascript高级程序设计）：

• （1）创建一个对象；

• （2）将构造函数的作用域赋值给新对象（因此this就指向了这个新对象）；

• （3）执行构造函数中的代码（为这个新对象添加属性）；

• （4）返回新对象

由此可见console.log§的结果。

2.constructor方法

constructor 方法是默认的方法，在new一个对象时，自动调用该方法。在一个类中必须有一个constructor，如果没有定义，则会默认添加一个。

constructor() {}

3.class的继承

面向对象的一个特征就是继承,在没使用exends关键字时,js的继承使用的是改变子类的原型对象完成继承代码如下:

function User(name,age){
    this.name=name
    this.age=age
}
User.prototype.show=function(){
    console.log("这是一个用户")
}
function VipUser(type){
    this.type=type
}
VipUser.prototype=new User("joker",'age')
VipUser.prototype.constructor=VipUser
let vipUser=new VipUser("ViP")jav

而使用extends就简单多了

class User {
    constructor(name,age){
        this.name=name
        this.age=age
    }
    show(){
        console.log("这是一个普通用户")
    }
}
class VipUser extends User{
    constructor(name,age,type){
        super(name,age)//调用父类的构造
        this.type=type
    }
    show(){
        "这是一个vip用户"
    }
}
let vipUser=new VipUser("joke","20","vip")

//其中super必须写,表示从父类的构造中获取数据
如果子类没有构造方法则会调用一个默认的构造方法

class VipUser extends User {
}

// 等同于
class VipUser extends User {
  constructor(...args) {
    super(...args);
  }
}

其中super表示父级对象,可以通过super重写父级方法

class VipUser extends User{
    constructor(name,age,type){
        super(name,age)//调用父类的构造
        super.show=function(){
            console.log("这是一个vip用户")
        }
    }
}

4.实例化子类对象

实例化子类对象时，子类对象可以拥有父类的属性和方法，子类对象还可以拥有自己的属性和方法。比如chinese 继承了父类的say方法，还拥有自己的chinese say方法。最后两行代码表示

• 1）子类的proto属性,表示构造函数的继承，总是指向父类。
• 2）子类的prototype属性的proto属性表示方法的继承，总是指向父类的prototype属性-----摘自阮一峰老师的ES6入门

let american = new American('white','English');
let chinese =new Chinese('yellow','chinese','changsha');
chinese.say();//I am a Person
chinese.chinesesay();//I am a Person   I am a Chinese
console.log(American.__proto__===Person);//true 
console.log(American.__proto__);//父类对象
console.log(American.prototype.__proto__===Person.prototype);//true