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

資訊專欄INFORMATION COLUMN

ES6+ class中代碼的真正樣子

PascalXie / 3401人閱讀

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

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

一、用class定義一個空類
在ES6中:

class Person { 

}

在ES5中:

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

結(jié)論:這個結(jié)果很清晰,原來ES6中的class類在ES5中也是定義一個構(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指向的是它外層對象的作用域,這里不細說,想了解請點這里。

四、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://systransis.cn/yun/82065.html

相關(guān)文章

  • [零基礎(chǔ)學python]永遠強大的函數(shù)

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

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

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

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

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

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

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

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

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

    cikenerd 評論0 收藏0

發(fā)表評論

0條評論

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