leaflet-core 核心代码学习

Leaflet.core

Class — 继承基类

1. 继承方法

    Child=Parent.extend(props)

2. 继承过程

Class.extend = function (props) {
  //1  定义新构造函数
   	var NewClass = function () {

		// 执行初始化构造函数
		if (this.initialize) {
			this.initialize.apply(this, arguments);
		}

		// 执行初始钩子回掉
		this.callInitHooks();
  };
	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);
		}
  };
  
//  2 原型链继承
   //  保存父类原型链到__super__ 
   NewClass.__super__ = this.prototype  // Parent.prototype
   //  拷贝父类原型链作为子类原型链
   var proto=Object.create(this.prototype)
   // 为子类原型链指定新的构造函数
   proto.constructor = NewClass;
   // 为新构造函数指定类原型链
   NewClass.prototype = proto

// 3 继承属性和方法

   // 继承父类静态属性和方法
	for (var i in this) {
		if (this.hasOwnProperty(i) && i !== 'prototype' && i !== '__super__') {
			NewClass[i] = this[i];
		}
  }

  // 混入新的静态属性
  // NewClass.*=props.statics.*
	if (props.statics) {
		Util.extend(NewClass, props.statics);
		delete props.statics;
	}

  // 混入新的原型链方法
  // NewClass.proto= minx(NewClass.proto + props.includes)
	if (props.includes) {
		checkDeprecatedMixinEvents(props.includes);
		Util.extend.apply(null, [proto].concat(props.includes));
		delete props.includes;
	}
  // 合并新的options
  // props.options=minx(proto.options.props.options)
	if (proto.options) {
		props.options = Util.extend(Util.create(proto.options), props.options);
	}
  // 将给定的属性混合到原型中
  // NewClass.proto=minx(NewClass.proto ,props)
  Util.extend(proto, props);
  
  return NewClass
}

3. LeafLet 继承源码

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();
	};

	var parentProto = NewClass.__super__ = this.prototype;

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

	NewClass.prototype = proto;

	// inherit parent's statics
	for (var i in this) {
		if (this.hasOwnProperty(i) && i !== 'prototype' && i !== '__super__') {
			NewClass[i] = this[i];
		}
	}

	// mix static properties into the class
	if (props.statics) {
		Util.extend(NewClass, props.statics);
		delete props.statics;
	}

	// mix includes into the prototype
	if (props.includes) {
		checkDeprecatedMixinEvents(props.includes);
		Util.extend.apply(null, [proto].concat(props.includes));
		delete props.includes;
	}

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

	// mix given properties into the prototype
	Util.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);
		}
	};

	return NewClass;
};

Events:事件触发基类

1. on / off / once

/**
    @params types Object|string
    //对象方式
    {
        click:function(e){},
        dbclick:function(e){}
    }
    //字符串方式 通过空格分割
    'click dbclick'
*/

// @method on(type: String, fn: Function, context?: Object): this
// @method off (type: String, fn: Function, context?: Object): this
// @method once(type: String, fn: Function, context?: Object): this
// _on: function (type, fn, context) 
// _off: function (type, fn, context) 
	

2. fire 触发事件

// type		事件类型
// data     事件参数对象
// propagate 事件传递
// @method fire(type: String, data?: Object, propagate?: Boolean): this

var event = Util.extend({}, data, {
   type: type,
   target: this,
   sourceTarget: data && data.sourceTarget || this
});

Handler： 地图交互操作基类

// initialize(map)

// @method enable(): this
// this.addHooks()

// @method disable(): this
// this.removeHooks();

// @method enabled(): Boolean

// @function addTo(map: Map, name: String): this
// map.addHandler(name,this)

Util 公共对象

// 扩展属性
// @function extend(dest: Object, src?: Object): Object

// 绑定this
// @function bind(fn: Function, …): Function

// 在给定的时间量内，调用fn不超过一次 （动画防止重复执行影像效率）
//  @function throttle(fn: Function, time: Number, context: Object): Function

// 主要限制经纬度范围到正常范围
// @function wrapNum(num: Number, range: Number[], includeMax?: Boolean): Number

// 覆盖混入新的options参数
// @function setOptions(obj: Object, options: Object): Object

// 执行动画
// @function requestAnimFrame(fn: Function, context?: Object, immediate?: Boolean): Number

// 取消动画
// @function cancelAnimFrame(id: Number): undefined