seaJs使用心得之exports与module.exports的区别实例分析


Posted in Javascript onOctober 13, 2017

本文实例讲述了seaJs使用心得之exports与module.exports的区别。分享给大家供大家参考,具体如下:

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 参数是 module.exports 对象的一个引用。只通过 exports 参数来提供接口,有时无法满足开发者的所有需求。 比如当模块的接口是某个类的实例时,需要通过 module.exports来实现:

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 的赋值需要同步执行,不能放在回调函数里。下面这样是不行的:

// 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程序设计有所帮助。

Javascript 相关文章推荐
ajax无刷新动态调用股票信息(改良版)
Nov 01 Javascript
简单常用的幻灯片播放实现代码
Sep 25 Javascript
使用javascript做的一个随机点名程序
Feb 13 Javascript
探寻Javascript执行效率问题
Nov 12 Javascript
JavaScript实现大数的运算
Nov 24 Javascript
angularjs指令中的compile与link函数详解
Dec 06 Javascript
纯javascript实现的小游戏《Flappy Pig》实例
Jul 27 Javascript
Bootstrap3.0学习教程之JS折叠插件
May 27 Javascript
jquery与ajax获取特殊字符实例详解
Jan 08 Javascript
Vue封装一个简单轻量的上传文件组件的示例
Mar 21 Javascript
浅谈Angular6的服务和依赖注入
Jun 27 Javascript
Vite + React从零开始搭建一个开源组件库
Jun 25 Javascript
vue中axios处理http发送请求的示例(Post和get)
Oct 13 #Javascript
JavaScript实现随机数生成器(去重)
Oct 13 #Javascript
AngualrJs清除定时器遇到的坑
Oct 13 #Javascript
React Native中Navigator的使用方法示例
Oct 13 #Javascript
React Native中TabBarIOS的简单使用方法示例
Oct 13 #Javascript
ReactJS实现表单的单选多选和反选的示例
Oct 13 #Javascript
Angular.js通过自定义指令directive实现滑块滑动效果
Oct 13 #Javascript
You might like
使用 php4 加速 web 传输
2006/10/09 PHP
关于在php.ini中添加extension=php_mysqli.dll指令的说明
2007/06/14 PHP
PHP伪静态页面函数附使用方法
2008/06/20 PHP
如何突破PHP程序员的技术瓶颈分析
2011/07/17 PHP
PHP字符串的递增和递减示例介绍
2014/02/11 PHP
Fatal error: Allowed memory size of 134217728 bytes exhausted (tried to allocate 2611816 bytes)
2014/11/08 PHP
PHP水印类,支持添加图片、文字、填充颜色区域的实现
2017/02/04 PHP
PHP+MySQL实现模糊查询员工信息功能示例
2018/06/01 PHP
php进程daemon化的正确实现方法
2018/09/06 PHP
讨论html与javascript在浏览器中的加载顺序问题
2013/11/27 Javascript
jquery中的查找parents与closest方法之间的区别
2013/12/02 Javascript
Javascript中3个需要注意的运算符
2015/04/02 Javascript
jQuery动画效果图片轮播特效
2016/01/12 Javascript
XMLHttpRequest Level 2 使用指南
2016/08/26 Javascript
Bootstrap复选框和单选按钮美化插件(推荐)
2016/11/23 Javascript
vue与bootstrap实现简单用户信息添加删除功能
2019/02/15 Javascript
vue使用axios上传文件(FormData)的方法
2019/04/14 Javascript
使用react context 实现vue插槽slot功能
2019/07/18 Javascript
Bootstrap实现省市区三级联动(亲测可用)
2019/07/26 Javascript
vue滚动插件better-scroll使用详解
2019/10/18 Javascript
webpack proxy 使用(代理的使用)
2020/01/10 Javascript
2019年度web前端面试题总结(主要为Vue面试题)
2020/01/12 Javascript
JavaScript经典案例之简易计算器
2020/08/24 Javascript
Vue中关闭弹窗组件时销毁并隐藏操作
2020/09/01 Javascript
ant-design-vue 时间选择器赋值默认时间的操作
2020/10/27 Javascript
python编写暴力破解FTP密码小工具
2014/11/19 Python
基于python指定包的安装路径方法
2018/10/27 Python
Pycharm+Python+PyQt5使用详解
2019/09/25 Python
新手入门学习python Numpy基础操作
2020/03/02 Python
白色公司:The White Company
2017/10/11 全球购物
DeinDesign德国:设计自己的手机壳
2019/12/14 全球购物
Sisley法国希思黎美国官方网站:享誉全球的奢华植物美容品牌
2020/06/27 全球购物
消防安全标语
2014/06/07 职场文书
党员公开承诺书2015
2015/01/21 职场文书
《悲惨世界》:比天空更广阔的是人的心灵
2020/01/16 职场文书
Win11显卡控制面板打开显卡设置方法
2022/04/20 数码科技