seajs的原理以及基本使用

seajs模块化开发

　　模块化开发，把整个文件分割成一个一个小文件。

使用方法

　　使用方法特别简单，首先在官网中下载sea.js，然后在页面中引入。

index.html

文件里定义的module.exports里定义的) seajs.use('./js/part1.js',= dom('#Box'

part1.js

文件里互相引用模块文件可以使用我的xxx东西) define( =

有一些需要注意的地方

define( })

另外这一种判断使用哪个模块的

define('hello''word'

方法用来在模块内部异步加载模块，并在加载完成后执行指定回调。callback 参数可选。

define( require.async('./b',<span style="color: #008000;">//<span style="color: #008000;"> 异步加载多个模块，在加载完成时，执行回调
require.async(['./c','./d'],<span style="color: #0000ff;">function<span style="color: #000000;">(c,d) {
c.doSomething();
d.doSomething();
});
});
注意：require 是同步往下执行，require.async 则是异步回调执行。require.async 一般用来加载可延迟异步加载的模块

exports 是一个对象，用来向外提供模块接口。

define(属性 exports.foo = 'bar'方法 exports.doSomething =

除了给 exports 对象增加成员，还可以使用 return 直接向外提供接口。

define( 'bar'

如果 return 语句是模块中的唯一代码，还可简化为：

'bar'

上面这种格式特别适合定义 JSONP 模块。

特别注意：下面这种写法是错误的！

define(错误用法！！! exports ='bar'

正确的写法是用 return 或者给 module.exports 赋值：

define( module.exports ='bar'

提示：exports 仅仅是 module.exports 的一个引用。在 factory 内部给 exports 重新赋值时，并不会改变 module.exports 的值。因此给 exports 赋值是无效的，不能用来更改模块接口。

模拟他的原理

　　步骤如下：

文件： seajs.use(1,2)执行

　　2.插件：模块插件创建一个script标签通过script把模块引入进来

　　 3.插件：定义一个全局函数define，用来获取模块里面所写的代码

　　4.模块：模块文件里执行defined（传入一个函数）

　　5.插件： seajs.use插件执行上一步的函数并且传入三个参数

　　6.再执行模块里传入的参数过程中，改变了module

　　7.插件：插件里：执行回调函数，插件的第二个参数

　　 8.插件：删除掉上面加入的script标签

sea.js

seajs.use = function= document.createElement('script'= document.getElementsByTagName('script')[0=

</span><span style="color: #008000;"&gt;/*</span><span style="color: #008000;"&gt;function fn(dom) {
    return document.querySelector(dom);
}</span><span style="color: #008000;"&gt;*/</span><span style="color: #000000;"&gt;

let require,module </span>=<span style="color: #000000;"&gt; {};
window.define </span>= <span style="color: #0000ff;"&gt;function</span><span style="color: #000000;"&gt; (fn) {
    fn(require,module);
    cb(module.exports);
    s.parentNode.removeChild(oScript);
};

}

index.html

seajs('./a.js',=Box'); console.log(a); })

a.js

define( =

　　上面的代码就是模拟了一下加载模块的原理，其实就是自己新建了一个script标签，将那个引入的模块添加到了当前页面当中，和JSONP差不多的原理，模块中的define函数自己执行，将里面的函数传递到sea.js插件中，然后再去做处理，sea.js将模块中的module.exports = 的东西提取出来，回调函数传递给index中，接受到了这个模块中的module.exports。

　　其实我写的不是很清楚了，哈哈，可以用自己的方式去实现一下，我在这里写的这篇主要是对这两天学的一些东西做一下总结。

　　当然，如果你能从中收获一些我会非常高兴的，如果看到这里感觉什么都没用可以去官网去查看，上面讲的非常清楚。

原文链接：https://www.f2er.com/nodejs/238724.html

seajs的原理以及基本使用

seajs模块化开发

使用方法

有一些需要注意的地方

模拟他的原理

猜你在找的Node.js相关文章