javascript创建对象的方法--原型模式

一、总结

1、原型模式解决内存浪费的方法（继承）：通过继承，对象继承原型模式下的所有属性，对象不同于其它对象的的属性自己创建或者修改

2、原型的使用（prototype关键字）：定义模型的时候在属性中加上prototype关键字就好，这里对象用的不是this，prototype关键字添加方式用的是点，例如Peopleobj.prototype.name='喽啰';

3、缺点：构造函数没有参数

二、(Prototype)原型模式

Javascript规定，每一个构造函数都有一个prototype属性，指向另一个对象。这个对象的所有属性和方法，都会被构造函数的实例继承。可以把那些不变的属性和方法，直接定义在prototype对象上。

prototype方式定义的方式，函数不会拷贝到每一个实例中，所有的实例共享prototype中的定义，节省了内存。
Prototype模式的验证方法
1. isPrototypeOf()这个方法用来判断，某个proptotype对象和某个实例之间的关系。
2. hasOwnProperty()每个实例对象都有一个hasOwnProperty()方法，用来判断某一个属性到底是本地属性，还是继承自prototype对象的属性。
3. in运算符in运算符可以用来判断，某个实例是否含有某个属性，不管是不是本地属性。in运算符还可以用来遍历某个对象的所有属性。
对象的constructor属性用于返回创建该对象的构造函数.(注：了解即可)
在JavaScript中，每个具有原型的对象都会自动获得constructor属性。
原型方式的问题:
- 构造函数没有参数。使用原型方式，不能通过给构造函数传递参数来初始化属性的值
- 属性指向的是对象，而不是函数时。函数共享不会造成问题，但对象却很少被多个实例共享，如果共享的是对象就会造成问题。

三、代码

2-5

 <!DOCTYPE html>

 <html lang="zh-cn">

 <head>

   <meta charset="utf-8">

   <title>课堂演示</title>

 </head>

 <body>

   <script>

 //原型模式

   function Peopleobj(){}

   Peopleobj.prototype.name='喽啰';

   Peopleobj.prototype.weapon='大刀';

   Peopleobj.prototype.run=function(){

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

   }

     var monster_1=new Peopleobj()

     monster_1.job=[]

     var monster_2=new Peopleobj()

     //alert(monster_1.name+'\n'+monster_1.run())

     //alert(monster_2.name+'\n'+monster_2.run())

     //alert(monster_1.run)

     //alert(monster_2.run)

     //alert(monster_1.run==monster_2.run) //说明他们的引用是同一个地址

     //这时所有实例的方法，其实都是同一个内存地址，指向prototype对象，因此就提高了运行效率。

     //alert(Peopleobj.prototype.isPrototypeOf(monster_1));

     // alert(monster_1.hasOwnProperty("name"));

     // alert(monster_1.hasOwnProperty("job"));//true，是自己独有的属性

     alert("jobb" in monster_1);

   </script>

 </body>

 </html>

1、原型模式的使用：第11行，原型模式的使用时通过在模型中添加prototype关键字

2、原型模式模型函数创建：第13行，函数汇总的函数还是采用的这种匿名函数的方式

3、原型模式对象创建自己独有属性：第17行，原型模式对象创建自己独有的属性

4、原型模式解决内存浪费：第23行，原型模式的对象用的是同一个地址

5、isPrototypeOf方法：第25行，原型模式的方法isPrototypeOf来判断proptotype对象和某个实例之间的关系，原型和实例的位置好像和常见的不同

6、hasOwnProperty方法：第26，27行，用hasOwnProperty来判断是否是对象独有属性

7、in方法：第28行，in方法，不明白去看上面的属性方法介绍

2-6

 <!DOCTYPE html>

 <html lang="zh-cn">

 <head>

   <meta charset="utf-8">

   <title>课堂演示</title>

 </head>

 <body>

   <script>

 //原型模式

   function Peopleobj(){}

   Peopleobj.prototype.name='喽啰';

   Peopleobj.prototype.weapon='大刀';

   Peopleobj.prototype.run=function(){

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

   }

   var monster_1=new Peopleobj()

   var monster_2=new Peopleobj()

   //alert(monster_1.constructor)

 //这种写法和前面的方式在使用上基本相同，注意是基本

   function Monster(){}

   Monster.prototype={

       constructor: Monster, //此外强制指回Monster

       name:'喽啰', //原型字面量方式会将对象的constructor变为Object，

       weapon:'大刀',

       job:['巡山','打更'],

       run:function() {return this.name+'的工作是'+this.job }

   }

     var monsterA=new Monster()

     monsterA.job.push('砍柴')

     var monsterB=new Monster()

     monsterB.job.push('挑水')

     alert(monsterA.job)

     alert(monsterB.job)

     //alert(monsterA.constructor)

   </script>

 </body>

 </html>

1、原型模式的省略prototype写法：第11行，每一个属性或者方法都有prototype，所以很烦，所以有了21到27行的另一种写法

2、另外用匿名函数的写法：第26行，另外一种匿名函数的写法，函数名:function(){}

巴特西

javascript创建对象的方法--原型模式

javascript创建对象的方法--原型模式

一、总结

二、(Prototype)原型模式

三、代码

最新文章

热门文章