export
最正常:
var firstName = 'Michael';
var lastName = 'Jackson';
var year = 1958;
export { firstName, lastName, year };
輸出函式或類:
export function multiply(x, y) {
return x * y;
};
重命名:
function v1() { ... }
function v2() { ... }
export {
v1 as streamV1,
v2 as streamV2,
v2 as streamLatestVersion
};
動態改變輸出的值:
export var foo = 'bar';
setTimeout(() => foo = 'baz', 500);
//上面代碼輸出變數foo，值為bar，500 毫秒之后變成baz，
多個輸出,import
// circle.js
export function area(radius) {
return Math.PI * radius * radius;
}
export function circumference(radius) {
return 2 * Math.PI * radius;
}
import * as circle from './circle';
console.log('圓面積：' + circle.area(4));
console.log('圓周長：' + circle.circumference(14));
export和export default
理解:
1.export的時候,單個變數輸出,可以import變數({area}或者* as circle(circle為物件))
2.export default的時候,相當于匯出的整個物件,所以不用括號,可以物件.屬性(直接定義物件名circle(物件))
// 第一組
export default function crc32() { // 輸出
// ...
}
import crc32 from 'crc32'; // 輸入
// 第二組
export function crc32() { // 輸出
// ...
};
import {crc32} from 'crc32'; // 輸入
第一組是使用export default時，對應的import陳述句不需要使用大括號；
第二組是不使用export default時，對應的import陳述句需要使用大括號，
export default命令用于指定模塊的默認輸出，顯然，一個模塊只能有一個默認輸出，因此export default命令只能使用一次，所以，import命令后面才不用加大括號，因為只可能唯一對應export default命令，
// 正確
export var a = 1;
// 正確
var a = 1;
export default a;
上面代碼中，export default a的含義是將變數a的值賦給變數default，
import
匯入組件中的部分物件
import { stat, exists, readFile } from 'fs';
匯入整個物件
import fs from 'fs';
使用的時候
fs.stat
fs.exists
fs.readFile
匯入物件重命名
import { lastName as surname } from './profile.js';
import命令輸入的變數都是只讀的
import命令具有提升效果，會提升到整個模塊的頭部，首先執行
foo();
import { foo } from 'my_module';
//不會報錯
僅僅執行lodash模塊，但是不輸入任何值.代碼加載了兩次lodash，但是只會執行一次，
import 'lodash';
import 'lodash';
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/150719.html
標籤：JavaScript
上一篇：宣傳頁專案開發（三）
下一篇：ES6解構賦值