zoukankan      html  css  js  c++  java
  • es6入门

      http://es6.ruanyifeng.com/#docs/class#%E7%AE%80%E4%BB%8B

    知识要点:
    1,类的由来,其实就是es5构造函数 
    es5: 
    function Point(x, y) {
      this.x = x;
      this.y = y;
    }
    
    Point.prototype.toString = function () {
      return '(' + this.x + ', ' + this.y + ')';
    };
    
    var p = new Point(1, 2);
    es6:
    class Point {
      constructor(x, y) {
        this.x = x;
        this.y = y;
      }
    
      toString() {
        return '(' + this.x + ', ' + this.y + ')';
      }
    }

    ES6 的类,完全可以看作构造函数的另一种写法。
    class Point {
      // ...
    }
    
    typeof Point // "function"
    Point === Point.prototype.constructor // true

    上面代码表明,类的数据类型就是函数,类本身就指向构造函数。

    使用的时候,也是直接对类使用new命令,跟构造函数的用法完全一致。

    class Bar {
      doStuff() {
        console.log('stuff');
      }
    }
    
    var b = new Bar();
    b.doStuff() // "stuff"
    构造函数的prototype属性,在 ES6 的“类”上面继续存在。事实上,类的所有方法都定义在类的prototype属性上面。
    class Point {
      constructor() {
        // ...
      }
    
      toString() {
        // ...
      }
    
      toValue() {
        // ...
      }
    }
    
    // 等同于
    
    Point.prototype = {
      constructor() {},
      toString() {},
      toValue() {},
    };
    

     所以:

    在类的实例上面调用方法,其实就是调用原型上的方法。

    class B {}
    let b = new B();
    
    b.constructor === B.prototype.constructor // true
    上面代码中,bB类的实例,它的constructor方法就是B类原型的constructor方法。  
    由于类的方法都定义在prototype对象上面,所以类的新方法可以添加在prototype对象上面。Object.assign方法可以很方便地一次向类添加多个方法。
    class Point {
      constructor(){
        // ...
      }
    }
    
    Object.assign(Point.prototype, {
      toString(){},
      toValue(){}
    });

    prototype对象的constructor属性,直接指向“类”的本身,这与 ES5 的行为是一致的。
    所以:
    Point.prototype.constructor === Point // true

    另外,类的内部所有定义的方法,都是不可枚举的(non-enumerable)。
    class Point {
      constructor(x, y) {
        // ...
      }
    
      toString() {
        // ...
      }
    }
    
    Object.keys(Point.prototype)
    // []
    Object.getOwnPropertyNames(Point.prototype)
    // ["constructor","toString"]

    上面代码中,toString方法是Point类内部定义的方法,它是不可枚举的。这一点与 ES5 的行为不一致。
    var Point = function (x, y) {
      // ...
    };
    
    Point.prototype.toString = function() {
      // ...
    };
    
    Object.keys(Point.prototype)
    // ["toString"]
    Object.getOwnPropertyNames(Point.prototype)
    // ["constructor","toString"]
    上面代码采用 ES5 的写法,toString方法就是可枚举的。

    constructor 方法

    constructor方法是类的默认方法,通过new命令生成对象实例时,自动调用该方法。一个类必须有constructor方法,如果没有显式定义,一个空的constructor方法会被默认添加。

     
  • 相关阅读:
    【杭电】[2016]数据的交换输出
    【杭电】[2015]偶数求和
    【杭电】[2015]偶数求和
    【杭电】[2026]首字母变大写
    【杭电】[2026]首字母变大写
    【杭电】[2075]A|B?
    【杭电】[2075]A|B?
    【杭电】[2043]密码
    【杭电】[2043]密码
    SQL 06: 内连接 (多表查询)
  • 原文地址:https://www.cnblogs.com/zwjun/p/11563458.html
Copyright © 2011-2022 走看看