最近想做leaflet的一個(gè)小擴(kuò)展，順便就閱讀了一下leaflet的源碼。

1. 總體結(jié)構(gòu)
   首先是一個(gè)匿名函數(shù),將window和document作為參數(shù)輸入到匿名函數(shù)內(nèi)部，另外重新定義undefined，防止被重寫

(function (window, document, undefined) {
}(window, document));

1. L的定義
   L相當(dāng)于Jquery里面的$,這個(gè)庫(kù)定義了三種引入形式。第一，定義了Browserify的引入形式，利用typeof module來(lái)檢測(cè)，第二，typeof define === 'function' && define.amd 來(lái)檢測(cè)amd的存在，第三，普通的windows直接引入的形式，這個(gè)時(shí)候調(diào)用expose函數(shù)，如果L以及被定義的話，用oldL來(lái)存儲(chǔ)這個(gè)變量，同時(shí)把L賦值給window.L

(function (window, document, undefined) {
var L = {
    version: "1.0.1+26cce79"
};
function expose() {
    var oldL = window.L;

    L.noConflict = function () {
        window.L = oldL;
        return this;
    };
    window.L = L;
}
// define Leaflet for Node module pattern loaders, including Browserify
if (typeof module === 'object' && typeof module.exports === 'object') {
    module.exports = L;
// define Leaflet as an AMD module
} else if (typeof define === 'function' && define.amd) {
    define(L);
}
// define Leaflet as a global L variable, saving the original L to restore later if needed
if (typeof window !== 'undefined') {
    expose();
}
}(window, document));

1. L.Util定義一些通用功能函數(shù)

(function (window, document, undefined) {
L.Util = {
    extend: function (dest) {
        var i, j, len, src;
        for (j = 1, len = arguments.length; j < len; j++) {
            src = arguments[j];
            for (i in src) {
                dest[i] = src[i];
            }
        }
        return dest;
    },
create: Object.create || (function () {
        function F() {}
        return function (proto) {
            F.prototype = proto;
            return new F();
        };
    })(),
...
};
}(window, document));

首先介紹extend函數(shù)就是Util里面的一個(gè)，這個(gè)函數(shù)的功能接受一系列的參數(shù)，dest[,src]，然后把src，也就是第二個(gè)參數(shù)以外的參數(shù)都賦值給dest,其實(shí)就是一個(gè)淺拷貝,create就是一個(gè)對(duì)于Object.create的polyfill

1. Class
   Class的文檔

L.Class powers the OOP facilities of Leaflet and is used to create almost all of the Leaflet classes documented here. In addition to implementing a simple classical inheritance model, it introduces several special properties for convenient code organization — options, includes and statics.

Class提供了Leaflet面向?qū)ο蟮幕A(chǔ)，也是Leaflet所有的類，除了簡(jiǎn)單的類的繼承模型，還有options,includes,statics.

// @class Class
// @aka L.Class

// @section
// @uninheritable

// Thanks to John Resig and Dean Edwards for inspiration!

L.Class = function () {};

L.Class.extend = function (props) {

    // @function extend(props: Object): Function
    // [Extends the current class](#class-inheritance) given the properties to be included.
    // Returns a Javascript function that is a class constructor (to be called with `new`).
    var NewClass = function () {

        // call the constructor
        if (this.initialize) {
            this.initialize.apply(this, arguments);
        }

        // call all constructor hooks
        this.callInitHooks();
    };

        //做了繼承的事情，Class()的prototype 是parentProto,   
       // 然后NewClass是Class的子類，它的prototype是proto
    var parentProto = NewClass.__super__ = this.prototype;

    var proto = L.Util.create(parentProto);
    proto.constructor = NewClass;

    NewClass.prototype = proto;
        

    // inherit parent's statics
       //NewClass繼承所有Class的屬性
    for (var i in this) {
        if (this.hasOwnProperty(i) && i !== 'prototype') {
            NewClass[i] = this[i];
        }
    }
        
    // mix static properties into the class
       //用static的屬性替代NewClass里面的屬性
    if (props.statics) {
        L.extend(NewClass, props.statics);
        delete props.statics;
    }

    // mix includes into the prototype
        //對(duì)props也就是NewClass的prototype進(jìn)行屬性的淺拷貝，include和static的區(qū)別是，include不會(huì)直接替代NewClass原來(lái)有的屬性
    if (props.includes) {
        L.Util.extend.apply(null, [proto].concat(props.includes));
        delete props.includes;
    }

    // merge options
    if (proto.options) {
        props.options = L.Util.extend(L.Util.create(proto.options), props.options);
    }

    // mix given properties into the prototype
    L.extend(proto, props);

    proto._initHooks = [];

    // add method for calling all hooks
    proto.callInitHooks = function () {

        if (this._initHooksCalled) { return; }

        if (parentProto.callInitHooks) {
            parentProto.callInitHooks.call(this);
        }

        this._initHooksCalled = true;

        for (var i = 0, len = proto._initHooks.length; i < len; i++) {
            proto._initHooks[i].call(this);
        }
    };
        //基本在proto上面做文章
    return NewClass;
};