慕课：解读zepto

课件，作者自己的项目：wangeditor.github.io.
作者推荐阅读： 深入理解javascript原型和闭包（完结）

1.2诡异的数组

$('span').push是存在这个方法的？
arr.__proto__.addClass = function(){}给数组原型对象添加自定义函数；

1.3原型基础知识

JS三座大山：原型与原型链；上下文环境与作用域；单线程与异步

var fn = function(){ }
console.log(fn.__proto__  === Function.prototype)    //true
console.log(fn.__proto__)    //ƒ () { [native code] }

//Function.prototype和Object.prototype不能修改，Array.prototype则可以。

2.1设计

手动改原型，却改不掉构造函数,因为{}相当于构造函数Obejct().

var arr = [1,2,3];
arr.__proto__ = {
    addClass: function  () {
        console.log('this is addClass');
    },
    concat: Array.prototype.concat,
    push: Array.prototype.push
};

console.log(arr.__proto__.constructor === Object );    //true

arr.__proto__.constructor === $p.__proto__.constructor;这段代码在1.2.0版本是false,在1.1.6版本是true!!!看来Z函数做了修改。

2.2

window.$ === undefined && (window.$ = Zepto)  
 //相当于
if(window.$ === undefined)  window.$ = Zepto

结构如下

var Zepto = (function(){
    var $
    
    // ...省略N行代码...
    
    $ = function(selector, context){
        return zepto.init(selector, context)
    }
    
    // ...省略N行代码...
    
    return $
})()

window.Zepto = Zepto
window.$ === undefined && (window.$ = Zepto)

2.3 zepto.init()

compact()函数删除数组的零值。

2.4 zepto.Z()

dom.__proto__ = $.fn;
zepto.Z.prototype = $.fn;  //zepto.Z()作为构造函数生成对象dom.

数组和函数作为特殊的对象，也可以有属性；

2.5 新式写法

对象数组。