javascript创建对象的方法--构造函数模式
一、总结
构造函数模式作用和不足
1、作用:解决工厂模式不是用new关键字来创建对象的弊端
2、作用:解决工厂模式创建的实例和模型没有内在联系的问题
3、不足:无法解决工厂模式不同实例对应于不同内存的问题(内存浪费),这个用原型模式可以解决
二、javascript创建对象的方法--构造函数模式(需仔细看)
构造函数模式
- new 调用的函数为构造函数,构造函数和普通函数区别仅仅在于是否使用了new来调用。
- 所谓“构造函数”,就是专门用来生成“对象”的函数。它提供模板,作为对象的基本结构。
- 构造函数内部使用了this变量。对构造函数使用new运算符,就能生成实例,并且this变量会绑定在实例对象上。
- instanceof 验证原型对象与实例对象之间的关系。
- 使用call和apply方法实现对象的冒充
- 问题:浪费内存--使用构造函数每生成一个实例,都增加一个重复的内容,多占用一些内存。这样既不环保,也缺乏效率。
三、代码
代码一:
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 //基本模式 10 var people1=new Object(); 11 people1.name='孙悟空'; 12 people1.weapon='金箍棒'; 13 people1.run=function(){ 14 return this.name+'的武器是'+this.weapon 15 } 16 // alert(people1.name) 17 //alert(people1.run()) //注意方法的调用需要加() 18 //该方法如果创建多个对象就会比较繁琐,如下...... 19 var people2=new Object(); 20 people2.name='猪八戒'; 21 people2.weapon='钉耙'; 22 people2.run=function(){ 23 return this.name+'的武器是'+this.weapon 24 } 25 //工厂模式 26 function creatPeople(name,weapon){ 27 var people=new Object() //可以类比为加工对象的原材料 28 people.name=name; 29 people.weapon=weapon; 30 people.run=function(){ 31 return this.name+'的武器是'+this.weapon 32 } //以上步骤可以类比为加工对象的过程 33 return people //注意一定要讲创建的对象返回 34 //可以类比为产品加工完毕出厂的工作 35 } 36 var wukong=creatPeople('孙悟空','金箍棒'); 37 var bajian=creatPeople('猪八戒','钉耙'); 38 //alert(wukong.run) 39 //alert(bajian.run) 40 //alert(wukong.run==bajian.run)//两个对象实例的地址是不同的,说明两个对象会占用两个地址空间的内存 41 //new 关键字 42 function fun(){ 43 alert(this) 44 } 45 //fun() 46 //new fun() //如果有new 函数里的this就是新创建出来的对象,如果没有就是Window 47 //构造函数模式 48 //注意:构造函数不需要使用 return语句返回对象,它的返回是自动完成的 49 function People(name,weapon){ 50 this.name=name; 51 this.weapon=weapon; 52 this.run=function(){ 53 return this.name+'的武器是'+this.weapon 54 } 55 } 56 var wujing=new People('沙悟净','禅杖'); 57 alert(wujing.run()) 58 </script> 59 </body> 60 </html>
1、原型模式(内存浪费):原型模式的不同实例分配到不同的内存
2、this用法:普通函数,如果有new 函数里的this就是新创建出来的对象,如果没有就是Window
3、js构造函数自动返回:js的构造函数不需要返回,自动返回
4、this用法:用了this关键字,因为用了new之后this指向对象
5、var 变量名接收一切:js中新创建出来的对象还是用 var 变量名 的方式接收,和变量的方式一样
6、js构造模式和其它一样:js的构造模式和java、c++等一样
代码二:
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 //构造函数模式 10 //注意:构造函数不需要使用 return语句返回对象,它的返回是自动完成的 11 function People(name,weapon){ 12 this.name=name; 13 this.weapon=weapon; 14 this.run=function(){ 15 return this.name+'的武器是'+this.weapon 16 } 17 } 18 var wujing=new People('沙悟净','禅杖'); 19 var wukong=new People('孙悟空','金箍棒'); 20 var bajian=new People('猪八戒','钉耙'); 21 //alert(wujing.run()) 22 //alert(wujing instanceof People) 23 var monster=new Object(); 24 //People.call(monster,'妖怪','葫芦') 25 People.apply(monster,['妖怪','葫芦']) 26 // alert(monster.run()) 27 // alert(monster.name) 28 var monster1=new People('小妖','长矛') 29 var monster2=new People('小妖','长矛') 30 alert(monster1.run()+' '+monster2.run()) 31 alert(monster1.run==monster2.run)//两个对象实例的地址是不同的,说明两个对象会占用两个地址空间的内存 32 33 </script> 34 </body> 35 </html>
1、判断实例:instanceof来判断实例,看这个of就知道实例在前,模型在后
2、call和apply用法:call方法和apply方法实现对象的模仿,用法是要 被模仿的东西.apply 的形式
3、构造模式内存浪费:构造器模式创建的对象分配的地址是不同的