ES6 的 class 和构造函数的区别

class testC {

    constructor(props) {

        this.name = 'xhh'

        this.ages = 22

        console.log('先初始化父类this', 1);

    }

    say () {

        console.log(this.name);

    }

    age () {

        console.log(this.age);

    }

}

class testC1 extends testC {

    constructor(props) {

        super(props);

        console.log('先初始化子类this', 2);


    }

}

var ttC = new testC1(234)

var tt1C = new testC(234)

for (const key in tt1C) {

    console.log(key);

}

function test () {

    this.name = 'xhh'

    this.ages = 22

    console.log('先初始化父类this', 2);

}

test.prototype.say = function () {

    console.log(this.name);

}

test.prototype.age = function () {

    console.log(this.age);

}

function test1 () {

    this.sex = 'man'

    console.log('先初始化子类this', 1);

    test.call(this)

}

var tt = new test1()

var tt1 = new test()

for (const key in tt1) {

    console.log(key);

}

// ******* ES5 的继承先生成了子类实例,再调用父类的构造函数修饰子类实例。ES6 的继承先 生成父类实例,再调用子类的构造函数修饰父类实例。这个差别使得 ES6 可以继承内置对象。

// *******  说明 ES5 prototype添加方法可以被枚举, class的添加的方法不可被枚举

// tt1 打印出如下:

// 先初始化父类this 2

// name

// ages

// say

// age

// tt1C 打印出如下:

// 先初始化子类this 1

// name

// ages

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。