微信扫一扫打赏支持

javascript创建对象的方法--组合模式

javascript创建对象的方法--组合模式

一、总结

0、作用：解决原型模式对象独有属性创建麻烦的问题

1、组合模式使用普遍：jquery就是用的组合模式，组合模式使用非常普遍

2、组合模式优点：a、支持传参  b、 解决内存浪费（共用的函数和属性用原型方式，非共用的的函数和属性用构造函数的方式）

3、组合模式的实现：共用的函数和属性用原型方式，非共用的的函数和属性用构造函数的方式

 

二、javascript创建对象的方法--组合模式

构造函数和原型组合模式

这是目前最为常用的创建对象的方式。

这种概念非常简单，即用构造函数定义对象的所有非函数属性，用原型方式定义对象的函数属性（方法）。结果是，所有函数都只创建一次，而每个对象都具有自己的对象属性实例。

此外，组合模式还支持向构造函数传递参数，可谓是集两家之所长。

在所接触的JS库中，jQuery类型的封装就是使用组合模式来实例的！！！

 

三、代码

 1 <!DOCTYPE html>
 2 <html lang="zh-cn">
 3 <head>
 4   <meta charset="utf-8">
 5   <title>课堂演示</title>
 6 </head>
 7 <body>
 8   <script>
 9   function Monster(){} 
10     Monster.prototype={
11         constructor: Monster, 
12         name:'喽啰', 
13         job:['巡山','打更'],
14         run:function() {return this.name+'的工作是'+this.job }
15     }
16 //构造函数和原型组合模式
17      function Monster(name,arr){//非共用
18         constructor: Monster, 
19         this.name=name
20         this.job=arr
21      } 
22     Monster.prototype={//共用
23       run:function() {return this.name+'的工作是'+this.job }
24     } 
25     var monsterI=new Monster('小旋风',['巡山','打更','砍柴'])
26     var monsterII=new Monster('小钻风',['巡山','打更','挑水'])
27     alert(monsterI.run())
28     alert(monsterII.run())
29   </script>
30 </body>
31 </html>

1、组合模式的实现：共用的函数和属性用原型方式，非共用的的函数和属性用构造函数的方式

2、this关键字：因为传参，所以this关键字

3、原型中可以调用对象的非共用属性：原型中可以调用对象的非共用属性，用this关键字

4、函数的定义和使用还是和之前一样

5、原型方式：对象名.prototype={}

6、构造器方式：constructor: Monster, 

7、对比：注意组合模式和原型模式的对比

 

posted @ 2018-05-05 11:58  范仁义  阅读(736)  评论(0)  编辑  收藏  举报