摘要:類基本概念,記錄以便自己后面加深理解了解類是什么是什么不妨寫一個看看的原型可以看到這三個屬性都是不可遍歷的并且與類相比就多了一個原型鏈。和靜態(tài)方法中是一樣的得是哪個類就返回哪個類本類不能實例化報錯正確
類class
基本概念,記錄以便自己后面加深理解
了解類是什么class是什么?不妨寫一個看看
class Demo { constructor() { this.a = 1; this.b = this.f; } f() { return this; } } Demo.prototype; //{ // constructor: class Demo // f: ? f() // __proto__: Object }
Demo的原型可以看到這三個屬性都是不可遍歷的并且與Demo類相比就多了一個__proto__原型鏈。我們再new一個Demo看一下
let o = new Demo(); console.log(Object.getPrototypeOf(o)); //{ // constructor: class Demo // f: ? f() // __proto__: Object }
實際上Demo類相當于Demo實例的原型
class中的constructor在我看來
constructor() { this.a = 1; this.b = this.f; }
這部分相當于es5中構(gòu)造函數(shù)的作用,在new的過程中對this進行賦值,并返回this也就成了實例對象
因此你在constructor中return了一個對象且不等于null那么實例對象就是return的值,和es5構(gòu)造函數(shù)一樣的效果
f() { return this; }
這個方法最終屬于在實例對象的原型鏈上不可遍歷方法,因此也能被實例對象使用
新知識點 class的靜態(tài)方法
表示該方法不會被實例繼承,而是直接通過類來調(diào)用
class Demo { constructor() { this.a = this; this.b = this.f; } static g() { return this; } static f() { return this; } } let o = new Demo(); //console.log(o.b()); //not a function //console.log(o.g()); //not a function Demo.g() === Demo; //true
靜態(tài)方法中的this指向類自己,而this.a = this則指向?qū)嵗龑ο笞约?/p>
靜態(tài)方法可以被子類繼承
class Foo { static classMethod() { return "hello"; } } class Bar extends Foo { } Bar.classMethod() // "hello"
靜態(tài)方法可以從super對象上調(diào)用
class Foo { static classMethod() { return "hello"; } } class Bar extends Foo { static classMethod() { return super.classMethod() + ", too"; } } Bar.classMethod() // "hello, too"
Class 內(nèi)部只有靜態(tài)方法,沒有靜態(tài)屬性
class表達式的立即執(zhí)行寫法var o = new class { constructor(n) { this.a = n; this.b = this.f; } g() { return n; } f() { return this; } }(1) o.a; // 1
class類聲明不存在變量提升
new.target 屬性是在new后返回一個對象,例如es5中構(gòu)造函數(shù)f不是通過new調(diào)用返回undefined,通過new調(diào)用返回構(gòu)造函數(shù)自己
function f() { return new.target; } console.log((new f()) === f); //true
而class類中,則返回class自身。和靜態(tài)方法中this是一樣的;new得是哪個類就返回哪個類
class Shape { constructor() { if (new.target === Shape) { throw new Error("本類不能實例化"); } } } class Rectangle extends Shape { constructor(length, width) { super(); // ... } } var x = new Shape(); // 報錯 var y = new Rectangle(3, 4); // 正確
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://m.hztianpu.com/yun/98669.html
類繼承 看類繼承前,先回顧構(gòu)造函數(shù)怎么實現(xiàn)對象的繼承的 function F() { this.a = 1; } function Son() { F.call(this); } function inherit(S, F) { S.protot...
摘要:變量的解構(gòu)賦值更加便利的從匿名對象或者數(shù)組中,對變量進行賦值數(shù)組的解構(gòu)賦值基本樣式,右邊數(shù)據(jù)類型必須是可迭代的類型。 變量的解構(gòu)賦值 更加便利的從匿名對象或者數(shù)組中,對變量進行賦值; 數(shù)組的解構(gòu)賦值 基本樣式,右邊數(shù)據(jù)類型必須是可迭代的類型。 let a = 1, b = 2, c = 3; //等價于 //let [a, b, c] = [1, 2, 3]; 對...
摘要:學習筆記一入門篇最近正在看高級程序設(shè)計,一直沒來得及總結(jié)一下,順便對之前看的編程藝術(shù)進行一些簡單的總結(jié),如有一些不正確的地方還請多指出討論。其他字符可以是字母下劃線美元符號或者數(shù)字。 JavaScript 學習筆記一 (入門篇) 最近正在看《JavaScript高級程序設(shè)計》,一直沒來得及總結(jié)一下,順便對之前看的《JavaScript DOM編程藝術(shù)》進行一些簡單的總結(jié),如有一些不正...
摘要:也就是說,遍歷器對象本質(zhì)上,就是一個指針對象。執(zhí)行這個函數(shù),就會返回一個遍歷器。一個對象如果要有可被循環(huán)調(diào)用的接口,就必須在的屬性上部署遍歷器生成方法原型鏈上的對象具有該方法也可。后面跟的是一個可遍歷的結(jié)構(gòu),它會調(diào)用該結(jié)構(gòu)的遍歷器接口。 ES6 Iterator筆記(摘抄至阮一峰的ECMAScript 6入門) Iterator的遍歷過程 創(chuàng)建一個指針對象,指向當前數(shù)據(jù)結(jié)構(gòu)的起始位...
閱讀 3220·2021-11-15 18:14
閱讀 1853·2021-09-22 10:51
閱讀 3365·2021-09-09 09:34
閱讀 3583·2021-09-06 15:02
閱讀 1122·2021-09-01 11:40
閱讀 3251·2019-08-30 13:58
閱讀 2583·2019-08-30 11:04
閱讀 1152·2019-08-28 18:31