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

資訊專欄INFORMATION COLUMN

es6 - 類

notebin / 2131人閱讀

摘要：創(chuàng)建自定義類型看下面一段代碼上面代碼使用創(chuàng)建了一個(gè)自定義類型，是這個(gè)類的構(gòu)造器，是類的公共方法。注意事項(xiàng)在使用類繼承的實(shí)現(xiàn)中，需要注意的點(diǎn)是如果子類沒有重寫方法，默認(rèn)會調(diào)用父類的構(gòu)造器方法。

es6 類-class

與大多正規(guī)的面向?qū)ο缶幊陶Z言不同(比如java)，js在創(chuàng)建之初就不支持類。js的面向?qū)ο缶幊虒?shí)現(xiàn)方式是通過構(gòu)造函數(shù)和原型來實(shí)現(xiàn)的。

我之前以為es6引入類的概念將會帶給這門語言極大的改變。后來才發(fā)現(xiàn)es6類的特性只是一種語法糖，使得js創(chuàng)建自定義類型和傳統(tǒng)的面向?qū)ο笳Z言語法上更為相似，其內(nèi)部機(jī)理和之前構(gòu)造函數(shù)-原型模式本質(zhì)上是一樣的。但是，es6 類的特性依然是值得掌握的，它使得js語言更加的嚴(yán)謹(jǐn)，消除了一些可能導(dǎo)致出錯的狀況。

語法

類的創(chuàng)建依賴于class和constructor兩個(gè)關(guān)鍵字，下面介紹下類創(chuàng)建的語法。

創(chuàng)建自定義類型

看下面一段代碼：

class Person{
    constructor(name, age){
        this.name = name;
        this.age = age;
    }
    sayName(){
        console.log(this.name);
    }
}

上面代碼使用class創(chuàng)建了一個(gè)自定義類型Person，constructor是這個(gè)類的構(gòu)造器，sayName是類的公共方法。它和下面一段代碼是等價(jià)的。

function Person(name, age){
    this.name = name;
    this.age = age;
}
Person.prototype.sayName = function(){
    console.log(this.name);
}

二者在使用上完全相同，比如：創(chuàng)建一個(gè)Person的實(shí)例 new Person("icode007")等。一些小的差別主要有下面幾點(diǎn)：

使用class創(chuàng)建的類只能使用new來調(diào)用，而后者可以作為普通函數(shù)調(diào)用。

class沒有聲明提升，后者作為函數(shù)會有聲明提升。

類聲明中的代碼自動運(yùn)行在嚴(yán)格模式下。

類的所有方法都是不可枚舉的。

類表達(dá)式

與函數(shù)類似，類也具有兩種形式，類聲明和類表達(dá)式。

let Person = class{
    constructor(name, age){
        this.name = name;
        this.age = age;
    }
    sayName(){
        console.log(this.name);
    }
}

let person = new Person("icode007");

類表達(dá)式在使用上與類聲明幾乎沒有區(qū)別。

類的訪問器屬性

使用get和set關(guān)鍵字可以為類定義訪問器屬性。

let Person = class{
    constructor(firstname, lastname){
        this.firstname = firstname;
        this.lastname = lastname;
    }
    get fullname(){
        return this.firstname + this.lastname;
    }
    set fullname(name){
        var arr = name.split(" ");
        this.firstname = arr[0];
        this.lastname = arr[arr.length - 1];
    }
}
let person = new Person("nicholas", "zakas");
console.log(person.fullname);
類的靜態(tài)成員

要定義類的靜態(tài)方法，只需要在公共方法定義前加static關(guān)鍵字即可。如：

let Person = class{
    constructor(firstname, lastname){
        this.firstname = firstname;
        this.lastname = lastname;
    }
    static getFullname(){
        return this.firstname + this.lastname;
    }
}

要使用該靜態(tài)方法，需要直接在類上調(diào)用，比如Person.getFullname()。

類的繼承

es6的類使用extends來實(shí)現(xiàn)繼承。例如：

class Rectangle{
    constructor(length,width){
        this.length = length;
        this.width = width;
    }
    getArea(){
        return this.length * this.width;
    }
}

