JavaScript创建对象的常用方式总结(2)

用对象字面量来创建原型对象的结果相同,只是constructor属性不再指向Person。这是由于这样已经完全重写了默认的prototype对象,因此constructor属性也就变成了新对象的constructor属性,指向Object构造函数但不指向Person函数。此时,instanceof操作符还能返回正确的结果但通过constructor已经无法确定对象的类型了。

var person = new Person(); alert(person instanceof Object);//true alert(person instanceof Person);//true alert(person.constructor == Object);//true alert(person.constructor == Person);//false

如果constuctor的值很重要,可以特意将其设置回适当的值。

function Person () { } Person.prototype = { constructor:Person, name:"Alice", age : "22", showName: function(){ alert(this.name); } };

重写原型对象切断了现有原型与任何之前已经存在的对象实例之间的联系,对象实例引用的仍然是最初的原型。

function Person () { } var person = new Person(); Person.prototype = { constructor:Person, name:"Alice", age : "22", showName: function(){ alert(this.name); } }; person.showName();//报错:person.showName is not a function

4、组合使用构造函数模式和原型模式

原型对象的问题:最大问题是由于共享属性导致的。原型中所有属性是被实例共享的,这对于函数很合适,对那些包含基本值的属性也还说得过去,因为可以通过在实例上添加同名属性,隐藏原型中的对应属性。然而,对于包含引用值的属性来说,问题就比较突出了,修改某个实例的引用类型的属性也会通过原型影响到其它实例的该属性。

创建自定义类型的最常见方法是组合使用构造函数模式和原型模式,构造函数模式用于定义实例属性,原型模式用于定义方法和共享的属性。

function Person(name, age) { this.name = name; this.age = age; this.friends = ["Bruce", "Cindy"]; } Person.prototype = { constructor : Person, showName : function(){ alert(this.name); } }; var person1 = new Person("Alice",23); var person2 = new Person("David",22); person1.friends.push("Vincy");//包含引用值的属性friends alert(person1.friends);//"Bruce", "Cindy","Vincy" alert(person2.friends);//"Bruce","Cindy" alert(person1.friends == person2.friends);//false alert(person1.showName == person2.showName);//true

5、动态原型模式

动态原型模式把所有信息都封装在了构造函数中,而通过在构造函数中初始化原型,又保持了同时使用构造函数和原型的优点。

可以通过检查某个应该存在的方法是否有效,来决定是否需要初始化原型。

如:只在showName()方法不存在的情况下,才会将它添加到原型中,这段代码只会在初次调用构造函数时才会执行。

function Person(name,age) { this.name=name; this.age=age; if(typeof this.showName!="function"){ Person.prototype.showName=function(){ alert(this.name); } } } alert(person1.hasOwnProperty("name"));//true

更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《javascript面向对象入门教程》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:http://www.heiqu.com/cabfbeb374d3ccc1cfbb028ffa58a8f4.html