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