六开彩开奖结果2017玽

JavaScript创建对象4种方法详解

时间:2016-03-02 22:10??? 点击:

1、工厂模式

弊端?#22909;?#26377;解决对象的识别问题,即怎么知道一个对象的类型。

这里写图片描述

2、构造函数模式

这里写图片描述

与工厂模式相比:

1、没有显式的创建对象
2、直接将属性和方法赋给了this对象
3、没有return语句

要创建person的?#36947;?#24517;须使用new操作符,以这种方式调用构造函数实际上会经历4个步骤:

1、创建一个新对象
2、将构造函数的作用域赋给新对象
3、执行构造函数中的代码
4、返回新对象

创建自定义的构造函数可以将它的?#36947;?#26631;识为一种特定的类型。

构造函数的缺点:

每个方法?#21152;?#22312;每个?#36947;?#19978;重新创建一遍。person1和person2?#21152;?#19968;个sayName()的方法,但两个方法不是同一个Function?#36947;?#19981;同?#36947;?#19978;的同名函数是不相等的。

创建两个完成同样任务的Function?#36947;?#27809;有必要,而?#19968;?#26377;this对象在,不需要在执?#20889;?#30721;前就把函数绑定在特定对象上,可以像下面这样。

这里写图片描述

把sayName属性设置成全局的sayName函数,这样,由于sayName包含的是一个指向函数的?#21018;耄?#22240;此person1和person2对象就共享了同一个函数。

但是,如果对象需要定义很多方法,那么就要定义很多全局函数,自定义的引用类型也没有封装可言了。为了解决上述问题,引入原型模式。

3、原型模式

理解原型对象

我们创建的每个函数?#21152;?#19968;个prototype属性,这个属性是一个?#21018;耄?#25351;向一个对象,而这个对象的用途是包含可?#26434;?#29305;定类型的所有?#36947;?#20849;享的属性和方法。prototype是通过调用构造函数而创建的?#27465;?#23545;象?#36947;?#30340;对象原型,使用原型对象的好处是可以让所有对象?#36947;?#20849;享它所包含的属性和方法。

这里写图片描述

首先,解析器会问?#36947;齪erson1是否有name属性,如果有,就返回。

如果没有,?#22270;?#32493;去person1的原型中搜索name属性,如果有就返回。

如果没有,再继续向person1的原型的原型中搜索。

这里写图片描述

isPrototypeOf()确定?#36947;?#21644;原型对象之间的关联

console.log(Person.prototype.isPrototypeOf(person1)); //true

Object.getPrototypeOf()返回的是[[prototype]]的值

console.log(Object.getPrototypeOf(person1));
 //Person {name: “Yvette”, age: 26, job: “engineer”} 返回的是Person的原型对象。
 console.log(Object.getPrototypeOf(person1) === Person.prototype)//true
 console.log(Object.getPrototypeOf(person1).name);//”Yvette”

hasOwnProperty()方法可以检测一个属性是存在于?#36947;?#20013;,还是存在于原型中,只有给定属?#28304;?#22312;于?#36947;?#20013;,才会返回true。

console.log(person1.hasOwnProperty(“name”));//false

原型与in操作符

有两种方式使用in操作符:单独使用和在for-in循环中使用。单独使用时,in操作符会在通过对象能?#29615;?#38382;给定属性时返回true,无论该属性在于?#36947;?#20013;还是原型中。

使用for in循环,返回的是所有能够通过对象访问的、可枚举的属性,其中既包括?#36947;?#20013;的属性,也包括存在于原型中的属性。如果?#36947;?#20013;的属?#20113;?#34109;了原型中不可枚举的属性,那么?#19981;?#36820;回。IE9之前的版本实现上有一个Bug,屏蔽不可枚举属性的?#36947;?#23646;性不会在for-in中返回。

这里写图片描述

在IE9之前的吧按本中没有log信息。尽管person?#36947;?#20013;的toString()方法屏蔽了原型中的不可 枚举的toString();

原型简写

这里写图片描述

这导致了person1.constructor不再指向Person,而是指向了Object。如果constructor很重要,则需要特意将其设为?#23454;?#30340;值,如:

这里写图片描述

但是这种方式会导致constructor属性变成可枚举。

如果想设置为不可枚举的(默认不可枚举),可以使用

Object.defineProperty(Person.prototype, “constructor”, {
 enumerable: false,
 value: Person
 });

原型的动态性

由于在原型中查找值的过程是一次搜索,因此我们对原型对象所做的任何修改都能够立?#21019;郵道?#19978;?#20174;?#20986;来。

如果重写整个原型对象,情况就不一样了。调用构造函数时会为?#36947;?#28155;加一个指向最初原型的[[prototype]]?#21018;耄?#32780;?#35328;?#22411;修改为另外一个对象就等于切断了构造函数与最初原型之间的联系。?#36947;?#20013;的?#21018;?#20165;指向原型,而不指向构造函数。

这里写图片描述

person.prototype指向的是原本的原型对象,而不会指向新的原型对象。

原型对象的问题

原型模式最大问题是由其共享的本性所导致的。

对于包含引用类型值的属性来说,问题较为突出

这里写图片描述

本意只想修改person1的friends,但是却导致person2的friends属性值也改变了。因此我们很少单独使用原型模式。

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

创建自定义类型的最常用的方式,就是组合使用构造函数模式与原型模式。构造函数模式用于定义?#36947;?#23646;性,原型模式用于定义方法和共享的属性,这样每个?#36947;加?#33258;己的一份?#36947;?#23646;性的副本,又同时共享着对方法的引用,最大限度的节省了内存。

这里写图片描述

除了以上几种方式以外,另外还有动态原型模式,寄生构造模式和稳妥构造模式,但是鉴于使用频?#24335;系停?#19981;再赘述。

来源:未知//所属分类:技术资料/更新时间:2016-03-02 22:10
顶一下
(0)
0%
踩一下
(0)
0%
上一篇:JavaScript提高性能的几个方法
下一篇:JavaScript隐式类型转换趣解
相关内容
六开彩开奖结果2017玽 快3技巧与规律经验总结 江苏快3开奖结果今天i pk10赛车直播官网平台 三分赛车全天计划发表网 复仇之魂 出装 山东时时导航 黑红梅方棋牌 至尊国际彩票网 快3玩大小单双的诀窍 干螺狮粉赚钱吗