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 內部給 exports 重新賦值時，并不會改變 module.exports 的值。因此給 exports 賦值是無效的，不能用來更改模塊接口。
module.exports Object
當前模塊對外提供的接口。
傳給 factory 構造方法的 exports 參數(shù)是 module.exports 對象的一個引用。只通過 exports 參數(shù)來提供接口，有時無法滿足開發(fā)者的所有需求。 比如當模塊的接口是某個類的實例時，需要通過 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í)行，不能放在回調函數(shù)里。下面這樣是不行的：
// x.jsdefine(function(require, exports, module) {
// 錯誤用法
setTimeout(function() {
module.exports = { a: "hello" };
}, 0);
});
在 y.js 里有調用到上面的 x.js:
// y.jsdefine(function(require, exports, module) {
var x = require('./x');
// 無法立刻得到模塊 x 的屬性 a
console.log(x.a); // undefined
});
希望本文所述對大家sea.js程序設計有所幫助。
相關文章
做前端項目已經(jīng)離不開SeaJS了，現(xiàn)在的很多的網(wǎng)站都用了SeaJS，對這個JS模塊加載器原理的越來越感興趣。這篇文章我們來一起學習seajs模塊之間依賴的加載以及模塊的執(zhí)行，感興趣的朋友們下面來一起看看吧。2016-10-10
Seajs是一個Web模塊加載框架，追求簡單、自然的代碼書寫和組織方式，Sea.js 遵循 CMD 規(guī)范，模塊化JS代碼。依賴的自動加載、配置的簡潔清晰，可以讓程序員更多地專注編碼。這篇文章為seajs深入學習的第一篇，主要介紹的基礎性的內容，感興趣的朋友們可以參考學習。2016-10-10
這篇文章主要介紹了seajs中最常用的7個功能、配置,結合實例形式簡單分析了seajs中常用的項目配置、模塊加載、定義、獲取等操作技巧,需要的朋友可以參考下2017-10-10
近幾年前端工程化越來越完善，打包工具也已經(jīng)是前端標配了，像seajs這種老古董早已停止維護，這是一篇細細品味Seajs源碼的文章,看完一定受益匪淺2019-04-04
這篇文章主要介紹了SeaJS入門教程系列之完整示例,演示了一個完整的SeaJS開發(fā)例子,需要的朋友可以參考下2014-03-03
這篇文章主要介紹了seajs中模塊依賴的加載處理,結合實例形式分析了seajs模塊依賴與加載的原理、相關注意事項與使用方法,需要的朋友可以參考下2017-10-10
這篇文章主要介紹了seajs中模塊的解析規(guī)則詳解和模塊使用總結,需要的朋友可以參考下2014-03-03
這篇文章主要介紹了SeaJS入門教程,講述了SeaJS的由來,JavaScript傳統(tǒng)開發(fā)模式和模塊化開發(fā)的對比,需要的朋友可以參考下2014-03-03
SeaJS是一個遵循 CommonJS 規(guī)范的模塊加載框架，可用來輕松愉悅地加載任意JavaScript模塊和css模塊樣式。SeaJS接口和方法也非常少，SeaJS 就兩個核心：模塊定義和模塊的加載及依賴關系。本文將詳細介紹模塊的依賴加載及模塊API的導出，有需要的朋友們可以參考借鑒。2016-10-10
Seajs是什么及sea.js 由來，特點以及優(yōu)勢
這篇文章主要介紹了Seajs的相關知識和和學習心得,適合剛接觸SeaJS的同學,需要的朋友可以參考下，有更好的新手教程或文檔，歡迎推薦、分享2016-10-10