《javascript设计模式》学习笔记一:创建javascript对象的三种方式

来源:互联网 发布:超市收银软件牌子 编辑:程序博客网 时间:2024/06/01 10:49

《javascript设计模式》学习笔记一:创建javascript对象的三种方式

前 天刚入手《javascript设计模式》这本书,猛读了一下,颇有感悟,对javascript面向对象的写法有了进一步的了解,也解答了以前困惑良久的问题,萌发了写笔记的想法,想把这本书的精华分享给想要了解javascript设计模式的朋友们。

一、三种创建对象的方式

书上有个例子:启动和停止一个动画,一般面向过程的写法如下:

function startAnimation(){

}

function stopAnimation(){

}

现在把它改写成一个对象

第一种方式:

var Anim = function(){

};

Anim.prototype.start = function(){

};

Anim.prototype.stop = function(){

};

//实例化对象

var myAnim = new Anim();

myAnim.start();

myAnim.stop();

第二种方式:(偶使用的就是这种方式)

var Anim = function(){

};

Anim.prototype = {

    start : function(){

    },

    stop : function(){

    }

};

第三种方式:

Function.prototype.method = function(name,fn){

        this.prototype[name] = fn;

}

var Anim = function(){

};

Anim.method('start',function(){

});

Anim.method('stop',function(){

});

关于prototype原型的解释,我最早接触的是《javascript高级程序设计》里面的说法,但个人觉得还是太简单了,不是很好理解,百度百科里面找到了关于原型的说明,附上网址:

baike.baidu.com/view/1217697.htm

现在来看看三种方式的优缺点:

第一种方式:将二个方法赋予该类的prototype属性(之所以将类的方法放在prototype属性,是为了避免重复创建函数,要使用prototype属性,必须实例化类),但写法上有点繁琐,而且不是很符合一般类的书写习惯,于是就有了第二种方式的改进版。

第二种方式:强烈推荐这种方式,代码简练,清晰,如果有使用过JQ的话,应该会注意到JQ插件的写法就是这种方式。

第三种方式:我还没有使用过,不敢妄下定论,有兴趣的朋友可以用用看看。(这种方式的优势在于链式调用)。

原创粉丝点击