NiYingfeng 的博客

if(wl && wl.length){
for(var i=0; i<wl.length;i++){
p = wl[i];
        type=Y.Lang.type(wl[i]);
        ...
    }
}

if(wl && wl.length){
        for(var i=0; i<wl.length;i++){
                p = wl[i];
                type=Y.Lang.type(wl[i]);
                ...
        }
}

function(){
        return
        {
                ...
        }
}

callFunction(document,"aaaaaaaaaaaaaaa","bbbbbbbbbbbbbbbb","cccccccccccccccccccc",
    "bbbbbbbbbbbbbbbbbbb");//超出首字母c的2个层级

var result = "aaaaaaaaaaaaaaaa" + "bbbbbbbbbbbbbbbb" + "ccccccccccccccccccc" +
                         "ddddddddddddddddddddddddd";

if(wl && wl.length){

        for(var i=0; i

                p = wl[i];
                type=Y.Lang.type(wl[i]);

                if(a){
                        ...
                }
        }
}

var myName;
var anotherName;

// 以下OK
var count = 10;
var myName = "Ni";
var found = true;

var getCount = 10;
var isFound = true;

var getName  = function(){
        return myName;
};

var MAX_COUNT = 10；
var URL = "http://www.guokr.com";

function Person( name ){
        this.name = name;
}

var person = null;
function getPerson(){
    if( condition ){
        return new Person("ABC");
    }else{
        return null;
    }
}

var person;
typeof person; //  undefined
typeof foo;   // undefined

// 好的注释方法
if( condition ){

    // 解释下一行代码
    func();
}

// 不好的注释方法
if( condition ){
    // 解释下一行代码
    func();
}

if( condition ){
    // 解释下一行代码
    func();
}

/*
 * 这里是注释
 * 这里是注释
 * 这里是注释
 */

// 好的写法
if( contidion ){
        foo();
}

if( conidion ){
        foo();
        foo();
}

// 不好的写法
if( contidion ){ foo(); }
if( contidion )  foo();

if( conidion ){
        foo();
        foo();
}

if( conidion )
{
        foo();
        foo();
}

switch (condition) {
        case "a":
                //代码
                break；

        case "b":
                //代码
                break;

        default :
                // 代码
}

switch (condition) {
case "a":
        //代码
        break；
case "b":
        //代码
        break;
default :
        // 代码
}

switch (condition) {
        case "a":
        case "b":
                //代码
                break;

        default :
                // 代码
}

switch (condition) {
        case "a":
        case "b":
                //代码
                break;

     //没有 default :
}

document.open();
document.write();// 这边代码无法显示在编辑器下 插入一个canvas标签 
document.close();

var canvas = document.getElementById("canvas");
var cantxt = canvas.getContext("2d");

cantxt.rect(50,50,40,80);
cantxt.fillStyle = "#0F0"; 
cantxt.fill();

cantxt .moveTo(50,50); // 移动到坐标 50 50 
cantxt.lineTo(150,150); // 划出轨迹到 150 150
cantxt.stroke(); // 以线条显示轨迹

// 突然会发现，颜色方面有点错误，线条的黑色会影响到矩形的绿色。所以需要使用 打开路径 关闭路径的方法隔断路径间的联系。

cantxt.beginPath(); 
cantxt.rect(50,50,50,100);
cantxt.fillStyle = "#0F0"; 
cantxt.fill();
cantxt.closePath();

cantxt.beginPath(); 
cantxt .moveTo(50,50); // 移动到坐标 50 50 
cantxt.lineTo(150,150); // 划出轨迹到 150 150
cantxt.stroke(); // 以线条显示轨迹
cantxt.closePath();

cantxt.beginPath();
cantxt.moveTo(50,50); 
cantxt.arcTo(100,100,200,50,50);
cantxt.stroke(); 
cantxt.closePath();

cantxt.fillText("abcde",100,300);

cantxt.strokeRect( 50,50,100,100 );
cantxt.clearRect( 50,50,100,100 ); // 发现还会留下一圈边框
cantxt.clearRect( 49,49,102,102 );

