深入seajs源码系列一

简述

        前端开发模块化已经是大势所趋,目前模块化的规范有很多,众所周知的有commonJS,Module/Wrappings和AMD等,而且ES6也着手开始制定模块化机制的实现。类似于c/c++的include,java中的import关键字,在js中也定义了require关键字,用以引进依赖模块。

        由于规范的多样性,模块化的实现也是各有各的不同。nodejs遵从的就是commonJS规范,它有着一些形式上的约定:  

  1. require为函数,该函数接受一个字符串作为模块标示符
  2. require函数返回值为该模块API
  3. require函数出错,则抛出异常
  4. exports导出模块API
  5. 如果有多个require,则依次加载依赖

        但是浏览器端加载的模块却不像服务器端,依赖模块不在本地,需要通过http请求获取文件,这就涉及到异步加载。但是异步加载并不阻塞代码的运行,如果函数上下文中应用了加载的依赖模块,而此时依赖模块并未加载或者解析完毕,就会抛出undefined错误,避免该错误的发生可以使用回调模式。当所有依赖模块均加载完毕,后执行代码。这也就是Module/Wrappings规范,而seajs基本实现了该规范。

剖析

阅读seajs官网的入门demo,首先在主页面引入seajs文件,并设置入口

// seajs 的简单配置
seajs.config({
  base: "../sea-modules/",
  alias: {
    "jquery": "jquery/jquery/1.10.1/jquery.js"
  }
})

// 加载入口模块
seajs.use("../static/hello/src/main")

其次定义模块(main.js)

// 所有模块都通过 define 来定义
define(function(require, exports, module) {

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

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

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

});

这样,当打开页面时,会调用seajs.use函数并加载main.js文件,此时解析main模块的依赖,并加载jquery和spining模块,待这两个模块加载完毕,执行回调函数。具体执行细节将会在分析源码时提到。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏用户2442861的专栏

linux工作中常用文件操作命令

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/haluoluo211/article/d...

27920
来自专栏Golang语言社区

Go语言中的管道(Channel)总结

管道(Channel)是Go语言中比较重要的部分,经常在Go中的并发中使用。今天尝试对Go语言的管道来做以下总结。总结的形式采用问答式的方法,让答案更有目的性。...

43760
来自专栏FreeBuf

打造一款属于自己的远程控制软件(二)

前一篇文章介绍了软件的整体架构,接下来对被控端进行详细讲解,主要介绍被控端各个功能模块的关键技术以及开发过程中遇到的坑,希望对各位读者有借鉴作用。 被控端工作流...

31150
来自专栏别先生

Linux学习笔记(Ubuntu操作系统)之hadoop学习之路

1:检查虚拟机的ip命令:ifconfig 2:普通用户切换root用户命令:su 3:root用户切换普通用户命令:su 用户名 4:普通用户执行系统执行前面...

25170
来自专栏hbbliyong

错误提示之(MVC3.0):HTTP 404。您正在查找的资源(或者它的一个依赖项)可能已被移除,或其名称已更改,或暂时不可用。请检查以下 URL 并确保其拼写正确 MVC误设起始页

MVC3.0框架开发项目: 有时在程序运行的时候会出现“HTTP 404。您正在查找的资源(或者它的一个依赖项)可能已被移除,或其名称已更改,或暂时不可用。请检...

42960
来自专栏Java技术分享

Dubbo-admin无法显示Group分组信息以及是否可以显示多个分组

在首次使用Dubbo的时候,我们可能都会使用Dubbo-admin来监控服务的提供者和消费者,但是在自己的生产者成功运行的时候,在Dubbo-admin却看不到...

36870
来自专栏每日一篇技术文章

微信小程序_05 模板的使用

@import "../../templates/reward/reward.wxss";

29610
来自专栏北京马哥教育

25个shell脚本代码分享,日常工作够用了

引言 自己写了一下小的shell实例,虽然很小,但所有的大的程序都是由小的模块堆积起来的。 程序员一定要懂得一种脚本的书写,而我,只会在linux下工作,所以...

442110
来自专栏黑泽君的专栏

用gcc编译c语言程序以及其编译过程

对于初学c语言编程的我们来说,学会如何使用gcc编译器工具,对理解c语言的执行过程,加深对c语言的理解很重要!!!

17010
来自专栏Laoqi's Linux运维专列

nginx的502问题

36350

扫码关注云+社区

领取腾讯云代金券