JS CLass類


1、ES6提供了更接近傳統語言的寫法,引入了Class(類)這個概念,作為對象的模板。通過class關鍵字,可以定義類。

2、

復制代碼
//定義類
class Point {
  constructor(x, y) {
    this.x = x;
    this.y = y;
  }

  toString() {
    return '(' + this.x + ', ' + this.y + ')';
  }
}
復制代碼

上面代碼定義了一個“類”,可以看到里面有一個constructor方法,這就是構造方法,而this關鍵字則代表實例對象。也就是說,ES5的構造函數Point,對應ES6的Point類的構造方法。

3、定義“類”的方法的時候,前面不需要加上function這個關鍵字,直接把函數定義放進去了就可以了。另外,方法之間不需要逗號分隔,加了會報錯。

4、構造函數的prototype屬性,在ES6的“類”上面繼續存在。事實上,類的所有方法都定義在類的prototype屬性上面。

復制代碼
class Point {
  constructor(){
    // ...
  }

  toString(){
    // ...
  }

  toValue(){
    // ...
  }
}

// 等同於

Point.prototype = {
  toString(){},
  toValue(){}
};
復制代碼

5、Object.assign方法可以很方便地一次向類添加多個方法。

復制代碼
class Point {
  constructor(){
    // ...
  }
}

Object.assign(Point.prototype, {
  toString(){},
  toValue(){}
});
復制代碼

6、類的內部所有定義的方法,都是不可枚舉的(non-enumerable)。這一點與ES5的行為不一致。

7、類的屬性名,可以采用表達式。

復制代碼
let methodName = "getArea";
class Square{
  constructor(length) {
    // ...
  }

  [methodName]() {
    // ...
  }
}
復制代碼

上面代碼中,Square類的方法名getArea,是從表達式得到的。

8、constructor方法是類的默認方法,通過new命令生成對象實例時,自動調用該方法。一個類必須有constructor方法,如果沒有顯式定義,一個空的constructor方法會被默認添加。constructor方法默認返回實例對象(即this),完全可以指定返回另外一個對象。

9、類的構造函數,不使用new是沒法調用的,會報錯。

10、可以通過實例的__proto__屬性為Class添加方法。

復制代碼
var p1 = new Point(2,3);
var p2 = new Point(3,2);

p1.__proto__.printName = function () { return 'Oops' };

p1.printName() // "Oops"
p2.printName() // "Oops"

var p3 = new Point(4,2);
p3.printName() // "Oops"
復制代碼

11、使用實例的__proto__屬性改寫原型,必須相當謹慎,不推薦使用,因為這會改變Class的原始定義,影響到所有實例。

12、Class不存在變量提升(hoist)。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM