成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码

資訊專(zhuān)欄INFORMATION COLUMN

es6 - 類(lèi)

notebin / 2170人閱讀

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

es6 類(lèi)-class

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

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

語(yǔ)法

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

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

看下面一段代碼:

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

上面代碼使用class創(chuàng)建了一個(gè)自定義類(lèi)型Person,constructor是這個(gè)類(lèi)的構(gòu)造器,sayName是類(lèi)的公共方法。它和下面一段代碼是等價(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)建的類(lèi)只能使用new來(lái)調(diào)用,而后者可以作為普通函數(shù)調(diào)用。

class沒(méi)有聲明提升,后者作為函數(shù)會(huì)有聲明提升。

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

類(lèi)的所有方法都是不可枚舉的。

類(lèi)表達(dá)式

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

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

let person = new Person("icode007");

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

類(lèi)的訪問(wèn)器屬性

使用get和set關(guān)鍵字可以為類(lèi)定義訪問(wè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);
類(lèi)的靜態(tài)成員

要定義類(lè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)方法,需要直接在類(lèi)上調(diào)用,比如Person.getFullname()。

類(lèi)的繼承

es6的類(lèi)使用extends來(lái)實(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()

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

注意事項(xiàng)

在使用類(lèi)繼承的實(shí)現(xiàn)中,需要注意的點(diǎn)是:

如果子類(lèi)沒(méi)有重寫(xiě)constructor方法,默認(rèn)會(huì)調(diào)用父類(lèi)的構(gòu)造器方法。

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

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

最佳實(shí)踐

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

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

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

轉(zhuǎn)載請(qǐng)注明本文地址:http://m.hztianpu.com/yun/93351.html

相關(guān)文章

  • ES6】更易于繼承的類(lèi)語(yǔ)法

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

    Lionad-Morotar 評(píng)論0 收藏0
  • ES6深入淺出 Classes

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

    array_huang 評(píng)論0 收藏0
  • es6之js的類(lèi)

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

    libin19890520 評(píng)論0 收藏0
  • ES6學(xué)習(xí)總結(jié)(三)

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

    baoxl 評(píng)論0 收藏0
  • ES6 中Class創(chuàng)建對(duì)象與繼承實(shí)現(xiàn)

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

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

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

0條評(píng)論

閱讀需要支付1元查看
<