SeaJS入门
2015-09-20 21:50
645 查看
SeaJS是一个遵循CommonJS规范的JavaScript模块加载框架,可以实现JavaScript的模块化开发及加载机制。与jQuery等 JavaScript框架不同,SeaJS不会扩展封装语言特性,而只是实现JavaScript的模块化及按模块加载。
SeaJS的主要目的是令 JavaScript开发模块化并可以轻松愉悦进行加载,将前端工程师从繁重的JavaScript文件及对象依赖处理中解放出来,可以专注于代码本身的 逻辑。SeaJS可以与jQuery这类框架完美集成。使用SeaJS可以提高JavaScript代码的可读性和清晰度,解决目前JavaScript 编程中普遍存在的依赖关系混乱和代码纠缠等问题,方便代码的编写和维护。
SeaJS的作者是前淘宝UED,现支付宝前端工程师玉伯。
SeaJS主要解决三个问题:命名冲突,依赖,性能。
我们在做项目的过程中,是不是有些项目迭代频繁,js之间的依赖性太强,而最终代码量复杂度搞得我们不想再维护下去了,太乱了维护起来太痛苦了,之前我也有这样经历。后来就用了SeaJS做代码管理,使用SeaJS非常适用于多人合作的,且需求一变再变反复修改迭代升级长期维护的项目,这样我们不用考虑别人怎么命名变量或者函数,我们可以挥洒自如,因为每个功能模块只有一个对外的接口,我们要使用模块内变量或者方法必有通过这个接口,不然是访问不到的,而且引用同一个模块js只会加载一次,不会损耗性能。
SeaJS的基本配置:
首先在页面中引入seajs,然后根据项目实际情况配置以下参数:
模块的书写约定
默认会传入三个参数:
在页面中如何加载使用模块,此时用到use方法,例如:
与 DOM ready 的关系:
注意:seajs.use 与 DOM ready 事件没有任何关系。如果某些操作要确保在 DOM ready 后执行,需要使用 jquery 等类库来保证,比如:
SeaJS的主要目的是令 JavaScript开发模块化并可以轻松愉悦进行加载,将前端工程师从繁重的JavaScript文件及对象依赖处理中解放出来,可以专注于代码本身的 逻辑。SeaJS可以与jQuery这类框架完美集成。使用SeaJS可以提高JavaScript代码的可读性和清晰度,解决目前JavaScript 编程中普遍存在的依赖关系混乱和代码纠缠等问题,方便代码的编写和维护。
SeaJS的作者是前淘宝UED,现支付宝前端工程师玉伯。
SeaJS主要解决三个问题:命名冲突,依赖,性能。
我们在做项目的过程中,是不是有些项目迭代频繁,js之间的依赖性太强,而最终代码量复杂度搞得我们不想再维护下去了,太乱了维护起来太痛苦了,之前我也有这样经历。后来就用了SeaJS做代码管理,使用SeaJS非常适用于多人合作的,且需求一变再变反复修改迭代升级长期维护的项目,这样我们不用考虑别人怎么命名变量或者函数,我们可以挥洒自如,因为每个功能模块只有一个对外的接口,我们要使用模块内变量或者方法必有通过这个接口,不然是访问不到的,而且引用同一个模块js只会加载一次,不会损耗性能。
SeaJS的基本配置:
首先在页面中引入seajs,然后根据项目实际情况配置以下参数:
,此时用到define是一个全局函数,用来定义模块:
require、
exports和
module。
在页面中如何加载使用模块,此时用到use方法,例如:
use方法还可以一次加载多个模块:
callback参数可选,省略时,表示无需回调。
与 DOM ready 的关系:
注意:seajs.use 与 DOM ready 事件没有任何关系。如果某些操作要确保在 DOM ready 后执行,需要使用 jquery 等类库来保证,比如:
seajs.use理论上只用于加载启动,不应该出现在
define中的模块代码里。在模块代码里需要异步加载其他模块时,推荐使用
require.async方法。
相关文章推荐
- $.getJSON()跨域请求
- JS可复用的多条件筛选插件
- 简易版网页计算器js代码页面
- Javascript - code snippet - function 1
- 保护JS代码的几种方法
- ExtJS Combobox 属性详解和默认值选中
- 重新认识JavaScript
- 详细js中(function(window,document,undefined))的作用
- JavaScript获取DOM元素位置和尺寸大小
- 201509020-js
- JS中关于clientWidth offsetWidth scrollWidth 等的区别
- Javascript - Function access scope analysis 函数在页面上的可访问性浅析
- BackboneJs入门学习[08]—Router路由初探
- JSP与Servlet区别简述
- 简易抽签程序(数字滚动 HTML + JavaScript)
- JavaScript权威设计--命名空间,函数,闭包(简要学习笔记十二)
- Jsp与servlet的区别
- 利用 fastjson.jar 把对象解析成Json 数据
- 犀牛——第13章 13.3 JavaScript程序的执行
- Three.js 第一篇:绘制一个静态的3D球体