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

資訊專欄INFORMATION COLUMN

ES6+ class中代碼的真正樣子

PascalXie / 3522人閱讀

摘要:一用定義一個(gè)空類在中在中結(jié)論這個(gè)結(jié)果很清晰,原來中的類在中也是定義一個(gè)構(gòu)造函數(shù),然后返回出來。

這篇文章用代碼對比的方式解釋ES6中的類如果用我們熟悉的ES5來看是什么樣的。

一、用class定義一個(gè)空類
在ES6中:

class Person { 

}

在ES5中:

var Person = (function () {
    function Person() {
    }
    return Person;
}()); 

結(jié)論:這個(gè)結(jié)果很清晰,原來ES6中的class類在ES5中也是定義一個(gè)構(gòu)造函數(shù),然后返回出來。

二、定義屬性
在ES6中:

class Person { 
  
  constructor(name,age) { 
    this.name = name;    //在constructor中定義屬性
  }

  age = age;    //直接定義屬性

}

在ES5中:

var Person = (function () {

    function Person(name, age) {
        this.age = age;    //在es6中定義的屬性都在這里,而且傳值也沒問題
        this.name = name;
    }
    return Person;
    
}());

結(jié)論:在ES6中定義的屬性,不管直接在class中定義,還是在constructor中都可以,但是在constructor中定義屬性才是推薦寫法,畢竟ES6轉(zhuǎn)ES5也并不是100%合理。

三、定義方法
在ES6(傳統(tǒng)寫法、箭頭函數(shù)寫法)

class Person { 

  Run() {    //傳統(tǒng)形式的函數(shù)寫法
    this;
  }

  eat = () => {    //es6中的箭頭函數(shù)寫法
    this;
  }

}   

在ES5中:

var Person = (function () {

    function Person() {
        var _this = this;
        this.eat = function () {    //箭頭寫法直接掛到Person的this下
            _this;
        };
    }
    Person.prototype.Run = function () {    //傳統(tǒng)寫法則掛到prototype中定義
        this;
    };
    
    return Person;
}());    

結(jié)論:這里不僅展示了在方法的定義,還比較了在ES6中傳統(tǒng)函數(shù)和箭頭函數(shù)的區(qū)別,傳統(tǒng)函數(shù)的thises5函數(shù)的this指向完全一樣,但箭頭函數(shù)的this指向的是它外層對象的作用域,這里不細(xì)說,想了解請點(diǎn)這里。

四、static關(guān)鍵字
在ES7中:

class Person {

  static name = "Jack";    //對屬性使用static

  static run() {     //對傳統(tǒng)函數(shù)使用static
    console.log(22)
  }

  static see = () => {    //對箭頭函數(shù)使用static
    
  }
};    

在ES5中:

var Person = (function () {
    function Person() {
    }
    Person.run = function () {
        console.log(22);
    };
    return Person;
}());

Person.name = "Jack";
Person.see = function () {};

結(jié)論:在class中,如果在屬性或方法前使用static關(guān)鍵字,則可以在外部訪問,訪問方式是Person.xxx或Person.xxx()

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

轉(zhuǎn)載請注明本文地址:http://hztianpu.com/yun/82065.html

