ES6-Class

作者: 黑色的五叶草 | 来源:发表于2019-09-27 15:26 被阅读0次

(参考自秒味课堂的视频讲解)

Class

1.ES5中的原型

  • const Miaov = function ( ) { } 为构造函数
  • constructor: Miaov 为指针
  • Miaov.prototype 为原型对象
  • const miaov = new Miaov(); 为构造函数Miaov创建的实例
  • ES5中的原型

2.ES6中的原型

  • class Miaov { } 为声明一个Miaov的类
  • constructor () { }Miaov这个类的构造函数,里面存放的是它的实例属性
  • print () { } 为原型对象上的print方法
  • const miaov = new Miaov(); 为构造函数Miaov创建的实例
    ES6中的原型
  1. typeof Miaov 返回的是一个function
  2. 方法之间不需要加逗号分隔,加了会报错
  3. 定义在类上的方法都是不能被枚举的 Object.keys(Miaov.proto)

Class的继承

  • static 指明类的静态方法
  • extends 继承一个类 Class A extends B声明一个类A继承自B类
  • super
    • 作用一:子类继承父类时,super()可以当做函数去使用。相当于调用了父类的构造函数constructor() { }。子类继承父类时不仅会继承构造函数的属性,还会继承父类static声明的静态方法
      ES6规定:在子类每调用super之前,子类没有自己的this
    • 作用二:super.methods() super调用一个方法,此时super指向父类的原型对象
      return this 可以在实例化的时候 方便调用其他方法
class Cake {
    constructor(name) {
        this.name = name
    }

    sayName() {
        console.log(this.name);
    }
}

class MilkCake extends Cake {
    constructor(name, tatst) {
        super(name)
        this.tatst = tatst
    } 
}

const c = new MilkCake('lida', 'good')
console.log(c);        // MilkCake { name: 'lida', tatst: 'good' }

相关文章

  • ES6-class

    javascript的语言传统方法是通过构造函数,定义并生成新的对象: function point(x,y){ ...

  • ES6-Class

    (参考自秒味课堂的视频讲解) Class 1.ES5中的原型 const Miaov = function ( )...

  • ES6-Class

    Class 的基本语法 ECMAScript 的原生构造函数大致有下面这些: Boolean() Number()...

  • ES6-class

    取值函数和存值函数; class MyClass{ constructon(){} get prop(){ ret...

  • ES6-class

  • ES6-class

    ES6提供了更接近传统语言的写法,引入了class(类)这个概念。新的class写法让对象原型的写法更加清晰、更像...

  • es6-class类

    1. 类的基本用法 es5造类 es6造类 2. 类的继承 使用extends关键字

  • ES6-class、extends、super

    ES6中 有了Class(类的概念),这使得原型、构造函数,继承等显得更加简单

  • es6-class的使用

    1\class的简介:ES6 的类,完全可以看作构造函数的另一种写法。 class Point {// ...} ...

  • ES6-Class的继承

    1、基本语法 ES6中的继承直接通过extends关键字来实现继承; 子类的constructor中必须显示调用s...

网友评论

      本文标题:ES6-Class

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