我们创建的每一个函数都有一个prototype(原型)属性。这个属性是一个指针,指向一个对象,而这个对象的用途是包括能够由特定类型的全部实例共享的属性和方法。假设依照字面意思来理解,那么prototype就是通过调用构造函数而创建的那个对象实例的原型对象。使用原受对象的优点是能够让全部对象实例共享它所包括的属性和方法。换句话说,不必在构造函数中定义对象实例的信息,而是能够将这些信息直接加入到原型对象中,如以下的样例所看到的。

    function Person(){}
Person.prototype.name = 'mychirs';
Person.prototype.age = 29;
Person.prototype.job = 'Software Engineer';
Person.prototype.sayName = function(){
alert(this.name);
}; var person1 = new Person();
person1.sayName();//'mychirs' var person2 = new Person();
person2.sayName();//'mychirs' alert(person1.sayName == person2.sayName);//true

在此。我们将sayName()方法和全部属性直接加入到了Person的prototype属性中,构造函数变成了空函数。即使如此,也仍然能够通过调用构造函数来创建新对象。并且新对象还会具有同样的属性和方法。但与构造函数模式不同的是,新对象的这些属性和方法是由全部实例共享的。换句话说.personl和person2訪问的都是同一组属性和同一个sayName()函数。要理解原型模式的T作原理,必须先理解ECMAScript巾原型对象的性质。

理解原型对象

不管什么时候,仅仅要创建了一个新函数,就会依据一组特定的规则为该函数创建一个prototype属性。这个属性指向函数的原型对象。在默认情况下,全部原型对象都会自己主动获得一个constructor(构造函数)属性,这个属性包括一个指向prot otype属性所在函数的指针。就拿前面的样例来说。Person.prototype. constructor措向Person。而通过这个构造函数。我们还可继续为原型对象加入其它属性和方法。

创建了自己定义的构造函数之后。其原型对象默认仅仅会取得constructor属性;至于其它方法,则都是从Obj ect继承而来的。当调用构造函数创建一个新实例后。该实例的内部将包括—个指针(内部属性),指向构造函数的原型对象。

ECMA-262第5版中管这个指针叫[[Prototype】]。

尽管在脚本中没有标准的方式訪问【[ Prototype]],但Firefox、Safari和Chrome在每一个对象上都支持一个属性—proto_;而在其它实现中,这个属性对脚本则是全然不可见的。只是。要明白的真正重要的一点就是,这个连接存在于实例与构造函数的原型对象之间,而不是存在于实例与构造函数之间。

曾经面使用Person构造函数和Person.prototype创建实例的代码为例,图6-1展示了各个对象之间的关系。

上图展示rr Person构造函数、Person的原型属性以及Person现有的两个实例之间的关系。在此,Person *prototype指向了原型对象,而Person.prototype.constructor叉指回了Person。原型对象中除了包括cons t,ruct or属性之外,还包括后来加入的其它属性。Person的每一个实例personl和person2都包括一个内部属性。该属性只指向了Person.prot otype;换句话说,它们与构造函数没有直接的关系。此外。要格外注意的是。尽管这两个实例都不包括属性和方法,但我们却能够调用personl.sayName()。这是通过查找对象属性的过程来实现的。

尽管在全部实现中都无法訪问到[[Prototype]:,但能够通过isProcotypeOf()方法来确定对象之间是否存在这样的关系。从本质上讲。假设[[ Prototype]]指向调用isPrototypeOf()方法的对象[Person.prototype).那么这种方法就返回true。例如以下所看到的:

alert(Person.prototype.isPrototypeOf(personl));	//true
alert(Person.prototype.isPrototypeOf(person2)); //true

这里,我们用原型对象的isPrototypeOf()方法測试了personl和person2 0由于它们内部都有一个指向Person.prototype的指针。因此都返回了true。

ECMAScript 5添加了一个新方法。叫Object.getPrototypeOf(),在全部支持的实现中,这种方法返回[[PrototypeJ]]的值。比如:

alert(Object.get PrototypeOf(personl) == Person.prototype);	//true
alert(Object.get PrototypeOf(personl).name ); //'Nicholas'

这里的第一行代码仅仅是确定Object.getPrototypeOf()返回的对象实际就是这个对象的原型。第二行代码取得了原型对象中name属性的值,也就是'Nicholas'。使用Object.getPrototypeOf()能够方便地取得一个对象的原型,而这在利用原型实现继承(本章稍后会讨论)的情况下是很重要的。

支持这种方法的浏览器有IE9+、Firefox 3.5+、Safari 5+、Opera 12+和Chrome。

每当代码读取某个对象的某个属性时,都会运行一次搜索,目标是具有给定名字的属性。搜索首先从对象实例本身開始。

假设在实例中找到了具有给定名字的属性,则返回该属性的值。假设没有找到。则继续搜索指针指向的原型对象,在原型对象中查找具有给定名字的属性。

假设在原型对象中找到了这个属性,则返回该属性的值。也就是说,在我们调用personl. sayName《)的时候,会先后运行两次搜索。

首先,解析器会同:“实例personl有sayName属性吗?”答:“没有。”然后,它继续搜索,再问:“personl的原捌有sayName属性吗?”答:“有。

