ES6之class 04注意點

2021-09-10 15:18:26 字數 2294 閱讀 5770

類和模組的內部,預設就是嚴格模式,所以不需要使用use strict指定執行模式。只要你的**寫在類或模組之中,就只有嚴格模式可用。考慮到未來所有的**,其實都是執行在模組之中,所以 es6 實際上把整個語言公升級到了嚴格模式。 

類不存在變數提公升(hoist),這一點與 es5 完全不同。 

new foo(); // referenceerror

class foo {}

上面**中,foo類使用在前,定義在後,這樣會報錯,因為 es6 不會把類的宣告提公升到**頭部。這種規定的原因與下文要提到的繼承有關,必須保證子類在父類之後定義。

;

class bar extends foo

}

上面的**不會報錯,因為bar繼承foo的時候,foo已經有定義了。但是,如果存在class的提公升,上面**就會報錯,因為class會被提公升到**頭部,而let命令是不提公升的,所以導致bar繼承foo的時候,foo還沒有定義。這句話不太好理解,也就是說,現在不會報錯的原因是嚴格保證子類在父類後面定義的。如果class存在提公升,子類就跑到了頭部,let定義的父類,不存在變數提公升,不會跑到頭部,導致子類在父類之前定義,所以出錯。

由於本質上,es6 的類只是 es5 的建構函式的一層包裝,所以函式的許多特性都被class繼承,包括name屬性。

class point {}

point.name // "point"

name屬性總是返回緊跟在class關鍵字後面的類名。

如果某個方法之前加上星號(*),就表示該方法是乙個 generator 函式。

class foo 

* [symbol.iterator]()

}}for (let x of new foo('hello', 'world'))

// hello

// world

上面**中,foo類的symbol.iterator方法前有乙個星號,表示該方法是乙個 generator 函式。symbol.iterator方法返回乙個foo類的預設遍歷器,for...of迴圈會自動呼叫這個遍歷器。 

類的方法內部如果含有this,它預設指向類的例項。但是,必須非常小心,一旦單獨使用該方法,很可能報錯。

class logger `);

} print(text)

}const logger = new logger();

const = logger;

printname(); // typeerror: cannot read property 'print' of undefined

logger.printname();//hello there

上面**中,printname方法中的this,預設指向logger類的例項。但是,如果將這個方法提取出來單獨使用,this會指向該方法執行時所在的環境,因為找不到print方法而導致報錯。

乙個比較簡單的解決方法是,在構造方法中繫結this,這樣就不會找不到print方法了。

class logger 

// ...

}

另一種解決方法是使用箭頭函式。因為使用箭頭函式使,函式體內的this物件,就是定義時所在的物件,而不是使用時所在的物件。

class logger `);

};} // ...

}

ES6之Class學習筆記

prototype 是類或者方法的 方法,proto 是new 之後的例項的方法。constructor方法是類的預設方法,通過new命令生成物件例項時,自動呼叫該方法。乙個類必須有constructor方法,如果沒有顯式定義,乙個空的constructor方法會被預設新增。class point ...

ES6之 Class 的繼承(十二)

super關鍵字 class colorpoint extends point tostring 如果不呼叫super方法,子類就得不到this物件 class point class colorpoint extends point let cp newcolorpoint referenceer...

ES6使用箭頭函式注意點

新事物也是有兩面性的,箭頭函式有他的便捷有他的優點,但是他也有缺點,他的優點是 簡潔,this提前定義,但他的缺點也是這些,比如 太過簡潔,導致不好閱讀,this提前定義,導致無法使用js進行一些es5裡面看起來非常正常的操作。本質來說箭頭函式沒有自己的this,它的this是派生而來的,根據 詞法...