leaflet源码阅读

最近想做leaflet的一个小扩展，顺便就阅读了一下leaflet的源码。

1. 总体结构
   首先是一个匿名函数,将window和document作为参数输入到匿名函数内部，另外重新定义undefined，防止被重写

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

1. L的定义
   L相当于Jquery里面的$,这个库定义了三种引入形式。第一，定义了Browserify的引入形式，利用typeof module来检测，第二，typeof define === 'function' && define.amd 来检测amd的存在，第三，普通的windows直接引入的形式，这个时候调用expose函数，如果L以及被定义的话，用oldL来存储这个变量，同时把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定义一些通用功能函数

(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函数就是Util里面的一个，这个函数的功能接受一系列的参数，dest[,src]，然后把src，也就是第二个参数以外的参数都赋值给dest,其实就是一个浅拷贝,create就是一个对于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面向对象的基础，也是Leaflet所有的类，除了简单的类的继承模型，还有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
        //对props也就是NewClass的prototype进行属性的浅拷贝，include和static的区别是，include不会直接替代NewClass原来有的属性
    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;
};