码迷,mamicode.com
首页 > 编程语言 > 详细

Javascript 5种设计风格

时间:2017-06-13 16:57:58      阅读:120      评论:0      收藏:0      [点我收藏+]

标签:cal   声明   animation   ini   creat   java   different   on()   字符串   

1.过程式的程序设计

<script>
/*Start and Stop animations using functions.*/
function startAnimation() {
//....
}
function stopAnimation() {
//....
}
</script>

 

2.创建类对象

<script>
/* Anim class. */
var Anim = function () {
//...
};
Anim.prototype.start = function () {
//...
};
Anim.prototype.stop = function () {
//...
};

/* Usage.*/
var myAnim = new Anim();
myAnim.start();
//...
myAnim.stop();

</script>

 

3.把类封装在一条声明中

<script>

/* Anim class, with a slightly different syntax for declaring methods. */
var Anim = function () {
//...
};
Anim.prototype = {
start: function () {
//...
},
strop: function () {
//...
}
};
</script>

 

4.添加一个方法

<script>
/* Add a method to the Fuction object that can be used to declare methods. */
/* Function.prototype.method 用于为类添加新方法,两个参数。
第一个参数:字符串,表示新方法的名称;
第二个参数:用作新方法的函数
*/
Function.prototype.method = function (name, fn) {
this.prototype[name] = fn;
}

/* Anim class,with methods created using a convenience method.*/
var Anim = function () {
//...
};
Anim.method(‘start‘, function () {
//...
});
Anim.method(‘stop‘, function () {
//...
});
</script>

 

5.链式调用

<script>
/* This version allows the calls to be chained. */
Function.prototype.method = function (name, fn) {
this.prototype[name] = fn;
return this; //返回this,使其可以被链式调用。
};

/* Anim class,with methods created using a convenience method and chaining .*/
var Anim = function () {
//...
};
Anim.
method(‘start‘, function () {
//...
}).
method(‘stop‘, function () {
//... 
});
</script>

 

Javascript 5种设计风格

标签:cal   声明   animation   ini   creat   java   different   on()   字符串   

原文地址:http://www.cnblogs.com/sxhlf/p/7000685.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!