cantxt.translate(200,200);
cantxt.rotate(1);
cantxt.moveTo(0,0);
cantxt.lineTo(100,100); 
cantxt.stroke();

```
var Events = Backbone.Events = {
// 对一个事件绑定回调函数. 传递 "all" 则将绑定回调在所有事件触发时调用
on: function(name, callback, context) {
  // API 检测 
  if (!eventsApi(this, 'on', name, [callback, context]) || !callback) return this;
  //相当于 this._events = this._events || {} 下面语法更容易用来赋值 如下下句
  //在绑定时间的对象中 建立事件池 来进行事件管理
  this._events || (this._events = {}); 
  // name 事件在事件池中的形式（数组形式） 存放当前对象绑定在name的所有事件
  var events = this._events[name] || (this._events[name] = []);
  // 将当前需要绑定的事件 push到事件池中的具体事件名称中
  events.push({callback: callback, context: context, ctx: context || this});
  return this;
},
off: function(){},
once: function(){},
trigger: function(){},
stopListening: function(){}
}

其实以上方法和 Jquery 的实现类似，只不过更为简单，Jquery 中还对当前需要绑定事件的对象如果为 DOM 元素的话需要进一步处理来保证 IE 中内存遇到的问题。

// 解绑一个或者多个回调.
// 如果 `context` 是 null, 移除所有有该函数的回调.
// 如果 `callback` 是 null, 移除该事件下的所有回调. 
// 如果 `name` 是 null, 移除所有帮定的回调函数
off: function(name, callback, context) {
    var retain, ev, events, names, i, l, j, k;
    if (!this._events || !eventsApi(this, 'off', name, [callback, context])) return this;

    // obj.off() 移除所有事件
    if (!name && !callback && !context) {
        this._events = {};
        return this;
    }

    // 使用 underscore 的 获取对象键值方法
    names = name ? [name] : _.keys(this._events);
    for (i = 0, l = names.length; i < l; i++) {
        name = names[i];
        // 移除某一事件下的回调
        if (events = this._events[name]) {
            this._events[name] = retain = [];
            if (callback || context) {
                for (j = 0, k = events.length; j < k; j++) {
                    ev = events[j];
                    if ((callback && callback !== ev.callback && callback !== ev.callback._callback) ||
                            (context && context !== ev.context)) {
                        // 不是所需要删除的事件 则重新扔回 事件池中的对应名称中
                        retain.push(ev);
                    }
                }
            }
            //如果对应的名称中没有事件，那么删除事件池对象的该属性
            if (!retain.length) delete this._events[name];
        }
    }
    return this;
}

事件移除，简单地说因为事件绑定是使用了 事件池 的方法处理，那么对于移除事件只需要在事件池中 delete 掉响应的事件即可，唯一需要做的是兼容参数个数不同情况下的移除事件情况。

// 触发一个或多个事件, 触发所有绑定的回调.
// 除了事件名称，回调函数会被传递'trigger'相同的参数。 
// (如果你监听了 'all', 会让你的回调函数将事件名称作为第一个参数).
// obj.trigger("change",function(){});
// obj.trigger("all",function(eventName){ alert(eventName) });
trigger: function(name) {
    if (!this._events) return this;
    var args = slice.call(arguments, 1);
    if (!eventsApi(this, 'trigger', name, args)) return this;
    var events = this._events[name];
    //别忘了任何事件触发都要调用 all 中的事件
    var allEvents = this._events.all;
    if (events) triggerEvents(events, args);
    if (allEvents) triggerEvents(allEvents, arguments);
    return this;
},

// 使这个对象或者所有监听特定事件的对象停止监听该特定的事件
stopListening: function(obj, name, callback) {
    var listeners = this._listeners;
    if (!listeners) return this;
    var deleteListener = !name && !callback;
    if (typeof name === 'object') callback = this;
    if (obj) (listeners = {})[obj._listenerId] = obj;
    for (var id in listeners) {
        listeners[id].off(name, callback, this);
        if (deleteListener) delete this._listeners[id];
    }
    return this;
}

触发与停止监听。

// 分割事件字符串.
var eventSplitter = /s+/;
// 实现多样式化的事件功能的API 
//比如现有API中的多名称的change blur和jquery风格的事件映射 {change: action}
var eventsApi = function(obj, action, name, rest) {
    if (!name) return true;
    // 处理事件映射
    if (typeof name === 'object') {
        for (var key in name) {
            obj[action].apply(obj, [key, name[key]].concat(rest));
        }
        return false;
    }
    // 处理空间分割的事件名称.
    if (eventSplitter.test(name)) {
        var names = name.split(eventSplitter);
        for (var i = 0, l = names.length; i < l; i++) {
            obj[action].apply(obj, [names[i]].concat(rest));
        }
        return false;
    }
    return true;
};
// A difficult-to-believe, 在触发事件时优化内部调用. 尽可能快速到达最有可能的情况
// (核心的3个 Backbone 事件参数).
var triggerEvents = function(events, args) {
    var ev, i = -1, l = events.length, a1 = args[0], a2 = args[1], a3 = args[2];
    switch (args.length) {
        case 0: while (++i < l) (ev = events[i]).callback.call(ev.ctx); return;
        case 1: while (++i < l) (ev = events[i]).callback.call(ev.ctx, a1); return;
        case 2: while (++i < l) (ev = events[i]).callback.call(ev.ctx, a1, a2); return;
        case 3: while (++i < l) (ev = events[i]).callback.call(ev.ctx, a1, a2, a3); return;
        default: while (++i < l) (ev = events[i]).callback.apply(ev.ctx, args);
    }
};
var listenMethods = {listenTo: 'on', listenToOnce: 'once'};
// 使用listenTo 和 listenToOnce反转 on and once 控制. 将 *this* 对象监听另外一个对象中的事件
// 保持对监听的跟踪
_.each(listenMethods, function(implementation, method) {
    Events[method] = function(obj, name, callback) {
        var listeners = this._listeners || (this._listeners = {});
        var id = obj._listenerId || (obj._listenerId = _.uniqueId('l'));
        listeners[id] = obj;
        if (typeof name === 'object') callback = this;
        obj[implementation](name, callback, this);
        return this;
    };
});
// 向后兼容的名称.
Events.bind = Events.on;
Events.unbind = Events.off;

使用的实例为

var object = {};
_.extend(object, Backbone.Events);
object.bind("alert", function(msg) {
    alert("Triggered " + msg);
});
object.trigger("alert", "www.csser.com");


object.unbind("change", onChange); // 只移除onChange回调函数
object.unbind("change"); // 移除所有 "change" 回调函数
object.unbind();

`backbone.sync` _backbone.sync( method, model, [option] )_

*   method - CRUD 方法 ("create", "read", "update", 或 "delete")
*   model - 要被保存的模型（或要被读取的集合）
*   options - 成功和失败的回调函数，以及所有 jQuery 请求支持的选项

是对于模型在服务器中读取和保存的函数,都为 json 格式进行数据传输。默认情况下是依赖于 jQuery或者Zepto 的 Ajax 方法进行的发送 RESTful json 请求。（关于 REST Representational State Transfer 表现层状态转化 可见阮一峰老师的 理解RESTful架构）。额~反正本人不是很了解。

// Backbone.sync 同步
// -------------
// 重载这个方法来改变 Backbone 持久模型在服务器中的方式、
// 通过请求类型和问题中的模型
// 默认情况发送 RESTful Ajax 请求到模型中的`url()`.
// 一些可行的自定义为:
//
// * 使用 `setTimeout` 在一个请求中批量的触发更新.
// * 发送 XML 而不是 JSON.
// * 坚持模型通过 WebSockets 而不是 Ajax.
//
// 开启 `Backbone.emulateHTTP` 为像 `POST` 一样发送 `PUT` 和 `DELETE` 请求
// `_method` 参数中包含真正的 HTTP 方法,
// 以及主体的所有请求 as `application/x-www-form-urlencoded`
// 替换为 `application/json`参数名为 `model`的模块.
// 当接口为服务器端语言，如**PHP**时很有用， 使得主体的'PUT'请求难以读取
Backbone.sync = function(method, model, options) {
    var type = methodMap[method];

    // 默认设置, 除非指定.
    _.defaults(options || (options = {}), {
        emulateHTTP: Backbone.emulateHTTP,
        emulateJSON: Backbone.emulateJSON
    });

    // 默认 JSON-request 设置.
    var params = {type: type, dataType: 'json'};

    // 确保有一个 URL.
    if (!options.url) {
        params.url = _.result(model, 'url') || urlError();
    }

    // 确保我们有正确的请求数据.
    if (options.data == null && model && (method === 'create' || method === 'update' || method === 'patch')) {
        params.contentType = 'application/json';
        params.data = JSON.stringify(options.attrs || model.toJSON(options));
    }

    // 对于老的服务器, 模拟JSON以HTML形式的.
    if (options.emulateJSON) {
        params.contentType = 'application/x-www-form-urlencoded';
        params.data = params.data ? {model: params.data} : {};
    }

    // 对于老的服务器, 模拟 HTTP 通过用 `_method` 方法仿造 HTTP 
    // 和一个 `X-HTTP-Method-Override` 头.
    if (options.emulateHTTP && (type === 'PUT' || type === 'DELETE' || type === 'PATCH')) {
        params.type = 'POST';
        if (options.emulateJSON) params.data._method = type;
        var beforeSend = options.beforeSend;
        options.beforeSend = function(xhr) {
            xhr.setRequestHeader('X-HTTP-Method-Override', type);
            if (beforeSend) return beforeSend.apply(this, arguments);
        };
    }

    // 在 non-GET 请求中不传递数据.
    if (params.type !== 'GET' && !options.emulateJSON) {
        params.processData = false;
    }

    // 如果我们发送 `PATCH` 请求, 
    // 我们在一个老版本ActiveX默认启动的情况下，使用XHR来取代jQuery方法。
    // 删除它当IE8支持 `PATCH` 的时候.
    if (params.type === 'PATCH' && window.ActiveXObject &&
                !(window.external && window.external.msActiveXFilteringEnabled)) {
        params.xhr = function() {
            return new ActiveXObject("Microsoft.XMLHTTP");
        };
    }

    //提出请求, 允许用户自定义Ajax选项.
    var xhr = options.xhr = Backbone.ajax(_.extend(params, options));
    model.trigger('request', model, xhr, options);
    return xhr;
};

// 映射 CRUD 到 HTTP 为了默认的 `Backbone.sync` 执行.
var methodMap = {
    'create': 'POST',
    'update': 'PUT',
    'patch': 'PATCH',
    'delete': 'DELETE',
    'read': 'GET'
};

// 通过 `$` 代理来设置 `Backbone.ajax` 的默认执行.
// 如果想要使用另一个库那么重载它.
Backbone.ajax = function() {
    return Backbone.$.ajax.apply(Backbone.$, arguments);
};

console.log(func);
function func(){}
var func;
console.log(func);
func = "abc";
console.log(func);

function show_arguments(a,b,c){
    console.log(a);
    console.log(b);
    console.log(c);

    console.log(arguments[0]);
    console.log(arguments[1]);
    console.log(arguments[2]);

    arguments[0] = 0;
    arguments[1] = 1;
    arguments[2] = 2;

    console.log(a);
    console.log(b);
    console.log(c);
}

show_arguments("a","b")

var name = "I am window";
function show_name(){
    console.log(this.name);
}
var obj_test={
    name:"I am obj_test",
    wait_show:function(){
     setTimeout(show_name,100);
    }
}
show_name();
obj_test.wait_show();

function a(){
    ...//代码
    function b(){
        ...//代码
    }
    b();
}
a();

function a(){
    var num = 0;
    return num++;
}

a();
a();

eval("var x = 10");
new Function("var z = 10");

(function(){
    eval("var y = 10");
    console.log(y);
})();

console.log(x);
console.log(y);
console.log(z);

function Identifier ( FormalParameterListopt ) { FunctionBody }

alert(func);
function func(){
    return "a function";
}

function foo(){
    if(window===parent){
        function bar(){alert(1);}
    }
    else{
        function bar(){alert(2);}
    }
    bar();
}
foo();

function Identifieropt ( FormalParameterListopt ) { FunctionBody }

var func1 = function f(){};
var func2 = function(){};
(function func3(){});
~function func4(){};
!function func5(){};
true,function func6(){};
...

alert(a);
var a = 2;
function a(){}
alert(a)

alert(a);
var a;
function a(){}
alert(a)

alert(a);
var a = 2;
alert(a);

alert(a);
function a(){}
var a = 2;
alert(a)

var f = function(){ return true; };
var g = function(){ return false; };
(function(){
    alert(f());
    if(g() && [] !== []){
        f = function f(){ return false; }
        function g(){ return true; }
    }
})();
alert(f());

var g = function(){ return false; };
(function(){
    alert(g());
    {
        function g(){ return true; }
    }
    alert(g());
})();

```
function test1(){
        var i ={name:’nyf’};
}