相關(guān)文章

  • [零基礎(chǔ)學(xué)python]永遠(yuǎn)強(qiáng)大的函數(shù)

    摘要:萊布尼茲所指的函數(shù)現(xiàn)在被稱作可導(dǎo)函數(shù),數(shù)學(xué)家之外的普通人一般接觸到的函數(shù)即屬此類。中文的函數(shù)一詞由清朝數(shù)學(xué)家李善蘭譯出。前面提供的維基百科中的函數(shù)詞條,里面可以做一個(gè)概覽。 函數(shù),對于人類來講,能夠發(fā)展到這個(gè)數(shù)學(xué)思維層次,是一個(gè)飛躍。可以說,它的提出,直接加快了現(xiàn)代科技和社會(huì)的發(fā)展,不論是現(xiàn)代的任何科技門類,乃至于經(jīng)濟(jì)學(xué)、政治學(xué)、社會(huì)學(xué)等,都已經(jīng)普遍使用函數(shù)。 下面一段來自維基百科(...

    cangck_X 評論0 收藏0
  • 基于 Babel 的 npm 包最小化設(shè)置

    摘要:翻譯瘋狂的技術(shù)宅原文本文首發(fā)微信公眾號(hào)歡迎關(guān)注,每天都給你推送新鮮的前端技術(shù)文章本文描述了通過生成包的最小設(shè)置。是用于轉(zhuǎn)換的預(yù)設(shè)。有關(guān)這兩個(gè)屬性的更多信息設(shè)置多平臺(tái)包。表示使用上一節(jié)中的配置。結(jié)論以上是通過創(chuàng)建包最小庫的方法。 翻譯:瘋狂的技術(shù)宅原文:http://2ality.com/2017/07/npm... 本文首發(fā)微信公眾號(hào):jingchengyideng歡迎關(guān)注,每天都...

    琛h。 評論0 收藏0
  • Babel 7 轉(zhuǎn)碼的正確姿勢

    摘要:轉(zhuǎn)碼的配置是每位前端童鞋在日常工作中都會(huì)遇到的。簡單點(diǎn)來說就是在轉(zhuǎn)碼過程中,對于一些新語法,都會(huì)抽象一個(gè)個(gè)小的函數(shù),在轉(zhuǎn)碼過程中完成替換。以上即是我總結(jié)的轉(zhuǎn)碼姿勢,如果對本篇有疑問或建議,歡迎在這里提出。 Babel 轉(zhuǎn)碼的配置是每位前端童鞋在日常工作中都會(huì)遇到的。剛開始我也是在網(wǎng)上搜索各種配置方法,升級到 Babel 7 的時(shí)候又折騰了一把,所以決定把自己的心得和理解記錄下來,希望能...

    JohnLui 評論0 收藏0
  • JS每日一題:函數(shù)式編程中代碼組合(compose)如何理解?

    摘要:期函數(shù)式編程中代碼組合如何理解定義顧名思義,在函數(shù)式編程中,就是將幾個(gè)有特點(diǎn)的函數(shù)拼湊在一起,讓它們結(jié)合,產(chǎn)生一個(gè)嶄新的函數(shù)代碼理解一個(gè)將小寫轉(zhuǎn)大寫的函數(shù)一個(gè)在字符后加的函數(shù)將兩個(gè)函數(shù)組合起來這里假設(shè)我們實(shí)現(xiàn)了每日一題每日一題顯示結(jié)果里上面 20190315期 函數(shù)式編程中代碼組合(compose)如何理解? 定義: 顧名思義,在函數(shù)式編程中,Compose就是將幾個(gè)有特點(diǎn)的函數(shù)拼湊在...

    Kaede 評論0 收藏0
  • PHP后端組織項(xiàng)目結(jié)構(gòu)的思考

    摘要:介紹下一個(gè)新項(xiàng)目,后端該如何從零去搭建。我們先假設(shè)這個(gè)項(xiàng)目由兩部組成提供給站點(diǎn)使用的提供給運(yùn)營人員使用的管理后臺(tái)。因此通過回顧,我們得出我們的后端項(xiàng)目需要一個(gè)的層次,來存放業(yè)務(wù)邏輯。 這是 后端開發(fā)者從零做一個(gè)移動(dòng)應(yīng)用 的后端部分第二篇。介紹下一個(gè)新項(xiàng)目,后端該如何從零去搭建。我們先假設(shè)這個(gè)項(xiàng)目由兩部組成 提供給wap站點(diǎn)、app使用的api; 提供給運(yùn)營人員使用的管理后臺(tái)。 整個(gè)...

    cikenerd 評論0 收藏0

發(fā)表評論

0條評論

閱讀需要支付1元查看
<