class Square extends Rectangle {
    constructor(length){
        super(length, length);
    }
    getPerimeter(){
        return this.length * 4;
    }
}
var sqr = new Square(5);
console.log(sqr.getArea()

上面代碼中，類Square繼承了Rectangle類，所以實(shí)例sqr同樣具有g(shù)etArea()方法。 同時(shí)sqr添加了自己的getPerimeter方法。并重寫了構(gòu)造器constructor。

注意事項(xiàng)

在使用類繼承的實(shí)現(xiàn)中，需要注意的點(diǎn)是：

如果子類沒有重寫constructor方法，默認(rèn)會調(diào)用父類的構(gòu)造器方法。

如果重寫了constructor方法，那么需要顯式的調(diào)用父類的構(gòu)造器方法，即super(arg...)，并且super()調(diào)用一定要放到構(gòu)造器的最前面(準(zhǔn)確的說是在使用this前需要調(diào)用super)。

父類的靜態(tài)成員同樣會被繼承到子類上。

最佳實(shí)踐

es6的類的語法比較易于掌握，推薦在實(shí)際開發(fā)中，多使用class來創(chuàng)建自定義類型。 首先會使關(guān)于類的信息都包裹在一個(gè)class{}中，也會使得js中的類與其他語言的類的語法更加的統(tǒng)一。

更多關(guān)于es6的內(nèi)容，可以關(guān)注右側(cè)專欄 - 學(xué)習(xí)ES6。

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

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

相關(guān)文章

  • 【ES6】更易于繼承的類語法

    摘要：的類使用熟悉的關(guān)鍵字指定類繼承的函數(shù)，并且可以通過方法訪問父類的構(gòu)造函數(shù)。例如繼承一個(gè)的類繼承了，術(shù)語上稱為基類，為派生類。例如注意到上例中，不僅是派生類的實(shí)例，也是派生類的實(shí)例，內(nèi)建對象繼承的實(shí)用之處是改變返回對象的類型。 和其它面向?qū)ο缶幊陶Z言一樣，ES6 正式定義了 class 類以及 extend 繼承語法糖，并且支持靜態(tài)、派生、抽象、迭代、單例等，而且根據(jù) ES6 的新特性衍...

    Lionad-Morotar 評論0 收藏0

  • ES6深入淺出 Classes

    摘要：一步，一步前進(jìn)一步深入淺出之。是構(gòu)造函數(shù)，可在里面初始化我們想初始化的東西。類靜態(tài)方法大多數(shù)情況下，類是有靜態(tài)方法的。中添加類方法十分容易類方法和靜態(tài)方法是同一個(gè)東西在的語法中，我們可以使用關(guān)鍵字修飾方法，進(jìn)而得到靜態(tài)方法。 一步，一步前進(jìn)の一步 ES6深入淺出之Classes。翻譯的同時(shí)亂加個(gè)人見解，強(qiáng)烈推薦閱讀原作者的文章，言簡意賅。es6-classes-in-depth 類語...

    array_huang 評論0 收藏0

  • es6之js的類

    摘要：生成的類的原型會被自動調(diào)整，而你還能調(diào)用方法來訪問基類的構(gòu)造器。唯一能避免調(diào)用的辦法，是從類構(gòu)造器中返回一個(gè)對象。 起源 JS 從創(chuàng)建之初就不支持類，也沒有把類繼承作為定義相似對象以及關(guān)聯(lián)對象的主要方式，這讓不少開發(fā)者感到困惑。而從 ES1 誕生之前直到ES5 時(shí)期，很多庫都創(chuàng)建了一些工具，讓 JS 顯得貌似能支持類。盡管一些 JS 開發(fā)者強(qiáng)烈認(rèn)為這門語言不需要類，但為處理類而創(chuàng)建的代...

    libin19890520 評論0 收藏0

  • ES6學(xué)習(xí)總結(jié)（三）

    摘要：不同于其他面向?qū)ο笳Z言，以前的中中沒有類的概念，主要是通過原型的方式來實(shí)現(xiàn)繼承，中引入了原型鏈，并且將原型鏈用來實(shí)現(xiàn)繼承，其核心是利用原型使得一個(gè)對象繼承另一個(gè)對象的方法和屬性，中原型繼承的關(guān)鍵是將一個(gè)實(shí)例的原型對象指向另一個(gè)實(shí)例，因此前一 不同于其他面向?qū)ο笳Z言，ES6以前的JavaScript中中沒有class類的概念，主要是通過原型的方式來實(shí)現(xiàn)繼承，JavaScript中引入了原...

    baoxl 評論0 收藏0

  • ES6 中Class創(chuàng)建對象與繼承實(shí)現(xiàn)

    摘要：使用類創(chuàng)建實(shí)例對象也是直接對類使用命令，跟中構(gòu)造函數(shù)的用法一致。中沒有構(gòu)造函數(shù)，作為構(gòu)造函數(shù)的語法糖，同時(shí)有屬性和屬性，因此同時(shí)存在兩條繼承鏈。子類的屬性，表示構(gòu)造函數(shù)的繼承，總是指向父類。 1 Class in ES6 ES6提出了類(Class)的概念，讓對象的原型的寫法更像面向?qū)ο笳Z言寫法。 ES6中通過class定義對象，默認(rèn)具有constructor方法和自定義方法，但是包含...

    zhou_you 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<