”于是,它就读取那个保存在原型对象中的函数。当我们调用person2.sayName()时,将会重现同样的搜索过程,得到同样的结果。

而这正是多个对象实例共享原型所保存的属性和方法的基本原理。

理解js的prototype原型对象的更多相关文章

  1. js之prototype 原型对象

    原型对象prototype可以这么理解,是该类的实例对象的模板,每个实例对象都是先复制一份该类的prototype,通过这个可以让类的实例拥有相同的功能   String.prototype.say= ...

  2. 简单理解js的prototype属性

    在进入正文之前,我得先说说我认识js的prototype这个东西的曲折过程. 百度js的prototype的文章,先看看,W3School关于prototype的介绍: 你觉得这概念适合定义js的pr ...

  3. JavaScript OOP(三):prototype原型对象(即构造函数的prototype属性)

    通过构造函数生成的实例化对象,无法共享属性或方法(即每个实例化对象上都有构造函数中的属性和方法):造成了一定的资源浪费 function Obj(name,age){ this.name=name; ...

  4. 理解js中的原型,原型对象,原型链

    目录 理解原型 理解原型对象 实例属性与原型属性的关系 更简单的原型语法 原型的动态性 原型链 理解原型 我们创建的每一个函数都有一个prototype(原型)属性,这个属性是一个指针,指向一个对象, ...

  5. 深入理解js的prototype以及prototype的一些应用

    上一篇讲了js的prototype概念,在这里回顾一下prototype的定义: prototype是函数的一个属性,并且是函数的原型对象.引用它的必然是函数,这个应该记住. 但是,很奇怪,各位看官, ...

  6. 深入理解javascript构造函数和原型对象

    ---恢复内容开始--- 对象,是javascript中非常重要的一个梗,是否能透彻的理解它直接关系到你对整个javascript体系的基础理解,说白了,javascript就是一群对象在搅..(哔! ...

  7. 一句话简单理解javascript中的原型对象

    通过构造函数F创建的对象实例p 这个对象p的原型对象是 构造函数中prototype属性指向的对象s,这个对象p中也有个非标准的__proto__属性指向构造函数prototype属性所指向的对象s, ...

  8. 浅谈JS中的原型对象和原型链

    我们知道原型是一个对象,其他对象可以用它实现属性继承,除了prototype,又有__proto__ 1. prototype和__proto__的区别 prototype是函数才有的属性      ...

  9. 简单理解javascript中的原型对象,实现对之间共享属性和行为

    javascript中提供了构造函数.可以方便的创建对象. 典型的构造函数例如以下: function Person(name, age) { this.name = name; this.age = ...

随机推荐

  1. codeforces 478B Random Teams

    codeforces   478B  Random Teams  解题报告 题目链接:cm.hust.edu.cn/vjudge/contest/view.action?cid=88890#probl ...

  2. STL之map和multimap(关联容器)

    map是一类关联式容器.它的特点是增加和删除节点对迭代器的影响很小,除了那个操作节点,对其他的节点都没有什么影响.自动建立Key - value的对应,对于迭代器来说,可以修改实值,而不能修改key. ...

  3. BZOJ 1202: [HNOI2005]狡猾的商人( 差分约束 )

    好像很多人用并查集写的... 前缀和, 则 sumt - sums-1 = v, 拆成2条 : sumt ≤ sums-1 + v, sums-1 ≤ sumt - v 就是一个差分约束, 建图跑SP ...

  4. Dapper 多数据库优化

    Dapper是近2年异军突起的新ORM工具,它有ado.net般的高性能又有反射映射实体的灵活性,非常适合喜欢原生sql的程序员使用,而且它源码很小,十分轻便.我写本博客的目的不是为了介绍Dapper ...

  5. python中os.walk浏览目录和文件

    #!/usr/bin/env python # 2.py # use UTF-8 # Python 3.3.0 # os.walk()的使用 import os # 枚举dirPath目录下的所有文件 ...

  6. Regex阅读笔记(五)java操作篇

    首先一个demo程序 Java的正则表达式包为java.util.regex,主要是使用其中的Pattern和Matcher. groupCount方法时候都可调用,而大多数方法都必须在匹配尝试成功之 ...

  7. 由Qt4.x项目移植到Qt5.x需要注意的事项

    The Transition from Qt 4.x to Qt 5 The transition from Qt 4.x to Qt 5 is not expected to be signific ...

  8. 【图文】雪佛兰Suburban 美国特工标准座驾_新闻中心_易车网

    [图文]雪佛兰Suburban 美国特工标准座驾_新闻中心_易车网 雪佛兰Suburban 美国特工标准座驾

  9. 解决安装oracle后系统变慢问题

    Oracle数据库是一个很占资源的软件,光一个实例服务所占内存,根据其安装时分配的内存就至少要达到256MB以上,再加上其他附属服务,光内存就要占用物理内存的400M左右,虚拟内存也会有等值或更高的损 ...

  10. linux下的文件权限

    在学习linux中,发现linux系统对文件的权限管理要比windows非常严格. linux下建立新的组:groupadd 组名 linux新建立用户:useradd username 创建用户并分 ...