prototype知识梳理(一)

prototype,在w3cschool中文网上的解释是:prototype 属性使您有能力向对象添加属性和方法。

可以看出,prototype首先是一个属性。js的规定里,每个构造函数都有一个prototype属性,作用就是可以给构造函数添加属性和方法。而最重要的一点就是,在这上面添加的属性和方法都可以被构造函数的实例继承。

简单的例子

function Animal(){}; 
Animal.prototype.eat = function(){
    console.log("吃喝拉撒");
};
var cat = new Animal();
cat.eat(); //输出=>吃喝拉撒
var dog = new Animal();
dog.eat(); //输出=> 吃喝拉撒

这是一个利用prototype实现的面向对象编程里继承的写法。

再来看一个比较多人用的框架里的例子(zepto.js)

zepto.js里有这样一句:

zepto.Z.prototype = Z.prototype = $.fn

从后面简单的部分看起,一个构造函数Z的prototype属性指向$.fn

于是继续从zepto源码里找到

 $.fn = {
    constructor: zepto.Z,
    length: 0,
    //此处省略一堆方法定义,基本就是下面这种格式
    ...method:function(){

    }
}

可以看出$.fn里定义了一堆方法,用jquery的都知道(zepto就是jq的精简版),当我们用$获取dom对象以后,就通过$(xx).xxx()的方式使用一系列jq为我们定义好的方法。其实就是通过这种原型继承的方式继承的那些定义好的方法。

在zepto里,$最后返回的就是构造函数Z的实例,而构造函数Z的prototype又指向$.fn,因此$就能调用到$.fn上的一系列方法。

posted on 2018-04-16 23:15  喵了个咪克斯  阅读(131)  评论(0编辑  收藏  举报

导航