es6模組命令

es6的模組命令分為export命令和import命令，其中export命令用於匯出變數，import命令用於引入變數。

1.1a檔案：

export var name = "name";

export var age = 1;

b檔案:

import  from './a.js';

console.log(name) //name
console.log(age) //1

1.2 第二種更加常用的變數匯出的寫法

a檔案：

var name = "name";

var age = 1;
export ;

1.3 使用as關鍵字重新命名

export ;

import from './a.js';

export ;

import from './a.js';

var age = 1;

export age; 錯誤
export 1; 錯誤
export var age = 1; 正確
export ; 正確
function fn () {}
export fn; 錯誤
export function fn () {} 正確
export 正確

a檔案：

var name = "name";

export ;
settimeout(() => name = "age", 1000);

import  from './a.js';

console.log(name) //name
settimeout(() => console.log(name),1500) //age

1.6 變數匯出的位置

變數的匯出應該在模組的頂層作用域中。

var name = "name";

function fn () //錯誤
}fn()

1.7 變數提公升效果

console.log(name) //name

import from './a.js';

1.8、使用*字元引入變數。

使用*字元可以將模組中所有匯出的變數匯入到指定的變數中。

a檔案:

var name = "name";

var age = "age";
var *** = "***";
export

import * as varibles from './a.js';

console.log(varibles.name) //name
console.log(varibles.age) //age
console.log(varibles.***) //***

varibles.name = 1; 錯誤

export default命令與export命令一樣用於匯出變數。不同的是，export可以使用多次。在匯入變數的時候,需要知道輸入的變數名稱才能進匯入，而export default只能使用一次，在匯入變數的時候，使用者不需要知道模組內部匯出的變數名稱。

a檔案：

var name = "name";

export default name;

import varibles from './a.js';

console.log(varibles) //name

export default命令最大的好處就是不需要知道模組內部匯出的變數名是什麼，可以直接使用自己定義的變數名。這樣就不需要麻煩地去檢視檔案中匯出的變數名了。

需要注意的是，export default後面不能跟宣告變數的語句，因為export default命令實質上是輸出了乙個叫default的變數,然後允許你在引入的時候為這個變數取任意名稱。

export default var name = 1; //錯誤

export default 1; 正確
var name = 1;
export default name; //正確

a檔案：

var name = "name";

var age = 1;
export default name;
export ;

import varibles,  from './a.js';

console.log(age) //1
console.log(varibles) //name

export  from '***';

import  from '***';

export ;

export * from '***';

export  from '***';

export  from '***';

import  from '***';

export default name;

var path = './' + filename;

import *** from path; 錯誤！
if (true) 
function fn ()

es6模組暴露

es6模組匯入和匯出 匯出 export，export default 可以匯出變數，函式，物件，檔案，模組 匯入 import function add 1 export add 匯入 import from add.js 匯入時要加，呼叫 add 可以匯出多個,加 export export a...

ES6模組操作

export default 值匯入時使用以下方式 import 自定義名字 from 模組位址 vue在建立vue元件時，我們會經常使用到這種方式 export default import demo from vue export const num 1export const num2 2 先...

ES6 模組載入

es6中的import 是singleton 的載入方式只會載入一次，並且是編譯是執行，在編譯時進行運算等是會報錯的 export 註冊介面 export 使用方法 import 引入介面 import import from profile.js 介面可以整體載入 載入方式如下 import as...