• <nav id="c8iec"><strong id="c8iec"></strong></nav>
  • <input id="c8iec"><tt id="c8iec"></tt></input>
  • <nav id="c8iec"></nav>
    <dd id="c8iec"></dd>
    <menu id="c8iec"><strong id="c8iec"></strong></menu>
  • <nav id="c8iec"></nav>
    • 027-87317566
    • 4352294@qq.com

    站多多網絡

    當前位置:首頁 > 微信網站
    新聞資訊

    力求視覺與交互的完美契合,以規范的流程和專注的態度,為您提供全方位的設計服務

    JS開發者必須知曉的十個ES6新性能有哪些呢?

    來源:武漢網站建設  瀏覽量:  發布時間:2017-06-07 09:26:25

    最近我參加了一個在舊金山舉行的HTML5開發者大會,聽到的演講半數都關于ES6(或者官方說法叫ECMAScript2015),我喜歡簡潔的成為ES6。

    這篇文章會給你簡單介紹一下ES6。如果你還不知道什么是ES6的話,它是JavaScript一個新的實現,如果你是一個忙碌的JavaScript開發者(但誰不是呢),那么繼續讀下去吧,看看當今最熱門的語言——JavaScript的新一代實現中,最棒的十個特性。

    這是為忙碌的開發者準備的ES6中最棒的十個特性(無特定順序):
    默認參數
    模版表達式
    多行字符串
    拆包表達式
    改進的對象表達式
    箭頭函數 =&>
    Promise
    塊級作用域的let和const

    模塊化
    注意:這個列表十分主觀并且帶有偏見,其他未上榜的特性并不是因為沒有作用,我這么做只是單純的希望將這份列表中的項目保持在十個。

    首先,一個簡單的JavaScript時間線,不了解歷史的人也無法創造歷史。
    1995年:JavaScript以LiveScript之名誕生
    1997年:ECMAScript標準確立
    1999年:ES3發布,IE5非常生氣
    2000年-2005年:XMLHttpRequest,熟知為AJAX,在如Outlook Web Access(2002)、Oddpost(2002)、Gmail(2004)、Google Maps(2005)中得到了廣泛的應用
    2009年:ES5發布(這是我們目前用的最多的版本),帶來了forEach / Object.keys / Object.create(特地為Douglas Crockford所造,JSON標準創建者) ,還有JSON標準。
    歷史課上完了,我們回來講編程。

    1. ES6中的默認參數
    2. ES6中的模版表達式
    3. ES6中的多行字符串
    4. ES6中的拆包表達式
    拆包可能是一個比較難理解的概念,因為這里面真的是有魔法發生。假如說你有一個簡單的賦值表達式,把對象中的house的mouse賦值為house和mouse的變量。
    5. ES6中改進的對象表達式
    你能用對象表達式所做的是超乎想象的!類定義的方法從ES5中一個美化版的JSON,進化到ES6中更像類的構造。這是一個ES5中典型的對象表達式,定義了一些方法和屬性。
    6. ES6中的箭頭函數
    這或許是我最想要的一個特性,我愛 CoffeeScript 就是因為他胖胖的箭頭(=&>相對于-&>),現在ES6中也有了。這些箭頭最神奇的地方在于他會讓你寫正確的代碼。比如,this在上下文和函數中的值應當是相同的,它不會變化,通常變化的原因都是因為你創建了閉包。
    7. ES6中的Promise
    Promise是一個有爭議的話題。現在有很多Promise實現,語法也大致相同,比如q/ bluebird/ deferred.js/ vow/ avow/ jquery deferred等等。其他人說我們并不需要Promise,異步,回調和generator之類的就很好。慶幸的是,現在在ES6中終于有一個標準的Promise實現。
    8. 塊級作用域的let和const
    你可能早就聽過對ES6中的let那些奇怪的傳說,我記得我第一次到倫敦時為那些TO LET牌子感到非常困惑。但是ES6中的let和出租無關,這不算是語法糖,它很復雜。let是一個更新的var,可以讓你把變量作用域限制在當前塊里。我們用{}來定義塊,但是在ES5中這些花括號起不到任何作用。
    9. ES6中的類
    如果你喜歡面向對象編程,那么你會特別喜歡這個特性。他讓你編寫和繼承類時就跟在Facebook上發一個評論這么簡單。
    在ES5中,因為沒有class關鍵字(但它是毫無作用的保留字),類的創建和使用是讓人十分痛苦的事情。更慘的是,很多偽類的實現像pseude-classical, classical, functional讓人越來越摸不著頭腦,為JavaScript的信仰戰爭火上澆油。
    我不會給你展示在ES5中怎么去編寫一個類(是啦是啦從對象可以衍生出來其他的類和對象),因為有太多方法去完成。我們直接看ES6的示例,告訴你ES6的類會用prototype來實現而不是function。現在有一個baseModel類,其中我們可以定義構造函數和getName()方法。
    注意到我給options和data用了默認參數,而且方法名再也不用加上function或者:了。還有一個很大的區別,你不能像構造函數里面一樣向this.Name指派值。怎么說呢,和函數有相同縮進的代碼里,你不能向name賦值。如果有這個需要的話,在構造函數里面完成。
    使用NAME extends PARENT_NAME語法,AccountModel從baseModel繼承而來。
    10. ES6中的模塊化
    你可能知道,ES6之前JavaScript并沒有對模塊化有過原生的支持,人們想出來AMD,RequireJS,CommenJS等等,現在終于有import和export運算符來實現了。

    ES5中你會用script標簽和IIFE(立即執行函數),或者是其他的像AMD之類的庫,但是ES6中你可以用export來暴露你的類。我是喜歡Node.js的人,所以我用和Node.js語法一樣的CommonJS,然后用Browserfy來瀏覽器化。現在我們有一個port變量和getAccounts方法,在ES5中:個人來說,我覺得這樣的模塊化有些搞不懂。確實,這樣會更傳神一些 。但是Node.js中的模塊不會馬上就改過來,瀏覽器和服務器的代碼最好是用同樣的標準,所以目前我還是會堅持CommonJS/Node.js的方式。

    目前來說瀏覽器對ES6的支持還遙遙無期(本文寫作時),所以你需要一些像jspm這樣的工具來用ES6的模塊。

    想要了解更多ES6中的模塊化和例子的話,來看這篇文章,不管怎么說,寫現代化的JavaScript吧!

    怎么樣可以在今天就用上ES6(Babel)

    ES6標準已經敲定,但還未被所有瀏覽器支持(Firefox的ES6功能一覽),如果想馬上就用上ES6,需要一個像Babel這樣的編譯器。你可以把他當獨立工具用,也可以將他集成到構建系統里,Babel對Gulp,Grunt和Webpack都有對應的插件。

    ES6中還有很多你可能都用不上(至少現在用不上)的可圈可點的特性,以下無特定順序:

    Math / Number / String / Array / Object中新的方法
    二進制和八進制數據類型
    自動展開多余參數
    For of循環(又見面了CoffeeScript)
    Symbols
    尾部調用優化
    generator
    更新的數據結構(如Map和Set)
    武漢網站制作www.gouwuhezi.com
    這篇文章太贊了我也要點贊!

    11

    鄭重聲明 Solemn Statement
    本文來源:http://www.gouwuhezi.com 作者:武漢網站建設@武漢站多多 網絡營銷策劃,本文由武漢站多多版權所有,未經批準轉載必究。

    武漢站多多 - 武漢網站建設終極解決方案

    或許,我們能為您做的還很多...

    400-8084-027 / 027-87317566
    BG真人游戏