源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

seajs学习教程之基础篇

  • 时间:2022-08-17 03:59 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:seajs学习教程之基础篇
[b]介绍[/b] 众所周知前端开发模块化已经是大势所趋,目前模块化的规范有很多,众所周知的有commonJS,Module/Wrappings和AMD等,而且ES6也着手开始制定模块化机制的实现。类似于c/c++的include,java中的[code]import[/code]关键字,在js中也定义了[code]require[/code]关键字,用以引进依赖模块。 由于规范的多样性,模块化的实现也是各有各的不同。 [b]nodejs遵从的就是commonJS规范,它有着一些形式上的约定: [/b]        1、require为函数,该函数接受一个字符串作为模块标示符       2、require函数返回值为该模块API       3、require函数出错,则抛出异常       4、exports导出模块API       5、如果有多个require,则依次加载依赖 但是浏览器端加载的模块却不像服务器端,依赖模块不在本地,需要通过http请求获取文件,这就涉及到异步加载。但是异步加载并不阻塞代码的运行,如果函数上下文中应用了加载的依赖模块,而此时依赖模块并未加载或者解析完毕,就会抛出undefined错误,避免该错误的发生可以使用回调模式。当所有依赖模块均加载完毕,后执行代码。这也就是Module/Wrappings规范,而seajs基本实现了该规范。 [b]SeaJS 是一个模块加载器,模块加载器需要实现两个基本功能:[/b]       1、实现模块定义规范,这是模块系统的基础。       2、模块系统的启动与运行。 [b]剖析[/b] 阅读seajs官网的入门demo,首先在主页面引入seajs文件,并设置入口
// seajs 的简单配置
seajs.config({
 base: "../sea-modules/",
 alias: {
 "jquery": "jquery/jquery/1.10.1/jquery.js"
 }
})

// 加载入口模块
seajs.use("../static/hello/src/main")
[b]其次定义模块(main.js)[/b]
// 所有模块都通过 define 来定义
define(function(require, exports, module) {

 // 通过 require 引入依赖
 var $ = require('jquery');
 var Spinning = require('./spinning');

 // 通过 exports 对外提供接口
 exports.doSomething = ...

 // 或者通过 module.exports 提供整个接口
 module.exports = ...

});
这样,当打开页面时,会调用[code]seajs.use[/code]函数并加载main.js文件,此时解析main模块的依赖,并加载jquery和spining模块,待这两个模块加载完毕,执行回调函数。具体执行细节将会在分析源码时提到。 [b]总结[/b] 以上就是关于seajs介绍与剖析的全部内容,希望本文的内容对大家学习或者使用seajs能有所帮助,如果有疑问大家可以留言交流。小编还会陆续更新关于seajs的文章,感兴趣的朋友们请继续关注编程素材网。
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部