您的位置：首页 > Web前端 > React

模拟 react 框架编码

2016-05-18 18:17 561 查看

前端 React 源码，真是无语，不得不说FaceBook写的就是牛逼，JS的逻辑特别的清晰，耦合性特别的强。

感觉 React 不错，所以就看了看源码，没事儿就模拟了下，代码附上：

<!DOCTYPE html>
<html>

<head>
<meta charset="UTF-8">
<meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport">
<title></title>
</head>

<body>
yubai
</body>
<script src="../../build/jquery.min.js"></script>
<script src="man.js"></script>
<script>
console.log(React);
console.log(React.render);
React.render.search();
</script>

</html>

main.js文件

(function(f){
if (typeof exports === "object" && typeof module !== "undefined") {
module.exports = f()
} else if (typeof define === "function" && define.amd) {
define([], f)
} else {
var g;
if (typeof window !== "undefined") {
g = window
} else if (typeof global !== "undefined") {
g = global
} else if (typeof self !== "undefined") {
g = self
} else {
g = this
}
g.React = f()
}
})(function(){

return (function e(t, n, r) {
function s(o, u) {
if (!n[o]) {
if (!t[o]) {
var a = typeof require == "function" && require;
if (!u && a) return a(o, !0);
if (i) return i(o, !0);
var f = new Error("Cannot find module '" + o + "'");
throw f.code = "MODULE_NOT_FOUND", f
}
var l = n[o] = {
exports: {}
};
t[o][0].call(l.exports, function(e) {
var n = t[o][1][e];
return s(n ? n : e)
}, l, l.exports, e, t, n, r)
}
return n[o].exports
}
var i = typeof require == "function" && require;
for (var o = 0; o < r.length; o++) s(r[o]);
return s
})({
1: [function(_dereq_, module, exports){

'use strict';
var assign = _dereq_(2);

var React = {
render: assign,
};

module.exports = React;
}, {
"2": 2,
"3":3
}],
2:[function(_dereq_, module, exports){
console.log("222222222222222222222222222");

var strSub = {
search:function(){
console.log("这里是数组1的 search()方法")
},
searchName:function(){
console.log("这里是数组1的 searchName()方法")
}
};

module.exports = strSub;
}, {}]

}, {}, [1])(1)

});

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航