require.js学习笔记2

来源:互联网 发布:mac 下载ipython 编辑:程序博客网 时间:2024/05/16 09:05


require.js学习笔记1——传送门>>>>>>>


RequireJS的目标是鼓励代码的模块化,它使用了不同于传统<script>标签的脚本加载步骤。可以用它来加速、优化代码,但其主要目的还是为了代码的模块化。它鼓励在使用脚本时以module ID替代URL地址。


一、定义模块


模块不同于传统的脚本文件,它良好地定义了一个作用域来避免全局名称空间污染。它可以显式地列出其依赖关系,并以函数(定义此模块的那个函数)参数的形式将这些依赖进行注入,而无需引用全局变量。RequireJS的模块是模块模式的一个扩展,其好处是无需全局地引用其他模块。

RequireJS的模块语法允许它尽快地加载多个模块,虽然加载的顺序不定,但依赖的顺序最终是正确的。同时因为无需创建全局变量,甚至可以做到在同一个页面上同时加载同一模块的不同版本。


1.1简单的值对

如果一个模块仅含值对,没有任何依赖,则在define()中定义这些值对就好了:

define({    color: "black",    size: "unisize"});


1.2函数式定义

如果一个模块没有任何依赖,但需要一个做setup工作的函数,则在define()中定义该函数,并将其传给define():

define(function () {    //Do setup work here    return {        color: "black",        size: "unisize"    }});


1.3存在依赖的函数式定义

如果模块存在依赖:则第一个参数是依赖的名称数组;第二个参数是函数,在模块的所有依赖加载完毕后,该函数会被调用来定义该模块,因此该模块应该返回一个定义了本模块的object。依赖关系会以参数的形式注入到该函数上,参数列表与依赖名称列表一一对应。

define(["./cart", "./inventory"], function(cart, inventory) {        //return an object to define the "my/shirt" module.        return {            color: "blue",            size: "large",            addToCart: function() {                inventory.decrement(this);                cart.add(this);            }        }    });

1.4将模块定义为一个函数

对模块的返回值类型并没有强制为一定是个object,任何函数的返回值都是允许的。此处是一个返回了函数的模块定义:

define(["./cart", "./inventory"],function(cart, inventory) {        //return a function to define "foo/title".        //It gets or sets the window title.        return function(title) {            return title ? (window.title = title) :            inventory.storeName + ' ' + cart.name;        }    });


0 0
原创粉丝点击