vue基礎知識 十三 ES6模組化的基本語法

2021-10-04 23:18:42 字數 1223 閱讀 2045

es6模組化的基本語法

1. 預設匯出 與 預設匯入
// 當前檔案模組為 m1.js

// 定義私有成員 a 和 c

let a = 10

let c = 20

// 外界訪問不到變數 d ,因為它沒有被暴露出去

let d = 30

function show() {}

// 將本模組中的私有成員暴露出去,供其他模組使用

export default

// 匯入模組成員

import m1 from './m1.js'

console.log(m1)

// 列印輸出的結果為:

//

在乙個模組中如果沒有向外匯出任何成員,那麼在匯入這個模組的時候缺省會接收到乙個空物件(不會報錯)。
2. 按需匯出 與 按需匯入
// 當前檔案模組為 m1.js

// 向外按需匯出變數 s1

export let s1 = 'aaa'

// 向外按需匯出變數 s2

export let s2 = 'ccc'

// 向外按需匯出方法 say

export function say = function() {}

// 匯入模組成員

import from './m1.js'

console.log(s1) // 列印輸出 aaa

console.log(ss2) // 列印輸出 ccc

console.log(say) // 列印輸出 [function: say]

預設匯出和按需匯出兩者寫在同乙個檔案裡不會衝突!

在乙個模組中只能用唯一的一次預設匯出( export default{} ),但是可以用n多次按需匯出( export )

3. 直接匯入並執行模組**

有時候,我們只想單純執行某個模組中的**,並不需要得到模組中向外暴露的成員,此時,可以直接匯入並執行模組**。

// 當前檔案模組為 m2.js

// 在當前模組中執行乙個 for 迴圈操作

for(let i = 0; i < 3; i++)

es6模組化基礎知識點

1 為何需要模組化 因為隨著前端的 複雜度越來越高,之間會容易有這三個問題 全域性變數衝突 函式命名衝突 依賴關係混亂 2 模組化規範的高階歷史 commonjs amd cmd 到現在的 es6模組 3 最初最簡單的模組化原始碼 jquery大量使用的也是這種方式 var module speci...

es6 的模組化

這個是需要複習下的,否則後面的react vue 就理解不清晰了 我覺得js 很牛,為啥,因為前後端都是js 這樣結合起來,很順暢 而且node 作為後端,搭建輕量級伺服器,很是好用,寫個介面絲毫沒有任何問題 後面的基本三大塊,1,node express koa 2,三大框架,react vue ...

ES6的模組化

模組化的特點 1 模組 自動執行在嚴格模式下,沒有任何辦法跳出嚴格模式 2 在模組的作用域下建立的變數,不會被新增到全域性作用域中 3 如果外部可以讀取模組當中的內容,需要模組的匯出 4 模組頂級作用域的this為undefined 匯出資料 export var color pink export...