export 與 import的復(fù)合寫法export 與 import可以在同一模塊使用，使用特點(diǎn)： 1、可以將導(dǎo)出接口改名，包括 default。 2、復(fù)合使用 export 與 import ，也可以導(dǎo)出全部，當(dāng)前模塊導(dǎo)出的接口會(huì)覆蓋繼承導(dǎo)出的。 模塊的繼承模塊之間也可以相互繼承(有明確依賴關(guān)系的不行)。 跨模塊常量項(xiàng)目實(shí)際開發(fā)中，時(shí)不時(shí)會(huì)需要一些全局變量(如 Vuex)以用來做一些特殊操作。模塊之間也一樣，如果幾個(gè)模塊相互之間有功能聯(lián)系，或 幾個(gè)模塊需要共享一個(gè)變量，那這時(shí)就需要一個(gè)跨模塊常量了。 在新的變量聲明方式 let與 const中，用const聲明的常量在當(dāng)前代碼塊中都有效，因此將 const聲明的常量放在整個(gè)模塊的頭部，則對(duì)整個(gè)模塊都有效，所以可以利用這一點(diǎn)進(jìn)行跨模塊變量的聲明。 // index_export_default.js const A = 1, B = 2, C = 3; export default {A, B, C}; // index_import1.js import constants from './index_export_default.js'; console.log(`const A：${constants.A}`); // const A：1 console.log(`const C：${constants.C}`); // const C：3 constants.A = 456; // index_import2.js import constants from './index_export_default.js'; console.log(`const A：${constants.A}`); // const A：1 console.log(`const C：${constants.C}`); // const C：3
1、如果要共享的常量比較多，這時(shí)可以用一個(gè)公共 constants目錄，將各個(gè)模塊各自需要的常量 整理后寫在對(duì)應(yīng)獨(dú)立的文件里，即便于管理，又各自獨(dú)立。 // index_export_default.js const A = 1, B = 2, C = 3; export default {A, B, C}; // index_export.js export const person = ['name', 'gender', 'age', 'height','weight']; // index_import.js import constants from './index_export_default.js'; import {person} from './index_export.js'; console.log(`const A：${constants.A}`); // const A：1 console.log(`person：${person}`); // person：name,gender,age,height,weight
// index_constants.js export constantsA from './index_export_default.js'; export {person} from './index_export.js'; // index_import.js import constantsA from './index_export_default.js'; import {person as constantsB} from './index_export_default.js'; console.log(`const A：${constantsA.A}`); // const A：1 console.log(`const C：${constantsA.C}`); // const C：3 console.log(constantsB); // (5) ["name", "gender", "age", "height", "weight"]
|
|
|
