成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

淺析ES6新特性 —— Class

LiveVideoStack / 3378人閱讀

摘要：如下示例構(gòu)造函數(shù)實(shí)例化對(duì)象新特性使用類實(shí)例化對(duì)象引入了類這一概念，可以通過關(guān)鍵字，定義類。否則報(bào)錯(cuò)，這是類和構(gòu)造函數(shù)的一個(gè)主要區(qū)別。其實(shí)，的類，可以看作是構(gòu)造函數(shù)的另外一種寫法。

前言

類語法是ES6中新增的一個(gè)亮點(diǎn)特性，下文簡單對(duì)類的使用進(jìn)行簡要說明（僅作為個(gè)人層面的理解）

js傳統(tǒng)模式實(shí)例化對(duì)象方法——prototype

在JavaScript中，實(shí)例化一個(gè)對(duì)象的傳統(tǒng)使用方法是通過構(gòu)造函數(shù)。
如下示例：

function Count(num1,num2){
    this.num1 = num1;
    this.num2 = num2;
}
//構(gòu)造函數(shù)
Count.prototype.number = function(){
    console.log(this.num1,this.num2);
}
//實(shí)例化對(duì)象
var count = new Count(1,2);
count.number(1,3);
ES6新特性——使用Class（類）實(shí)例化對(duì)象

ES6引入了Class(類)這一概念，可以通過class關(guān)鍵字，定義類。
如下示例：

//定義類
class Count{

    //構(gòu)造方法
    constructor(x,y){
        //this表示實(shí)例對(duì)象
        this.x = x;
        this.y = y;
    }
    
    //非靜態(tài)方法，可以直接用實(shí)例.方法名來訪問
    sum(x,y){
        let sum = x+y;
        console.log("sum is :",sum)
    }
    
    //靜態(tài)方法，需要通過構(gòu)造器或者類才能訪問的到
    static sub(x,y){
        let sub = x - y;
        console.log("sub is :",sub);
    }
}

var count = new Count();

//非靜態(tài)方法，可以直接訪問
count.sum(1,2);                         // sum is :3

//靜態(tài)方法：
//（1）實(shí)例對(duì)象.constructor.方法名
count.constructor.sub(5,1);             // sub is :4

//（2）類名.方法名
Count.sub(5,1);                         // sub is :4

count.hasOwnProperty("x");              // 定義在this上，是實(shí)例對(duì)象自身的屬性true
count.hasOwnProperty("y");              // true
count.hasOwnProperty("sum");            // 定義在原型對(duì)象上，false
count._proto_.hasOwnProperty("sum");    // true

通過以上的小實(shí)例，總結(jié)下面幾點(diǎn):

定義“類”的方法時(shí)，不用加function關(guān)鍵字。

方法之間不要加逗號(hào)，加了會(huì)報(bào)錯(cuò)。

類中必須要有constructor方法，若沒有顯示定義，則一個(gè)空的會(huì)被添加。

類必須使用new調(diào)用。否則報(bào)錯(cuò)，這是類和構(gòu)造函數(shù)的一個(gè)主要區(qū)別。

類中使用static關(guān)鍵字聲明的方法，需要通過構(gòu)造函數(shù)constructor或者使用類名才可以訪問的到。

靜態(tài)方法，實(shí)例對(duì)象不能直接訪問。但是父類的靜態(tài)方法，子類可以繼承。

非靜態(tài)方法，可以直接通過“實(shí)例對(duì)象.方法名”訪問。

實(shí)例自身的屬性，除非顯示定義在this對(duì)象上，否則都是定義在原型上（即class上）。

其實(shí)，ES6的類，可以看作是構(gòu)造函數(shù)的另外一種寫法。

class B{}
var b = new B();
typeof B;               //`function`
typeof  B === B.prototype.constructor                   //true
typeof  b.constructor === B.prototype.constructor      //true

對(duì)比ES6和ES5，有以下相同點(diǎn)

類的數(shù)據(jù)類型就是函數(shù)，類本身就指向構(gòu)造函數(shù)。

在類的實(shí)例上調(diào)用方法，就是調(diào)用原型上的方法。

再來看ES6與ES5的不同點(diǎn)

由于類的方法都定義在prototype上面，那么我們可以使用Object.assign方法給類一次添加多個(gè)方法。prototype的constructor方法，直接指向“類”本身，這和ES5的行為是有區(qū)別的。另外，類內(nèi)部所有定義的方法，都是不可枚舉的，而ES5中，prototype上的方法都是可枚舉的。
示例如下：
//ES5
function Test(){}
Test.prototype.log = function(){}
var test = new Test();

