seaJs使用心得之exports與module.exports的區(qū)別實例分析
本文實例講述了seaJs使用心得之exports與module.exports的區(qū)別。分享給大家供大家參考，具體如下：
1. exports 是 module.exports 的 輔助對象，exports對外提供api 時需要用return 返回exports 對象
2. module.exports 也可直接向外提供api
參考 ： https://github.com/seajs/seajs/issues/242
exports Object
exports 是一個對象，用來向外提供模塊接口。
define(function(require, exports) {
// 對外提供 foo 屬性
exports.foo = 'bar';
// 對外提供 doSomething 方法
exports.doSomething = function() {};
});
除了給 exports 對象增加成員，還可以使用 return 直接向外提供接口。
define(function(require) {
// 通過 return 直接提供接口
return {
foo: 'bar',
doSomething: function() {}
};
});
如果 return 語句是模塊中的唯一代碼，還可簡化為：
define({
foo: 'bar',
doSomething: function() {}
});
上面這種格式特別適合定義 JSONP 模塊。
特別注意：下面這種寫法是錯誤的！
define(function(require, exports) {
// 錯誤用法！！!
exports = {
foo: 'bar',
doSomething: function() {}
};
});
正確的寫法是用 return 或者給 module.exports 賦值：
define(function(require, exports, module) {
// 正確寫法
module.exports = {
foo: 'bar',
doSomething: function() {}
};
});
提示：exports 僅僅是 module.exports 的一個引用。在 factory 內(nèi)部給 exports 重新賦值時，并不會改變 module.exports 的值。因此給 exports 賦值是無效的，不能用來更改模塊接口。
module.exports Object
當(dāng)前模塊對外提供的接口。
傳給 factory 構(gòu)造方法的 exports 參數(shù)是 module.exports 對象的一個引用。只通過 exports 參數(shù)來提供接口，有時無法滿足開發(fā)者的所有需求。 比如當(dāng)模塊的接口是某個類的實例時，需要通過 module.exports來實現(xiàn)：
define(function(require, exports, module) {
// exports 是 module.exports 的一個引用
console.log(module.exports === exports); // true
// 重新給 module.exports 賦值
module.exports = new SomeClass();
// exports 不再等于 module.exports
console.log(module.exports === exports); // false
});
注意：對 module.exports 的賦值需要同步執(zhí)行，不能放在回調(diào)函數(shù)里。下面這樣是不行的：
// x.jsdefine(function(require, exports, module) {
// 錯誤用法
setTimeout(function() {
module.exports = { a: "hello" };
}, 0);
});
在 y.js 里有調(diào)用到上面的 x.js:
// y.jsdefine(function(require, exports, module) {
var x = require('./x');
// 無法立刻得到模塊 x 的屬性 a
console.log(x.a); // undefined
});
希望本文所述對大家sea.js程序設(shè)計有所幫助。
相關(guān)文章
這篇文章主要介紹了Seajs的相關(guān)知識和和學(xué)習(xí)心得,適合剛接觸SeaJS的同學(xué),需要的朋友可以參考下2014-03-03
Seajs 簡易文檔 提供簡單、極致的模塊化開發(fā)體驗
這篇文章主要介紹了Seajs 簡易文檔 提供簡單、極致的模塊化開發(fā)體驗,非官方文檔，整理來自己官方文檔的文字與實例，方便速查。需要的朋友可以參考下2016-04-04
這篇文章主要介紹了SeaJS中use函數(shù)用法,結(jié)合實例形式分析了use函數(shù)加載模塊的使用方法與相關(guān)操作技巧,需要的朋友可以參考下2017-10-10
這篇文章主要介紹了seajs中模塊依賴的加載處理,結(jié)合實例形式分析了seajs模塊依賴與加載的原理、相關(guān)注意事項與使用方法,需要的朋友可以參考下2017-10-10
這篇文章主要介紹了seajs下require書寫約定,結(jié)合實例形式分析了seajs中require書寫約定遵循的規(guī)則,需要的朋友可以參考下2018-05-05
圖片懶加載是前端開發(fā)中一項重要的性能優(yōu)化策略,它能夠明顯縮短頁面加載時間,提升用戶的瀏覽體驗,在本文中,我們將深入探討在Vue開發(fā)時候如何實現(xiàn)圖片懶加載,同時探討多種實現(xiàn)途徑,需要的朋友可以參考下2023-08-08
這篇文章主要介紹了seajs模塊壓縮問題與解決方法,結(jié)合實例形式分析了seajs模塊壓縮過程中出現(xiàn)的問題及相應(yīng)的解決方法,需要的朋友可以參考下2017-10-10
這篇文章主要介紹了LABjs、RequireJS、SeaJS的區(qū)別、JS文件加載器、JS塊加載器等知識,需要的朋友可以參考下2014-03-03
做前端項目已經(jīng)離不開SeaJS了，現(xiàn)在的很多的網(wǎng)站都用了SeaJS，對這個JS模塊加載器原理的越來越感興趣。這篇文章我們來一起學(xué)習(xí)seajs模塊之間依賴的加載以及模塊的執(zhí)行，感興趣的朋友們下面來一起看看吧。2016-10-10
seajs學(xué)習(xí)之模塊的依賴加載及模塊API的導(dǎo)出
SeaJS是一個遵循 CommonJS 規(guī)范的模塊加載框架，可用來輕松愉悅地加載任意JavaScript模塊和css模塊樣式。SeaJS接口和方法也非常少，SeaJS 就兩個核心：模塊定義和模塊的加載及依賴關(guān)系。本文將詳細(xì)介紹模塊的依賴加載及模塊API的導(dǎo)出，有需要的朋友們可以參考借鑒。2016-10-10