全域性function模式
全域性函式模式: 將不同的功能封裝成不同的全域性函式問題: global被汙染了, 很容易引起命名衝突
// module1.js
//資料
let data = 'atguigu.com'
//運算元據的函式
function foo() `)
}function bar() `)
}// module2.js
let data2 = 'other data';
function foo() `)
}
namespace模式namespace模式: 簡單物件封裝作用: 減少了全域性變數
問題: 不安全,資料不是私有的, 外部可以直接修改
// module1.js
let mymodule = `)
},bar() `)}}
// module2.js
let mymodule2 = `)
},bar() `)}}
// test2.html
iife模式iife模式: 匿名函式自呼叫(閉包)iife : immediately-invoked function expression(立即呼叫函式表示式)
作用: 資料是私有的, 外部只能通過暴露的方法操作
問題: 如果當前這個模組依賴另乙個模組怎麼辦?
// module3.js
(function (window) `)
}function bar() `)
otherfun() //內部呼叫
}function otherfun()
//暴露行為
window.mymodule =
})(window)
// test3.html
iife模式增強iife模式增強: 引入依賴這就是現代模組實現的基石
// 引入jquery到專案中
// module4.js
(function (window, $) `)
$('body').css('background', 'red')
}function bar() `)
otherfun() //內部呼叫
}function otherfun()
//暴露行為
window.mymodule =
})(window, jquery)
// test4.html
頁面載入多個js的問題頁面:
乙個頁面需要引入多個js檔案,會導致這些問題可以通過現代模組化編碼和專案構建來解決
模組化程式設計1
一,原始寫法 模組就是實現特定功能的一組方法。只要把不同的函式 以及記錄狀態的變數 簡單地放在一起,就算是乙個模組。function m1 module1 這樣寫其實就是給乙個模組新增新的方法m3 可以用這種方式給乙個模組擴充套件方法。5.寬放大模式 在瀏覽器環境中,模組的各個部分通常都是從網上獲取...
JavaScript模組化程式設計思想演變
對大型的 來說,模組化程式設計非常重要。因為越是大型的 檔案命名衝突 檔案依賴程度都非常高,故而引入模組化思想。下面我從大家經常寫 的習慣來引。這種形式,各種變數,函式都將暴露在全域性環境下,示例如下 上面這種編寫方式是很常見的,也是非常不可取的,因為全域性環境完全被汙染了,非常容易造成命名衝突等問...
結對程式設計1 模組化
在個人作業1中,用各種語言實現了乙個命令列的四則運算小程式。進一步,本次要求把這個程式做成gui,成為乙個有基本功能 一定價值的程式。在下面的功能需求中實現兩個 1 需求分析 結對專案,需求為我完成的功能。2 程式設計 說明 四則遠算主要功能分為,計算 語言選擇 計時 記錄。其中計算是最核心最重要的...