首頁 > web前端 > js教程 > JavaScript中import怎麼使用?

JavaScript中import怎麼使用?

不言
發布: 2019-01-19 17:00:59
原創
19078 人瀏覽過

在ES6中,可以透過模組化來管理JavaScript中import怎麼使用?物件。進行模組化的話,除了能進行功能的再利用以外,能夠提高可維護性。

JavaScript中import怎麼使用?

import是用來將某個模組中匯出的函數或物件、初始值匯入到另一個模組中的語法。

如下

import {模块名称} from "需要导入模块的路径名"
登入後複製

如何使用import?

該模組有default模組和named(命名)模組。

我們先載入default export的模組和named export的模組

import {ModuleA, ModuleB} from "modules"; 
import Default from 'modules2';
登入後複製

在第一行中,我們從modules這個檔案匯入名為Module A和Module B的這兩個named模組。

在第二行中,我們從modules 2這個檔案中導入default模組。

執行模組export

要將函數,對象,原始值匯出為模組,需要使用export。

我們來看具體範例

將其匯出為預設模組

// alert.js
export default function () {
    alert("default module called!");
};
登入後複製

命名匯出

// utils.js
export function sum(x, y, z) {
    return x+y+z;
}
 
export function multiply(x, y) {
    return x*y;
}
登入後複製

我們能夠匯出名為sum和multiply的模組。

可以透過以下呼叫來使用該函數

import { sum, multiply } from 'utils'; 
console.log(sum(1, 2, 3));
console.log(multiply(5, 8));
登入後複製

執行結果如下

->6
->40
登入後複製

本篇文章到這裡就全部結束了,更多精彩內容大家可以關注php中文網的其他相關欄位教學! ! !

以上是JavaScript中import怎麼使用?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板