require和 sea的源码分析,我之前的博客有写过, 今天我想分享的是一个很简单的核心代码(不带注释和空行大概60行), 没有容错判断。
require.js
require函数实现用一句话概括:
依次加载require的模块,然后监测script的onload事件,判断所有模块加载成功,执行require的callback, 如果只带一个参数且不是数组,就是加载成功后return 模块。
//标记已经加载成功的个数
var REQ_TOTAL = 0;
//模块导出
window.exports = {};
//记录各个模块的顺序
var exp_arr = [];
//判断是否数组
function isArray(param) {
return param instanceof Array;
}
//require 真正实现
function require(arr, callback) {
var req_list;
if(isArray(arr)) {
req_list = arr;
} else {
req_list = [arr];
}
var req_len = req_list.length;
//模块逐个加载
for(var i=0;i<req_len;i++) {
var req_item = req_list[i];
var $script = createScript(req_item, i);
var $node = document.querySelector('head');
(function($script) {
//检测script 的onload事件
$script.onload = function() {
REQ_TOTAL++;
var script_index = $script.getAttribute('index');
exp_arr[script_index] = exports;
window.exports = {};
//所有链接加载成功后,执行callback
if(REQ_TOTAL == req_len) {
callback && callback.apply(exports, exp_arr);
}
}
$node.appendChild($script);
})($script);
}
}
//创建一个script标签
function createScript(src, index) {
var $script = document.createElement('script');
$script.setAttribute('src', src);
$script.setAttribute('index', index);
return $script;
}
然后写了2个导出模块的js文件, 只写了最简单的exports实现
define.js
exports.define = {
topic: 'my export',
desc: 'this is other way to define ',
sayHello: function() {
console.log('topic ' + this.topic + this.desc);
}
}
define2.js
exports.define = {
name: 'xm',
age: 22,
info: function() {
console.log('topic ' + this.name + this.age);
}
}
然后测试demo很简单
//测试demo
require(['../res/define.js', '../res/define2.js'], function(def, def2) {
def.define.sayHello();
def2.define.info();
});
以上就是小编为大家带来的一个极为简单的requirejs实现方法全部内容了,希望大家多多支持~
标签:
requirejs实现原理
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件!
如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
白云城资源网 Copyright www.dyhadc.com
暂无“一个极为简单的requirejs实现方法”评论...
更新日志
2025年10月27日
2025年10月27日
- 小骆驼-《草原狼2(蓝光CD)》[原抓WAV+CUE]
- 群星《欢迎来到我身边 电影原声专辑》[320K/MP3][105.02MB]
- 群星《欢迎来到我身边 电影原声专辑》[FLAC/分轨][480.9MB]
- 雷婷《梦里蓝天HQⅡ》 2023头版限量编号低速原抓[WAV+CUE][463M]
- 群星《2024好听新歌42》AI调整音效【WAV分轨】
- 王思雨-《思念陪着鸿雁飞》WAV
- 王思雨《喜马拉雅HQ》头版限量编号[WAV+CUE]
- 李健《无时无刻》[WAV+CUE][590M]
- 陈奕迅《酝酿》[WAV分轨][502M]
- 卓依婷《化蝶》2CD[WAV+CUE][1.1G]
- 群星《吉他王(黑胶CD)》[WAV+CUE]
- 齐秦《穿乐(穿越)》[WAV+CUE]
- 发烧珍品《数位CD音响测试-动向效果(九)》【WAV+CUE】
- 邝美云《邝美云精装歌集》[DSF][1.6G]
- 吕方《爱一回伤一回》[WAV+CUE][454M]