AvalonJS 源码分析之三
前面一章已经粗略讲解了前三个模块以及它们的功能,这章我们将继续探索源码,领略作者的代码风采。
模块四: 核心功能
该模块中主要加载一些对avalon进行初始化并全局化的方式,例如: function avalon(el) { return new avalon.init(el) }
global.avalon = avalon
if(typeof window !== 'undefined'){
window.avalon = avalon
}
avalon.init = function (el) {
this[0] = this.element = el
}
avalon.fn = avalon.prototype = avalon.init.prototype
然后看下代码,avalon.shadowCopy,该方法的主要作用是将source的属性覆盖到destination,有点类扩展的味道。再往下,也运用shadowCopy,进行对avalon的扩展,例如:noop,log,warn,error,oneObject等等。
avalon.shadowCopy = function (destination, source) {
for (var property in source) {
destination[property] = source[property]
}
return destination
}
模块五:browser 代码从 375到408行,这段区间,是在为avalon搭建一个浏览器的对像browser,其中包含了window,document,msie等属性,这里就不详细讲解内容了,大家可以看看代码。
模块六:一些存在异议的方法
代码从 415到650行,其实就是一些常见的方式,例如一些isWindow(判断是否window对象),isFunction(判断是否是function),isPlainObject(判断对象是否是原生对象),each(遍历)等常用方法,在这里作者也加入对外来扩展的支持,例如加入avalon.mix,avalon.fn.mix,用于浅拷贝,深拷贝,更jquery.extend相似。先上代码:
avalon.mix = avalon.fn.mix = function () {
var options, name, src, copy, copyIsArray, clone,
target = arguments[0] || {},
i = 1,
length = arguments.length,
deep = false
// 如果第一个参数为布尔,判定是否深拷贝
if (typeof target === 'boolean') {
deep = target
target = arguments[1] || {}
i++
}
//确保接受方为一个复杂的数据类型
if (typeof target !== 'object' && !avalon.isFunction(target)) {
target = {}
}
//如果只有一个参数,那么新成员添加于mix所在的对象上
if (i === length) {
target = this
i--
}
for (; i < length; i++) {
//只处理非空参数
if ((options = arguments[i]) != null) {
for (name in options) {
try {
src = target[name]
copy = options[name] //当options为VBS对象时报错
} catch (e) {
continue
}
// 防止环引用
if (target === copy) {
continue
}
if (deep && copy && (avalon.isPlainObject(copy) || (copyIsArray = Array.isArray(copy)))) {
if (copyIsArray) {
copyIsArray = false
clone = src && Array.isArray(src) ? src : []
} else {
clone = src && avalon.isPlainObject(src) ? src : {}
}
target[name] = avalon.mix(deep, clone, copy)
} else if (copy !== void 0) {
target[name] = copy
}
}
}
}
return target
}
它的主要作用是:将一个或多个“源对象”合并到一个“目标对象”中,并返回目标对象。它主要有三种表现形式:
a、avalon.extend(destination, source1, source2, source3 ....)
b、avalon.extend( source )
c、avalon.extend(boolean, destination, source1, source2, source3 ....)
a方式第一个参数作为“目标对象”,其它参数作为“源对象”。
b方式只有一个参数,这里的这个参数变成了“源对象”,“目标对象”变成了avalon。说白了就是"源对象"的属性,变成avalon函数的静态方法或属性。
c方式的第一个参数是boolean类型的,第二个参数是"目标对象",剩下的参数是“源对象”。当第一个参数的值为true时,表示对象合并时支持“深拷贝”。
这一章就写完,后续会继续加载这一系列分析内容。