function test2(){
        var i ={name:’nyf’};
        return i;
}
var m1 = test1();
var m2 = test2();

一般来说在e.g.1中，当 test1调用时，进入 test1 的环境，那么内存中会开辟存放 {name:’nyf’} 对象的内存，当调用结束后，出了 test1 的环境，那么该内存会被JS引擎中的垃圾回收器自动释放其内存。 在test2中，对象被返回，并且被变量 m2 所指向，所以虽然说在调用完 test2 后出了其环境，但是由于m2仍然持续着对对象的链接关系，所以该对象不会被释放。 但是我们需要注意上述两个例子函数中其实均有2块的内存占用，一个是变量名 i 以及对象 {name:’nyf’} ，i中只是保存着对该对象的地址值。运行test2 未被释放的只是对象，变量名i在2个方法中均被释放，i值才是JS引擎真正需要处理的目标。对于返回的对象，已经返回到上一层的环境，当没有变量再对其进行引用的时候自然也会变会被释放（个人理解）
### 垃圾回收机制的种类
目前JS的垃圾回收机制无非就是两种：1.标记清除（make-and-sweep） 2.引用计数（reference counting）

1.  `标记清除：`标记清除简单的来说就是给各个变量名打上 YES or NO的标签以供JS引擎进行处理（当然打什么标签自己理解即可）。在和执行上下文类似的的环境中当变量名称进入环境的时候，那么变量会被打上 YES。一般来说是绝对不会释放被打上 YES 标签的变量内存的，一旦变量在出了该环境时，变会被打上 NO 标签（和作用域貌似有点像），JS引擎会在一定时间间隔或者设置的时间来进行扫描，对NO标签的进行剔除以释放其内存。

