美文网首页
ES6 类和ES5 构造函数

ES6 类和ES5 构造函数

作者: sunny519111 | 来源:发表于2018-03-21 17:48 被阅读277次

ES5的构造函数和ES6的Class区别

  1. ES5的构造函数的原型上的属性和方法可以遍历/ES6 不能够遍历
  2. ES6的类必须通过new调用,构造函数则可以不用
  3. 类不存在变量提升
  4. ES6的类没有私有方法和私有属性(正在提议中)
  5. class多了一个静态方法(static),里面的this指向的是类本身,静态方法可以被子类继承
  6. ES6的静态属性和静态方法
  7. ES6 类多了一个new Target 可以判定new 的构造函数

ES6的继承

实质区别

ES5的继承是通过先创建子类的实例对象this,然后再将父类的属性和方法添加到this上,ES6的实现有所不同,它是先创建父类的实例对象this(通过super方法),然后通过子类的构造函数修改this。

  1. 在super方法调用前,不能使用this

  2. 静态方法也会被子类继承

    class A {
        static hello() {
            console.log('hello')
        }
    }
    class B extends A {
        
    }
    B.hello()
    
  3. super关键字

    • 作为函数的时候,代表父类的构造函数,ES6 规定,子类的构造函数必须执行一次super函数。并且只能在子类的构造函数中使用,用在其他地方会报错。

      // 在子类中调用的时候,this指向的是子类的实例
      super()  ==> A.prototype.constructor.call(this)
      
    • 作为对象的时候,在子类的普通方法中,代表父类的原型对象,在静态方法中,代表父类

相关文章

  • ES5 和 ES6 继承比较:

    ES5构造函数和继承: ES6构造函数和继承:

  • Js 中的类

    ES5中,使用构造函数是这样的: ES6中,构造函数 上面中constructor就是构造方法。注意定义类的方法时...

  • es5实现class类

    es5没有类,只有构造函数。ES6新增了class,用于创建类。本文通过es5来实现es6的class(一个Ani...

  • ES6 类和ES5 构造函数

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

  • ES6 的知识点学习笔记(2) - class 静态方法 继承

    在之前的 ES5 中, 是没有类 (class) 的概念的,例子: ES5 构造函数 Person ES6 cla...

  • ES6——类(Class)

    ES5关于类 JavaScript 语言中,生成实例对象的传统方法是通过构造函数。 ES6关于类 ES6 提供了更...

  • js 中的类

    ES5 中定义一个类 ES6以后的语法(可以看做是ES5的语法糖) ES6 的类,完全可以看作构造函数的另一种写法...

  • 26- class 类与继承

    1、ES5 中基于原型的构造函数 2、ES6 的 class关键字 ES6 引入了 Class(类)这个概念,作为...

  • ES6面向对象

    1、ES6面向对象: class(类) 构造函数 对象 实例对象 ES5面向对象是模拟面向对象。 2、继...

  • JavaScript-13 ES6和对象

    ES6类和对象 在ES6之前如果定义一个类? 通过构造函数来定义一个类 在ES6之前定义类就是构造函数,静态属性和...

网友评论

      本文标题:ES6 类和ES5 构造函数

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