ES6 Class类的部分理解

ES6 Class类

JavaScript生成实例对象的传统方法是通过构造函数。实例

function Add(x, y) {
  this.x = x;
  this.y = y;
}
Add.prototype.toString = function () {
  return this.x+this.y;
};
var p = new Add(1, 2);

ES6提供了新的写法，引入了类的概念。上面的代码用ES6的class改写。

class Add{
  constructor(x, y) {
    this.x = x;
    this.y = y;
  }
  toString() {
     return this.x+this.y;
  }
}

类Class与ES5不同的地方：
类的内部定义的方法都是不可枚举的，实例。

class Add{
  constructor(x, y) {
    // ...
  }

  toString() {
    // ...
  }
}

Object.keys(Add.prototype)
// []

---

function Add(x, y) {
  this.x = x;
  this.y = y;
}
Add.prototype.toString = function () {
  return this.x+this.y;
};
Object.keys(Add.prototype)
//["toString"]

Class类中一定有个constructor方法，即使没有定义，也会隐性的添加constructor方法。

class Add{
}

// 等同于
class Add {
  constructor() {}
}

类的实例
通过new命令，生成类的实例。

与 ES5 一样，实例的属性除非显式定义在其本身（即定义在this对象上），否则都是定义在原型上（即定义在class上）。
function Add(x, y) {
  this.x = x;
  this.y = y;
}
Add.prototype.toString = function () {
  return this.x+this.y;
};
var add = new Add(1, 2);
add.toString() //3

add .hasOwnProperty('x') // true
add .hasOwnProperty('y') // true
add .hasOwnProperty('toString') // false
add .__proto__.hasOwnProperty('toString') // true

x和y都是实例对象add自身的属性，所以hasOwnProperty方法返回true
toString是原型对象的属性（因为定义在Add类上），所以hasOwnProperty方法返回false