seajs 模块化编程js代码

YJNldm 发布于2019-08-19 17:10 / 2898人阅读

摘要：模块初始化时，会调用且仅调用一次该工厂函数。用来向外提供模块的除了给对象增加成员，还可以使用直接向外提供可简化为函数用来访问其他模块提供的异步加载模块，并在加载完成后执行回调函数使用的内部机制来解析并返回模块路径。手册的模块化插件

seajs是我刚入门前端就接触到的一个javaScript模块加载框架。使用seajs后javaScript代码的可读性和清晰度有了很大的提升，插件的使用和组装变的很方便。更加方便代码的升级和维护。推荐使用插件比较多的项目使用。或者使用requirejs也比较流行。

ps:如果想知道RequireJS、SeaJS哪个好用的可以自行对比，或者查看

seajs 的简单上手

首先先去官网下载最新版本。
下载后，假定把它放在js子目录下面，就可以加载了。

加载seajs后我们还需要加载自己的js配置文件

seajs 的简单配置

      //.sea-config.js 
      seajs.config({
          base: "../plug-js/",
          alias: {
            "jquery": "jquery/1.10.1/jquery.js"
          }
      })

简单使用

  // 所有模块都通过define来定义
  define(function(require,exports,module){
        // 通过require来引入jquery
        var $ = require("jquery");
        
        console.log($);
  })

seajs参数 define

使用全局函数define来定义函数

define(id?,dependencies?,factory);

id: 当前模块的唯一标识。该参数可选。如果没有指定，默认为模块所在文件的访问路径。如果指定的话，必须是顶级或绝对标识。
dependencies: 当前模块所依赖的模块，是一个由模块标识组成的数组。
factory: 模块的工作函数。模块初始化时，会调用且仅调用一次该工厂函数。

define(function(require,exports,module){
    //The module code goes here
})

**注意：不推荐不要设定id和dependencies参数。

exports

exports 用来向外提供模块的API

define(function(require,exports){
    // snip 
    exports.foo = "bar";
    exports.doSomething = function(){};
})

除了给exports对象增加成员，还可以使用return直接向外提供API

define(function(require,exports){
    // snip...
    return {
      foo : "bar",
      doSomething : function(){}
    }
})
可简化为:
define({
   foo : "bar",
   doSomething : function(){} 
})

require

require函数用来访问其他模块提供的API

define(function(require){
   var a = require("./a");
   a.doSomething();
})

require.async: 异步加载模块，并在加载完成后执行回调函数
require.resolv: 使用require()的内部机制来解析并返回模块路径。该函数不会加载模块，只返回解析后的路径。
require.load: 该方法可用异步加载脚本，并在加载完成后，执行指定的回调函数。
require.constructor: 给所有require参数对象添加一些公用属性或方法。

module

modeule 参数存储模块的元信息

module.id: 当前模块的唯一标识。
module.dependencies: 表示当前模块的依赖列表
module.exports: exports是某个类的实例

   define(function(require,exports,module){
         console.log(module.exports === exports); // true
         module.exports = new SomeClass();
         console.log(module.exports === exports); // false
   })

module.constructor: 给module参数对象添加一些公用属性或方法。

api手册

seajs的模块化插件

GPU云服务器云服务器 seajs模块 linux模块化编程 javascript模块化编程 html订单模块代码

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/78263.html

再谈JavaScript模块化

摘要：应用日益复杂，模块化已经成为一个迫切需求。异步模块加载机制。引用的资源列表太长，懒得回调函数中写一一对应的相关参数假定这里引用的资源有数十个，回调函数的参数必定非常多这就是传说中的简述缘起模块通常是指编程语言所提供的代码组织机制，利用此机制可将程序拆解为独立且通用的代码单元。模块化主要是解决代码分割、作用域隔离、模块之间的依赖管理以及发布到生产环境时的自动化打包与处理等多个方面...

MorePainMoreGain 2019-08-26 10:14 评论0 收藏0
使用CommonJS，AMD以及CMD编写模块化JavaScripts

摘要：模块化编程首先，我想说说模块化编程这个概念当我不清楚这个概念的时候，其实说什么模块化编程多好多好都是懵逼的而我一直不觉得有多好，其实也是因为我从开始写，就一直都在模块化编程啊我们写一个文件然后我们在文件中引入然后调用方法哈哈这样已经是模块化模块化编程首先，我想说说模块化编程这个概念当我不清楚这个概念的时候，其实说什么模块化编程多好多好都是懵逼的而我一直不觉得有多好，其实也是因为我从...

nifhlheimr 2019-08-22 10:34 评论0 收藏0
关于JavaScript模块规范之CommonJSAMDCMD

摘要：所有依赖这个模块的语句，都定义在一个回调函数中，等到加载完成之后，这个回调函数才会运行。也采用语句加载模块，但是不同于，它要求两个参数第一个参数，是一个数组，里面的成员就是要加载的模块第二个参数，则是加载成功之后的回调函数。本篇文章来自对文章《js模块化编程之彻底弄懂CommonJS和AMD/CMD！》的总结，大部分摘自文章原话，本人只是为了学习方便做的笔记，之后有新的体会会及时补充...

binaryTree 2019-08-26 13:22 评论0 收藏0
require.js构建优化

摘要：未构建之前，全部分开加载。的优化，得再看下的示例，然后再写篇笔记记录下来。想摸透javascript模块化编程是怎么一回事，在seajs和requirejs之间兜兜转转，看了许多相关资料和文章，算是大致理清它们的异同，撇开requirejs加载方式的另类（其实目前我暂时还没去感受），于写法，比较喜欢requirejs的写法，这个比较主观，这也得益于阮一峰大大那篇Javascript模...

yacheng 2019-08-21 12:22 评论0 收藏0
commonjs、AMD、CMD规范(相关文章)

摘要：是对的规范的实现，当然和规范还是有点误差的。，就是遵循他提出的规范。 1：Javascript模块化编程（三）：require.js的用法 http://www.ruanyifeng.com/blo...2：RequireJS 模块的定义与加载 http://www.cnblogs.com/bzggoo...(加载的顺序不定，但依赖的顺序最终是正确的;因为无需创建全局变量，甚至可以做到...

lcodecorex 2019-08-21 11:17 评论0 收藏0