2.  > `引用计数：`（查了很多资料，还是无法找到其真正的计算方式） 一般来说，引用计数的含义是跟踪记录每个值被引用的次数。当声明一个变量并将一个引用类型值赋给该变量时，则这个值的引用次数便是1，如果同一个值又被赋给另一个变量，则该值的引用次数加1，相反，如果包含对这个值引用的变量又取得了另一个值，则这个值的引用次数减1。当这个值的引用次数为0时，说明没有办法访问到它了，因而可以将其占用的内存空间回收。（感觉是有问题的）

> 对于引用计数，我们需要知道如果具有循环引用，那么其计数问题就会暴露，导致计数永远不为0而无法释放内存，导致内存泄露，具体事例如下： `e.g.2`

function(){
    var a = {};
    var b = {};
    b.pro = a;
    a.pro=b;
}

如果e.g.2使用引用计数的话就会导致问题，内存无法被释放，导致内存无故消耗占用。
### IE的垃圾回收机制问题
除了一些极老版本的IE，目前市面上的JS引擎基本采用标记清除来除了垃圾回收。但是需要注意的是IE中的DOM由于机制问题，是采用了引用计数的方式，所以会有循环引用的问题，如： `e.g.3`

var ele = document.getElementById(“element”);
var obj = new Object();
ele.obj = obj;
obj.ele = ele;