Object.keys(Test.prototype);    //列舉出給定對(duì)象自身可枚舉屬性(不包括原型上的屬性)   
//["log"]

Object.getOwnPropertyNames(Test.prototype);      //列舉出給定對(duì)象所有自身屬性的名稱（包括不可枚舉屬性但不包括Symbol值作為名稱的屬性）  
//["prototype","log"]



//ES6
class Test2{
    toValue(){}
}
var test2 = new Test2();

Object.keys(Test2.prototype);
//[]

Object.getOwnPropertyNames(Test2.prototype);
//["constructor","toValue"];
Class的靜態(tài)方法 
類中所定義的方法，都會(huì)被實(shí)例繼承，如果在一個(gè)方法前，加上static關(guān)鍵字，那該靜態(tài)方法不會(huì)被實(shí)例繼承，而是直接通過類來調(diào)用的。
class Foo{
    static addMethod(){
        console.log(this);
        console.log("hello class");
        this.
    }
}

//直接通過類來調(diào)用
Foo.addMethod();        //Foo ,  hello class

//實(shí)例不會(huì)繼承靜態(tài)方法，所以調(diào)用會(huì)報(bào)錯(cuò)
var foo = new Foo();
foo.addMethod();    //TypeError:foo.addMethod is not a function

注意：

如果static靜態(tài)方法包含this關(guān)鍵字，這個(gè)this指的是類，而不是實(shí)例。

靜態(tài)方法可以與非靜態(tài)方法同名。

父類的靜態(tài)方法，可以被子類繼承。

靜態(tài)方法可以從super對(duì)象上調(diào)用。

待續(xù)……

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/93399.html

相關(guān)文章

  • ES6 Proxy/Reflect 淺析

    摘要：即必須有返回值其中可接受三個(gè)參數(shù)，為目標(biāo)對(duì)象，為屬性名，為實(shí)際接受的對(duì)象，默認(rèn)為本例中新建的，如果單獨(dú)指出一個(gè)對(duì)象，可使指出對(duì)象受到相同的方法作用。且中的必須有返回值，的不用，這也正是因?yàn)樵谒筮€會(huì)執(zhí)行所以不需要。 ES6 Proxy/Reflect Proxy 攔截器 proxy是es6的新特性，簡單來講，即是對(duì)目標(biāo)對(duì)象的屬性讀取、設(shè)置，亦或函數(shù)調(diào)用等操作進(jìn)行攔截（處理）。 let...

    Juven 評(píng)論0 收藏0

  • ES6淺析之路一

    摘要：特點(diǎn)是塊級(jí)作用域的特點(diǎn)得到明顯的體現(xiàn)再看一個(gè)中的循環(huán)變量泄露為全局變量很明顯成了全局變量。本人目前了解的還不夠深比如中添加一個(gè)新的詞匯暫時(shí)性死區(qū)，簡稱。 (個(gè)人理解ES6就是對(duì)ES5的BUG修改和升級(jí))廢話不多說今天要探討的是 var與letECMAScript 6 入門 作者：阮一峰 下面是個(gè)人總結(jié)：let不允許在相同作用域內(nèi)，重復(fù)聲明同一個(gè)變量。let 特點(diǎn)是塊級(jí)作用域 先來看一...

    BetaRabbit 評(píng)論0 收藏0

  • generator探幽(1)--koa中間件機(jī)制淺析

    摘要：當(dāng)運(yùn)行到時(shí)，不會(huì)暫停，而是直接跳進(jìn)函數(shù)執(zhí)行函數(shù)內(nèi)的代碼。由于函數(shù)中沒有，因此會(huì)一直執(zhí)行完函數(shù)中的代碼，并返回至函數(shù)中執(zhí)行后面的代碼。 本系列旨在通過對(duì)co，koa等庫源碼的研究,進(jìn)而理解generator在異步編程中的重大作用(ps:所有代碼請(qǐng)?jiān)趎ode --harmony或者iojs環(huán)境中運(yùn)行) koa中間件的形式 相信用過koa的小伙伴一定很熟悉下面這段代碼 var app ...

    Jensen 評(píng)論0 收藏0

  • 淺析es6-promise源碼

    摘要：主要邏輯本質(zhì)上還是回調(diào)函數(shù)那一套。通過的判斷完成異步和同步的區(qū)分。 主要邏輯: 本質(zhì)上還是回調(diào)函數(shù)那一套。通過_subscribers的判斷完成異步和同步的區(qū)分。通過 resolve，reject -> publish -> invokeCallback -> resolve，reject的遞歸和下一條then的parent是上一條的child來完成then鏈的流轉(zhuǎn) 同步情況...

    fox_soyoung 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<