• <sup id="ns121"><small id="ns121"></small></sup><small id="ns121"></small>

    <output id="ns121"><track id="ns121"></track></output>
      <ins id="ns121"></ins>
      1. <tr id="ns121"></tr>
      2. 編程課程列表 > JavaScript 原生模塊
        JavaScript 原生模塊
        • 信用卡 • 花唄
        • 放心購,7天內不滿意可退款
        收藏

        JavaScript 原生模塊

        圖文課程 18 節 40 個小點 144人參與
        ¥15

        JS 模塊 目前已獲得全部主流瀏覽器的支持。

        什么是 JavaScript 模塊

        JS modules 其實是一系列功能的集合。以前你可能聽過說 Common JS ,AMD 等模塊標準,不一樣標準的模塊功能都是相似的,都容許你 import 或者 export 一些東西。

        JavaScript 模塊目前有標準的語法,在模塊中,你能夠經過 export 關鍵字,導出一切東西(變量,函數,其它聲明等等)

        //lib.mjs
        export const repeat = (string) => `${string} ${string}`;
        export function shout(string) {
          return `${string.toUpperCase()}!`;
        }

        而想要導入該模塊,只須要在其它文件中使用import 關鍵字引入便可

        //main.mjs
        import {repeat, shout} from './lib.mjs';
        repeat('hello');
        // → 'hello hello'
        shout('Modules in action');
        // → 'MODULES IN ACTION!'

        模塊中還能夠導出默認值

        //lib.mjs
        export default function(string) {
          return `${string.toUpperCase()}!`;
        }

        具備默認值的模塊能夠以任意名字導入到其它模塊中jquery

        //main.mjs
        import shout from './lib.mjs';
        //     ^^^^^

        模塊和傳統的script 標簽引入腳本有一些區別,以下:

        • JS模塊默認使用嚴格模式
        • 模塊中不支持使用 html 格式的注釋,即<!-- TODO: Rename x to y. -->
        • 模塊會建立本身的頂級詞義上下文,這意味著,當在模塊中使用var foo = 42; 語句時,并不會建立一個全局變量foo, 所以也不能經過window.foo在瀏覽器中訪問該變量。
        • import 和 export 關鍵字只在模塊中有效。

        因為存在上述不一樣,經過傳統方式引入的腳本 和 以模塊方式引入的腳本,就會有相同的代碼,也會產生不一樣的行為,于是 JS 執行環節須要知道那些腳本是模塊。

        在 瀏覽器中使用模塊

        在 瀏覽器中,經過設置 <script> 元素的type 屬性為 module 能夠聲明其實一個模塊。

        <script type="module" src="main.mjs"></script>
        <script nomodule src="fallback.js"></script>

        支持type="module"的瀏覽器會忽略帶有nomudule屬性的的<script>元素,這樣就提供了降級處理的空間。其意義不只如此,支持type="module"的環境意味著其也支持箭頭函數,async-await等新語法功能,這樣引入的腳本無須再作轉義處理了。

        歡迎你開啟JavaScript原生模塊之旅!

        點擊下載編程獅App,手機隨時隨地繼續學>>

        IT技術編程開發學習交流群

        該課程暫無評價噢!
        中文字幕人成乱码熟女|强行入侵女人a片|亚洲日本成本人观看|天天操天天操
      3. <sup id="ns121"><small id="ns121"></small></sup><small id="ns121"></small>

        <output id="ns121"><track id="ns121"></track></output>
          <ins id="ns121"></ins>
          1. <tr id="ns121"></tr>