javascript创建对象的方法--构造函数模式

时间：2023-03-10 02:01:39
javascript创建对象的方法--构造函数模式

javascript创建对象的方法--构造函数模式

一、总结

构造函数模式作用和不足

1、作用：解决工厂模式不是用new关键字来创建对象的弊端

2、作用：解决工厂模式创建的实例和模型没有内在联系的问题

3、不足：无法解决工厂模式不同实例对应于不同内存的问题（内存浪费），这个用原型模式可以解决

二、javascript创建对象的方法--构造函数模式（需仔细看）

构造函数模式

  1. new 调用的函数为构造函数，构造函数和普通函数区别仅仅在于是否使用了new来调用。
  2. 所谓“构造函数”，就是专门用来生成“对象”的函数。它提供模板，作为对象的基本结构。
  3. 构造函数内部使用了this变量。对构造函数使用new运算符，就能生成实例，并且this变量会绑定在实例对象上。
  4. instanceof 验证原型对象与实例对象之间的关系。
  5. 使用call和apply方法实现对象的冒充
  6. 问题：浪费内存--使用构造函数每生成一个实例，都增加一个重复的内容，多占用一些内存。这样既不环保，也缺乏效率。

三、代码

代码一：

 <!DOCTYPE html>

 <html lang="zh-cn">

 <head>

   <meta charset="utf-8">

   <title>课堂演示</title>

 </head>

 <body>

   <script>

   //基本模式

       var people1=new Object();

       people1.name='孙悟空';

       people1.weapon='金箍棒';

       people1.run=function(){

         return this.name+'的武器是'+this.weapon

       }

      // alert(people1.name)

       //alert(people1.run()) //注意方法的调用需要加()

      //该方法如果创建多个对象就会比较繁琐，如下......

       var people2=new Object();

       people2.name='猪八戒';

       people2.weapon='钉耙';

       people2.run=function(){

         return this.name+'的武器是'+this.weapon

       }

 //工厂模式

       function creatPeople(name,weapon){

         var people=new Object() //可以类比为加工对象的原材料

         people.name=name;

         people.weapon=weapon;

         people.run=function(){

            return this.name+'的武器是'+this.weapon

         }  //以上步骤可以类比为加工对象的过程

         return people //注意一定要讲创建的对象返回

         //可以类比为产品加工完毕出厂的工作

       }

        var wukong=creatPeople('孙悟空','金箍棒');

        var bajian=creatPeople('猪八戒','钉耙');

       //alert(wukong.run)

       //alert(bajian.run)

       //alert(wukong.run==bajian.run)//两个对象实例的地址是不同的，说明两个对象会占用两个地址空间的内存

 //new 关键字

      function fun(){

       alert(this)

     }

     //fun()

     //new fun() //如果有new 函数里的this就是新创建出来的对象，如果没有就是Window

 //构造函数模式

 //注意：构造函数不需要使用 return语句返回对象，它的返回是自动完成的

       function People(name,weapon){

         this.name=name;
this.weapon=weapon;

         this.run=function(){

            return this.name+'的武器是'+this.weapon

         }

       }

       var wujing=new People('沙悟净','禅杖');

       alert(wujing.run())

   </script>

 </body>

 </html>

1、原型模式（内存浪费）：原型模式的不同实例分配到不同的内存

2、this用法：普通函数，如果有new 函数里的this就是新创建出来的对象，如果没有就是Window

3、js构造函数自动返回：js的构造函数不需要返回，自动返回

4、this用法：用了this关键字，因为用了new之后this指向对象

5、var 变量名接收一切：js中新创建出来的对象还是用 var 变量名 的方式接收，和变量的方式一样

6、js构造模式和其它一样：js的构造模式和java、c++等一样

代码二：

 <!DOCTYPE html>

 <html lang="zh-cn">

 <head>

   <meta charset="utf-8">

   <title>课堂演示</title>

 </head>

 <body>

   <script>

 //构造函数模式

 //注意：构造函数不需要使用 return语句返回对象，它的返回是自动完成的

       function People(name,weapon){

         this.name=name;

         this.weapon=weapon;

         this.run=function(){

            return this.name+'的武器是'+this.weapon

         }

       }

       var wujing=new People('沙悟净','禅杖');

       var wukong=new People('孙悟空','金箍棒');

       var bajian=new People('猪八戒','钉耙');

       //alert(wujing.run())

       //alert(wujing instanceof People)

       var monster=new Object();

       //People.call(monster,'妖怪','葫芦')

       People.apply(monster,['妖怪','葫芦'])

       // alert(monster.run())

       // alert(monster.name)

       var monster1=new People('小妖','长矛')

       var monster2=new People('小妖','长矛')

       alert(monster1.run()+'\n'+monster2.run())

       alert(monster1.run==monster2.run)//两个对象实例的地址是不同的，说明两个对象会占用两个地址空间的内存 

   </script>

 </body>

 </html>

1、判断实例：instanceof来判断实例，看这个of就知道实例在前，模型在后

2、call和apply用法：call方法和apply方法实现对象的模仿，用法是要 被模仿的东西.apply 的形式

3、构造模式内存浪费：构造器模式创建的对象分配的地址是不同的

相关文章