美文网首页
ES6 的 class 和构造函数的区别

ES6 的 class 和构造函数的区别

作者: 小灰灰_a | 来源:发表于2020-09-23 20:16 被阅读0次

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

相关文章

  • 前端JS进阶二(ES6-Class语法)

    Class和普通构造函数有何区别 前端会使用ES6中的Class来代替JS中的构造函数 JS 构造函数 Class...

  • ES6 类和ES5 构造函数

    ES5的构造函数和ES6的Class区别 ES5的构造函数的原型上的属性和方法可以遍历/ES6 不能够遍历 ES6...

  • 构造函数与class实现类的区别,以及ES5实现ES6的clas

    构造函数与class实现类的区别 首先聊聊ES6 class定义的类和用构造函数new出来的类的一些不同之处 cl...

  • ES6 class类

    ES6 class类知识点梳理 大概从几个方面来讲解ES6 class类和传统的构造函数的区别。 必须要有cons...

  • ES6 中 class 与构造函数的关系

    ES6 中 class 与构造函数的关系class 为 构造函数的语法糖,即 class 的本质是 构造函数。c...

  • JS面试题

    1.ES5和ES6的关于构造函数的区别 Es6中的class语法就是Es5中构造函数的另一种写法,一种更高级的写法...

  • 面向对象

    一、es6的面向对象 1、class关键字,类和构造器分开了2、class里面直接加方法 以前的构造函数 es6:...

  • ES6 class与继承

    class是什么 class是定义类的方法。ES6之前用构造函数的方式定义类,ES6引入了class。 class...

  • javascript中的class

    ES5 定义构造函数 通过构造函数加属性,通过原型加方法: ES6 Class语法 class 实际上是语法糖,编...

  • 构造函数相关笔记

    es5环境下写构造函数 继承 es6环境下的构造函数 继承 class的set和get clsss的静态方法

网友评论

      本文标题:ES6 的 class 和构造函数的区别

      本文链接:https://www.haomeiwen.com/subject/naytuktx.html