class類|js

<link rel="stylesheet" href="https://js.how234.com/third-party/SyntaxHighlighter/shCoreDefault.css" type="text/css" /><script type="text/javascript" src="https://js.how234.com/third-party/SyntaxHighlighter/shCore.js"></script><script type="text/javascript"> SyntaxHighlighter.all(); </script>

js class類是什麼呢？一起來看下吧：

class（類）是ECMAScript6中新增的關鍵字，專門用於創建“類”的，“類”可被用於實現邏輯的封裝。傳統面向對象的編程序語言都是“類”的概念，對象都是由類創建出來，然而早期JavaScript中是沒有類的，面向對象大多都是基於構造函數和原型實現的，但是ECMAScript6規範開始增加了“類”相關的語法，使得JavaScript中的面向對象實現方式更加標準。

類的聲明

定義一個類的一種方法是使用一個類聲明，即用帶有class關鍵字的類名（這裏“Rectangle”）函數名和實例化構造名相同且大寫（非強制）

class Person { constructor(x, y) {    this.x = x    this.y = y  }}

函數聲明和類聲明之間的一個重要區別是函數聲明會提升，類聲明不會。需要先進行聲明，再去訪問，否則會報錯

var person= new Person()class Person { constructor(x, y) {    this.x = x    this.y = y  }}// Personis not defined

類聲明不可以重複

class Person {}class Person {}// TypeError Identifier 'Person' has already been declared

類必須使用 new 調用，否則會報錯。這是它跟普通構造函數的一個主要區別，就是後者不用 new 也可以執行

class Person { constructor(x, y) {    this.x = x    this.y = y  }}Person()// TypeError Class constructor Person cannot be invoked without 'new'

類表達式（類定義）

類表達式可以是被命名的或匿名的

/* 匿名類 */ let Person = class {  constructor(x, y) {    this.x = x    this.y = y  }}/* 命名的類 */ let Person = class Person {  constructor(x, y) {    this.x = x    this.y = y  }}

類的方法

constructor 方法

constructor 方法是類的默認方法，透過 new 命令生成對象實例時，自動調用該方法（默認返回實例對象 this）。一個類必須有 constructor 方法，如果沒有顯式定義，一個空的 constructor 方法會被默認添加。一個類只能擁有一個名爲 “constructor” 的特殊方法，如果類包含多個 constructor 的方法，則將拋出 一個 SyntaxError 。

class Person {   constructor(x, y) {    this.x = x    // 默認返回實例對象 this    this.y = y  }  toString() {    console.log(this.x + ', ' + this.y)  }}

注意：

1、在類中聲明方法的時候，方法前不加 function 關鍵字

2、方法之間不要用逗號分隔，否則會報錯

3、類的內部所有定義的方法，都是不可枚舉的（non-enumerable）

4、一個類中只能擁有一個constructor方法

靜態方法

靜態方法可以透過類名調用，不能透過實例對象調用，否則會報錯

class Person {    static sum(a, b) {        console.log(a + b)    }}var p = new Person()Person.sum(1, 2)  // 3p.sum(1,2)     //  TypeError p.sum is not a function

原型方法

類的所有方法都定義在類的 prototype 屬性上面，在類的實例上面調用方法，其實就是調用原型上的方法

原型方法可以透過實例對象調用，但不能透過類名調用，會報錯

class Person { constructor() {  // 默認返回實例對象 this }    sum() {         }    toString() {     console.log('123456')   }}// 給 Person 的原型添加方法Person.prototype.toVal = function() { console.log('I am is toVal')}// 等同於Person.prototype = {  constructor() {},  sum() {},  toString() {}}var p = new Person()p.toString()       // 123456p.toVal()          // I am is toValPerson.toString()  // TypeError Person.toStringis not a functionPerson.toVal()  // TypeError Person.toVal is not a function

實例方法

實例方法也可以透過實例對象調用，但同樣不能透過類名調用，會報錯

class Person {    constructor() {        this.sum = function(a, b) {            console.log(a + b)        }    }}var p = new Person()p.sum(1,2)       // 3Person.sum(1,2)  // TypeError Person.sum is not a function