1. JS在实战中的分层方法,主要是分为四层,浏览器底层,框架core核心层,框架组件层,应用层。
2. 浏览器底层,存在的问题
JS核心语法层面薄弱
JS原生API不好用
浏览器兼容问题
后来有了框架核心层去解决以上的问题,如Prototype,YUI,
Dojo,以及一直流行很长时间的JQuery。
框架组件层,提高了一些简单的控件,如input,text,
checkbox radio select 可是还有其他常用控件没有提供
如 日历选择器,富文本编辑器等。这些通常由程序员编写。
框架组件层,又可以分为 定制组件 和框架通用组件
而一般的框架通用组件又大公司(BAT等之类)会自己开发,
通常我们程序员使用还是定制组件,所以定制组件,才是我们的核心。
3. 模块化和require.js
解决多个JS文件模块依赖关系。
用define定义模块
举个栗子:
模块名就是文件名mod1
mod1
define(function(){
return {a:3}; //返回一个字典
});
mod2
//参数m1 就代表模块1return出来的字典
define(['mod1'],function(m1){
var a, b=2, c=3;
a = c*m1.a;
return{
a:a
b:b
};
});
main.js (require 类似java的main方法),从这里开始执行
require接收2个参数,第一个数组,第二个是个函数,传入什么模块名,函数就接收什么参数。
应用层:
main.js
require(['mod2'],function(m2){
alert(m2.a * m2.b);
});
那如何使用呢?
index.html
<body>
...<!-- 当加载完成require.js后,会去找data-main路径下的main,不需要加后缀.js,即整个程序的入口 -->
<script src="js/require.js" data-main="js/main"></script>
</body>