function foo(){
    var x = 0;
    return function(){
        alert(x++);
    }  
}
var retFunc = foo();
//foo内部返回一个function 可以随意访问foo的内部变量 x 
retFunc (); // 0
retFunc (); // 1
var x = 0;
retFunc (); // 2

var x = 0;
function foo(){
    alert(x);
}
(function(){
    var x = 1;
    foo();
})();// 弹出 0

var data =  [];
    for(var i =0;i<3;i++){
        data[i] = function(){
        alert(i);
    }
}

var data =  [];
for(var i =0;i<3;i++){
    data[i] = (function(x){
        return function(){
            alert(x);// 此处便有所不同
            alert(i); // 此处仍是3
        }
    })(i);
}

// Load a single JavaScript file and execute a callback when it finishes.
LazyLoad.js("http://example.com/foo.js", function () {
    alert("foo.js has been loaded");
});

// Load multiple JS files and execute a callback when they've all finished.
LazyLoad.js(["foo.js", "bar.js", "baz.js"], function () {
    alert("all files have been loaded");
});

// Load a CSS file and pass an argument to the callback function.
LazyLoad.css("foo.css", function (arg) {
    alert(arg);
}, "foo.css has been loaded");

// Load a CSS file and execute the callback in a different scope.
LazyLoad.css("foo.css", function () {
    alert(this.foo); // displays "bar"
}, null, {foo: "bar"});

