Js开发在整个行业的现状主要的有两点
1，全局变量命名混乱冲突导致系统错误
2，代码集中少量文件导致开发效率降低
3，容易出现功能重复开发
Js开发编写方式的演进
//Inside file my/shirt.js:
define({
color: "black",
size: "unisize“
});
define(function () {
//Do setup work here
return {
color: "black",
size: "unisize“
}
});
Definition Functions with Dependencies
//module in the same directory as shirt.js
define(["./cart", "./inventory"], function(cart, inventory) {
//return an object to define the "my/shirt" module.
return {
color: "blue",
size: "large",
addToCart: function() {
inventory.decrement(this);
cart.add(this);
}
}
} );
那么，执行了这个模块的初始化会依次的加载顺序为
my/cart.js
my/inventory.js
my/shirt.js
define(["my/cart", "my/inventory"], function(cart, inventory) {
//return a function to define "foo/title".
//It gets or sets the window title.
return function(title) {
return title ? (window.title = title) : inventory.storeName + ' ' + cart.name;
}
} );
Define a Module with Simplified CommonJS Wrapper
define(function(require, exports, module) {
var a = require('a'),
b = require('b');
//Return the module value
return function () {};
} );
这个定义就可以把模块内部的任何变量暴露给exports来作为模块的属性提供。比如：
内有个定义
var name=‘nickli’;
这个就仅仅是模块的内部私有变量，但是要想作为这个模块的属性提供就可以
Exports.name=“nickli”;
然后在require这个模块的时候 就可以访问到name这个属性了
最后一点，也是比较重要的一点
Define a Module with a Name 给一个模块设置一个名字，这个在多个模块压缩成一个文件的时候是必要的，因为否则模块系统就找不到你压缩的文件里面哪个模块是哪个。而且这个name的定义 在你的开发环境中也要符合模块文件的路径，比如你的m模块在a文件夹下，那么你的name 的定义也要是 a/m
//Explicitly defines the "foo/title" module:
define("foo/title",
["my/cart", "my/inventory"],
function(cart, inventory) {
//Define foo/title object in here.
}
);
模块化后的加载
Require.js加载完毕后会自动去 拉取scripts/main.js
//Inside scripts/main.js
会依次加载some/module.js a.js b.js三个文件
模块化后的新问题
posted on
