前面學習了day23——slot插槽的使用，今天學習模組化
隨著web頁面越來越多，多人同時開發頁面，有可能會存在多個同名的變數或者函式或者類，導致合併功能模組是會出現問題。因此將各自負責的功能模組匯出成乙個模組，模組內的變數或者函式或者類不受外部同名的影響。
注意**中的注釋，很重要，如下：
index.html
>
src=
"aaa.js"
type
="module"
>
script
>
src=
"bbb.js"
type
="module"
>
script
>
src=
"mmm.js"
type
="module"
>
script
>
body
>
var name =
'小明'
var age =
18var flag =
true
function
sum(num1, num2)
if(flag)
//1. 匯出方式一
export
//2. 匯出方式二
export
var num1 =
100;
export
var height =
1.88
;//3. 匯出函式
export
function
mul(num1, num2)
//4. 匯出類
export
class
person
}//5. export default
const address =
'北京市'
//只能有乙個default匯出，匯入的時候，名字可以與匯出的時候不同
// export default address
export
default
function
(argument)
import
from
"./aaa.js"
;var name =
'小紅'
var flag =
false
console.
log(
sum(20,
30));
}
//1.匯入物件{}中定義的變數
import
from
"./aaa.js";if
(flag)
//2. 直接匯入export定義的變數
import
from
"./aaa.js"
;console.
log(num1)
;console.
log(height)
;//3.匯入exprot的function、類
import
from
"./aaa.js"
;console.
log(
mul(50,
30));
const person =
newperson()
;person.
run();
//4. 匯入default，名字可以隨便取
// import addr from "./aaa.js";
// console.log(addr);
import fun from
"./aaa.js"
;fun
('你好啊');
//5.統一全部匯入
import
*as aaa from
"./aaa.js"
console.
log(aaa.flag)
;console.
log(aaa.height)
;
前端模組化
前端模組化解決什麼問題？有了模組，我就可以很方便的使用別人的 想要什麼功能，就用載入什麼模組。但是，這樣做需要有乙個前提，那就是大家必須以同樣的方式編寫模組，否則就亂套了。所以組內需要有一套統一的模組規範。如何實現模組？1 物件字面量的變體 2 js設計模式的模組模式 3 採用成熟的庫檔案。前兩種方...
前端模組化
定義 具有相同屬性和行為的事物的集合 在前端中 將一些屬性比較類似和行為比較類似的內容放在同乙個js檔案裡面，把這個js檔案稱為模組 目的 為了每個js檔案只關注與自身有關的事情，讓每個js檔案各行其職 模組化 指的就是遵守commonjs規範，解決不同js模組之間相互呼叫問題 commonjs a...
前端模組化
當多人開發同一專案時，很容易就會產生命名衝突的問題，尤其是js檔案，任何的js引入順序的打亂都可能導致專案執行失敗，為了解決命名衝突的問題，在es6之前，可以使用函式閉包來解決這個問題。即可能像這樣 function 這樣雖然可以解決命名衝突的問題，但也使得 的復用性變得極差，因為其它的檔案將無法再...