Copyright (c) 2011 Ryan Grove <ryan@wonko.com>
*/

LazyLoad = (function (doc) {
    // -- 私有变量 ------------------------------------------------------
    // 用户代理和功能测试信息
    var env,
    // 指向元素 用来延迟填充.
    head,
    // 任何目前在进行的请求
    pending = {},
    // 使用次数来判断样式表是否已经加载 数值太高可能停滞。
    pollCount = 0,
    // 请求队列
    queue = {css: [], js: []},
    // 指向 文档的样式表列表
    styleSheets = doc.styleSheets;

    // -- 私有方法 --------------------------------------------------------
    /**
    创建并返回一个制定名和属性的 HTML 元素
    @method createNode
    @param {String} name element name
    @param {Object} attrs name/value mapping of element attributes
    @return {HTMLElement}
    @private
    */
    function createNode(name, attrs) {
        var node = doc.createElement(name), attr;
        for (attr in attrs) {
            if (attrs.hasOwnProperty(attr)) {
                node.setAttribute(attr, attrs[attr]);
            }
        }
        return node;
    }

    /**
    当当前指定类型的资源完成加载时调用。执行回调并加载下一个队列中的资源（如果有）
    @method finish
    @param {String} type resource type ('css' or 'js')
    @private
    */
    function finish(type) {
        var p = pending[type],
                callback,
                urls;
      // 判断是否有当前类型的资源加载
        if (p) {
            callback = p.callback;
            urls     = p.urls;

            urls.shift();
            pollCount = 0;

          // 如果为最后一个待加载的URL 执行回调并且开始下一个队列中的请求（如果有）
            if (!urls.length) {
                callback &amp;&amp; callback.call(p.context, p.obj);// 若有回调 以panding[type]中属性来执行
                pending[type] = null;
                queue[type].length &amp;&amp; load(type);// 队列中如还有当前类型的资源 加载该类型资源
            }
        }
    }

    /**
    当前代码 the <code>env</code> 环境变量和用户代理和功能测试信息。
    @method getEnv
    @private
    */
    function getEnv() {
        var ua = navigator.userAgent;
        env = {
            // 如果这个浏览器支持禁用异步模式动态创建脚本节点
            // http://wiki.whatwg.org/wiki/Dynamic_Script_Execution_Order
            async: doc.createElement('script').async === true
        };

        (env.webkit = /AppleWebKit\//.test(ua))
            || (env.ie = /MSIE/.test(ua))
            || (env.opera = /Opera/.test(ua))
            || (env.gecko = /Gecko\//.test(ua))
            || (env.unknown = true);
    }

    /**
    加载指定的资源，或者在队列中如果没有指定的资源加载下一个指定类型资源。
    如果一个指定类型资源已经被加载,新的请求将被排队,直到第一个请求完成。
    当数组指定的资源urls,这些url将被载入并行如果它可行,同时保留执行顺序。所有
    浏览器支持并行加载CSS,但只有Firefox和Opera支持并行加载的脚本。在其他浏览器,脚本将
    排队并且在一个时间片段加载一次,以确保正确的执行顺序。
    @method load
    @param {String} type 资源类型 ('css' or 'js')
    @param {String|Array} urls (可选) 需加载的URL或者URLs数组
    @param {Function} callback (可选) 当资源加载完毕后
    @param {Object} obj (可选) 传递给回调函数的对象参数
    @param {Object} context (可选) 如果提供, 回调函数将被执行在这个对象的上下文参数中
    @private
    */
    function load(type, urls, callback, obj, context) {
        var _finish = function () { finish(type); },
                isCSS   = type === 'css',
                nodes   = [],
                i, len, node, p, pendingUrls, url;
        env || getEnv();

        if (urls) { // 有urls参数
            // 当 urls 为 string 类型，处理为单元素数组  
        // urls.concat()为复制数组（深度复制）使处理其不影响方法调用时的参数（对象在参数传递时是传址传递） 
            urls = typeof urls === 'string' ? [urls] : urls.concat();

        // 为每个URL创建一个请求对象，如果指定为多个url，则当所有url加载完毕后执行回调
            //
            // 可惜,Firefox和Opera浏览器是唯一能够并行加载并且同时保留执行顺序的浏览器。
            // 在其他浏览器 脚本必须被逐一加载来保证顺序
            //
            // 所有浏览器对于 CSS 样式表的话 并行加载无先后顺序影响 都是简单的下载
            if (isCSS || env.async || env.gecko || env.opera) {
                // 并行加载 当为CSS样式表 异步加载 Firefox和Opera 时 直接扔进队列中并行加载。
                queue[type].push({
                    urls    : urls,
                    callback: callback,
                    obj     : obj,
                    context : context
                });
            } else {
                // 否则 逐一加载保证顺序。
                for (i = 0, len = urls.length; i &lt; len; ++i) {
                    queue[type].push({
                        urls    : [urls[i]],
                        callback: i === len - 1 ? callback : null, // 只在最后一个时放入回调函数
                        obj     : obj,
                        context : context
                    });
                }
            }
        }
    // 处理完urls参数进行队列处理

    // 如果之前加载的要求这种类型目前还在进行中,将等待。否则,抓住队列中的下一项。
        if (pending[type] || !(p = pending[type] = queue[type].shift())) {
            return;
        }

        head || (head = doc.head || doc.getElementsByTagName('head')[0]);
        pendingUrls = p.urls;

    //  循环建立请求
        for (i = 0, len = pendingUrls.length; i &lt; len; ++i) {
            url = pendingUrls[i];

            // 火狐下不支持link节点的onload事件 以创建 style 标签 @import 引用来实现调用回调
            if (isCSS) {
                    node = env.gecko ? createNode('style') : createNode('link', {
                        href: url,
                        rel : 'stylesheet'
                    });
            } else {
                node = createNode('script', {src: url});
                node.async = false;// 设为同步加载 保证顺序
            }

            node.className = 'lazyload';
            node.setAttribute('charset', 'utf-8');

            if (env.ie &amp;&amp; !isCSS) {// IE的 script 加载完毕触发回调条件
                node.onreadystatechange = function () {
                    if (/loaded|complete/.test(node.readyState)) {
                        node.onreadystatechange = null;
                        _finish();
                    }
                };
            } else if (isCSS &amp;&amp; (env.gecko || env.webkit)) {
        // Gecko和WebKit不支持link节点的onload事件。
                if (env.webkit) {
                    // 在WebKit,我们可以轮询修改文档。样式表找出当样式表已经加载。
                    p.urls[i] = node.href; // 解决相对url(或轮询不会工作)
                    pollWebKit();
                } else {
            // 在Gecko,我们可以导入请求的URL到
<style>节点和轮询node.sheet.cssRules的存在。
                    node.innerHTML = '@import "' + url + '";';
                    pollGecko(node);
                }
            } else {
                node.onload = node.onerror = _finish;
            }

            nodes.push(node);
        }

        for (i = 0, len = nodes.length; i < len; ++i) {
            head.appendChild(nodes[i]);
        }
    }

    /**
    当样式表在Gecko中加载的时候 开始轮询来判断是否完成加载。在所有样式表完成加载 或者10S之后停止轮询防止无限循环
    在此使用基于@import的跨域技术,和一个同域的实现 
    http://www.zachleat.com/web/2010/07/29/load-css-dynamically/
    @method pollGecko
    @param {HTMLElement} node Style node to poll.
    @private
    */
    function pollGecko(node) {
        var hasRules;

        try {
            // 无需存储或者在此引用该值 但是如果不引用 编辑器就认为是无用的并且移除它。
            hasRules = !!node.sheet.cssRules;
        } catch (ex) {
            // 一个例外意味着样式表仍然是在加载。
            pollCount += 1;

            if (pollCount < 200) { // 循环次数限制 共10s
                setTimeout(function () { pollGecko(node); }, 50);
            } else {
                // 轮询10秒后,还是没有结果发生。那么停止轮询和完成未决请求进一步判断 避免阻塞请求。
                hasRules && finish('css');
            }

            return;
        }

    // 如果执行到此,则样式表加载。
        finish('css');
    }

    /**
    在WebKit中 开始轮询来判断当等待样式表已经完成加载，在所有样式表完成加载 或者10S之后停止轮询防止无限循环
    @method pollWebKit
    @private
    */
    function pollWebKit() {
        var css = pending.css, i;
        if (css) {
            i = styleSheets.length;
          // 匹配styleSheet中的href 来判断是否加载完毕
            while (--i >= 0) {
                if (styleSheets[i].href === css.urls[0]) {
                    finish('css');
                    break;
                }
            }

            pollCount += 1;

            if (css) {
                if (pollCount < 200) {
                    setTimeout(pollWebKit, 50);
                } else {
                    // 轮询10秒,但是什么也没有发生,这可能表明,样式表中已删除文件之前就有机会负载。停止轮询和完成等待请求以防止阻塞进一步的请求。
                    finish('css');
                }
            }
        }
    }

    return {

        /**
    模块模式来暴露接口

    请求指定CSS URL或URLs，当他们完成加载执行指定的回调函数(如果有的话)。
    如果指定的是一个一个数组的urls,样式表将被并行加载在和所有的样式表加载完毕后执行回调。

        @method css
        @param {String|Array} urls 需要加载的单个或者数组形式的url
        @param {Function} callback (可选)加载完毕所需要执行的回调函数
        @param {Object} obj (可选) 回调函数需要传递的参数
        @param {Object} context (可选) 提供回调函数的执行上下文
        @static
        */
        css: function (urls, callback, obj, context) {
            load('css', urls, callback, obj, context);
        },

        /**
    请求指定的JavaScriptURL或URLs并当他们完成加载执行指定的回调函数(如果有的话)。
    如果是指定一个url的数组和当浏览器支持,脚本将被并行载入，当完成所有的脚本加载后执行回调。

    目前,只有Firefox和Opera支持并行加载脚本并且保存执行顺序。
    在其他浏览器,脚本将排队和逐一加载一次,以确保正确的执行顺序。

        @method js
        @param {String|Array} urls 需要加载的单个或者数组形式的url
        @param {Function} callback (可选) callback 加载完毕所需要执行的回调函数
        @param {Object} obj (可选) 回调函数需要传递的参数
        @param {Object} context (可选) 提供回调函数的执行上下文
        @static
        */
        js: function (urls, callback, obj, context) {
            load('js', urls, callback, obj, context);
        }

    };
})(this.document);

function foo(){
    //... 执行代码
    setTimeout(foo,2000);
}
foo();

function test(){
        var flog = +new Date();
        while(true){
                if(+new Date() - flog > 3000){
                        console.log("after");
                        console.log((+new Date()/1000).toFixed(0) + "s");
                        break;
                }
        }
}
function foo(){
            test();
            setTimeout(foo,2000);
}
foo();

after 
1354024132s 
after 
1354024137s 
after 
1354024142s

function test(){
        var flog = +new Date();
        while(true){
                if(+new Date() - flog > 3000){
                        console.log("after");
                        console.log((+new Date()/1000).toFixed(0) + "s");
                        break;
                }
        }
}
setInterval(test,2000);

after 
1354024417s 
after 
1354024420s 
after 
1354024423s