es6 模組化(es6學習筆記07)

2021-10-18 22:44:07 字數 1914 閱讀 5917

模組化:是指將乙個大的程式檔案,拆分成許多小的檔案,然後將小檔案組合起來。

功能模組主要由兩個命令構成:export和import

1.2.1 export 使用:

//1.分別暴露

export

let book =

'西遊記'

;export

function

like()

//2.統一暴露

let book =

"西遊記"

;function

name()

//3.預設暴露---物件居多

export

default

}

使用第三種export方式時,如果要獲取裡面的屬性,要加上一層default。

type

="module"

>

import

*as b3 from

"./es6_modo2.js"

; b3.

default

.price()

;//要多加一層default

script

>

1.2.2 import 使用

1、通用的匯入方法

import

*as b1 from

"./es6_modo.js"

;//引入的路徑要使用 / ./ ../

2、解構賦值形式

import

from

"./src/js/mode2.js"

;//當引入的名字重名時,要使用as取個別名

import

from

"./src/js/modo3.js"

;//當匯入預設default時,也要為它取別名

import

from

"./src/js/modo5.js"

;

3、簡便形式

只針對於預設暴露

import hhh from

"./src/js/modo3.js"

;

方法1
type

="module"

>

import

........

//這裡寫入上面三種import使用方法

script

>

方法2:
import

*as b1 from

"./es6_modo.js"

;import

*as b2 from

"./es6_modo1.js"

;import

*as b3 from

"./es6_modo2.js"

;

src=

type

="module"

>

script

>

注:一般在專案中很少這麼引入,會涉及到瀏覽器相容的問題。有些瀏覽器不支援es6,一般通過babel(js的編譯器)來做乙個轉化。

import $ from

'jquery'

;//修改背景顏色$(

'body').

css(

'background'

,'green'

);

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...

es6模組化規範

例子 export let myname laowang import from test.js console.log myname laowang 如果要輸出多個變數可以將這些變數包裝成物件進行模組化輸出 let myname laowang let myage 90 let myfn func...