`
修补匠
  • 浏览: 9362 次
  • 性别: Icon_minigender_1
  • 来自: 广西
社区版块
存档分类
最新评论

JavaScript原型对象

阅读更多

      什么是原型对象?

      “我们创建的每个函数都有一个prototype(原型)属性,这个属性是一个指针,指向一个对象,而这个对象的用途是包含可以由特定类型的所有实例共享的属性和方法。”

      --摘自人民邮电出版社出版的Nicholas C.Zakas著的《JavaScript高级程序设计》(第2版)

      上面提到的对象,就是原型对象,它的用途是“包含可以由特定类型的所有实例共享的属性和方法”。那么怎么才能访问到它呢?按照上面的说法,每个函数都有一个prototype 指针,这个指针指向了它的原型对象,所以我们可以通过函数的prototype属性来访问函数的原型对象。

      下面用程序来说明。

function SuperType(){}
 
document.write(SuperType.prototype);//[object Object]
 

      可见函数SuperType的确存在一个prototype属性,其的确是指向了一个对象。但这个对象真是原型对象吗?怎么证明?上面不是说原型对象的用途是“包含可以由特定类型的所有实例共享的属性和方法”,既然如此,那我们就来看这个对象是不是真的有这个功能。

function SuperType(){}
      
 SuperType.prototype.name = 'Sam';//在SuperType.prototype指向的对象上增加了name属性
  	
 //在SuperType.prototype指向的对象上增加了sayName方法
 SuperType.prototype.sayName = function() {
          document.write(this.name);
 };
 SuperType.prototype.setName = function(name) {
          SuperType.prototype.name = name;
 };
  	
 var instance1 = new SuperType();
 var instance2 = new SuperType();
  	
 instance1.sayName();//Sam
 instance2.sayName();//Sam
  	
 instance1.setName('Luce');
     
 instance1.sayName();//Luce
 instance2.sayName();//Luce
 

      当实例instance1调用setName()函数更改了SuperType.prototype.name的值后,instance2.sayName()也会输出Luce,说明SuperType.prototype指向的对象的确是“包含了可以由特定类型(这里是SuperType)的所有实例所共享的属性和方法”,所以由此可以得出结论:

      SuperType.prototype指向的就是SuperType的原型对象,也即是函数的prototype属性指向了函数的原型对象。 

 

 

 

      下面用程序来说明构造函数、实例和原型对象三者之间的关系。 

 

      首先是构造函数与实例之间的关系,实例就是通过调用构造函数创立的:

function SuperType(name){
           this.name = name;
           this.sayName = function(){
                 document.write(this.name);    
          }
 }
  	
 var instance1 = new SuperType("Sam");
 instance1.sayName();//Sam
  	
 var instance2 = new SuperType("Luce");
 instance2.sayName();//Luce
 

      我们在构造函数里面定义了一个name属性和一个sayName()函数,当调用new SuperType()创建实例时,就会调用构造函数SuperType创建实例对象,同时为实例对象增加一个name 属性和一个sayName()方法(也即是把this换成了实例对象(如this.name换成了instance1.name),所以每个实例的name和sayName()方法都是独立的,注意和在原型对象上定义的 区别,在原型对象上定义是共享的)。

     

      构造函数与原型对象的关系。前面已经说过,构造函数中有一个prototype属性,该属性是一个指针,指向了它的原型对象,那原型对象呢?是不是在它里面也存在一个指针,指向构造函数呢?答案是的确如此。原型对象中有一个constructor属性,该属性指向了构造函数:

function SuperType(){}
  	
document.write(SuperType.prototype.constructor);//function SuperType(){}
document.write(SuperType.prototype.constructor == SuperType);//true
 

      打印SuperType.prototype.constructor,输出的是构造函数的定义,而我们知道函数名只是一个引用,其指向函数所在的地址,所以通过SuperType.prototype.constructor和SuperType的比较,返回了true,所以SuperType.prototype.constructor和SuperType一样都指向了SuperType()函数,在这里即是指向了构造函数。

 

      最后是实例与原型对象的关系。前面的例子可以看到(最开始),实例可以访问到在原型对象上定义的属性和方法,那么我们就可以猜测,实例中肯定有一个指针指向了原型对象,的确如此,实例中有一个属性__proto__(IE中没有这个属性,所以不要在IE下测试),该属性指向了原型对象:

function SuperType(){}
  	
 var instance = new SuperType();
 document.write(instance.__proto__ == SuperType.prototype);//true

   

 

      SuperType.prototype指向了SuperType的原型对象,而instance.__proto__和SuperType.prototype比较返回了true,这就说明instance.__proto__也指向了SuperType的原型 对象。

 

     以上即是JavaScript原型对象的相关信息。

 

  • 大小: 3.1 KB
  • 大小: 2.6 KB
分享到:
评论

相关推荐

    Javascript原型对象、this的5钟用法、原型继承、Caller和Callee的使用.docx

    JavaScript中的原型对象、this的五种用法、原型继承以及Caller和Callee的使用是JavaScript编程中的核心概念。首先,让我们深入理解每个概念。 **原型对象(Prototype)** 在JavaScript中,每当定义一个函数,都会...

    JavaScript原型对象、构造函数和实例对象功能与用法详解

    本文实例讲述了JavaScript原型对象、构造函数和实例对象功能与用法。分享给大家供大家参考,具体如下: 大家都知道,javascript中其实并没有类的概念。但是,用构造函数跟原型对象却可以模拟类的实现。在这里,就先...

    JavaScript原型对象原理与应用分析

    JavaScript中的原型对象是实现对象继承和共享属性的关键机制。它基于JavaScript的原型链,使得一个对象可以访问并继承另一个对象的属性和方法。下面将详细解释原型对象的原理、应用及其相关操作。 ### 1. 原型对象...

    图文详解JavaScript的原型对象及原型链

    JavaScript的原型对象和原型链是理解JavaScript继承机制的关键概念。首先,我们来区分两个关键的属性:`prototype`和`__proto__`。 1. `prototype`:主要用于构造函数,它是构造函数的一个属性,用于定义实例对象将...

    Javascript中获取对象的原型对象的方法小结

    在Javascript中,如果我们有一个对象但是又不知道它的构造函数时,如何获取它的原型对象呢? 在Chrome中或是FireFox浏览器中,我们可以直接使用对象的__proto__属性获取它的原型对象。 代码如下: <!– lang: js ...

    javascript Map对象 原型 插件

    javascript Map原型,对象,实现javascript中的Map数据类型功能

    JavaScript原型链

    JavaScript原型链是JavaScript语言中的一个核心特性,它关乎对象之间的继承关系。在JavaScript中,一切皆为对象,而原型链则是实现对象间属性和方法共享的一种机制。理解原型链对于深入学习JavaScript至关重要。 ...

    JavaScript彻底理解JavaScript原型PDF

    彻底理解 JavaScript原型 原型是JavaScript中一个比较难理解的概念,原型相关的属性也比较多,对象有"[[prototype]]"属性,函数对象有"prototype"属性,原型对象有"constructor"属性。 为了弄清原型,以及原型相关的...

    浅析JavaScript实现基于原型对象的“继承”.pdf

    本文将对JavaScript原型继承的方式进行介绍,并结合实例进行分析。 基于类的继承 面向对象编程语言是基于类的语言,以Java为例,Java是基于类的语言。在基于类的语言中,对象是类的实例,并且一个类可以从另一个类...

    第15章 javascript面向对象与原型

    在深入讲解JavaScript面向对象与原型的知识点之前,首先需要了解JavaScript的基础知识。在JavaScript中,面向对象编程(OOP)的概念虽然存在,但是它的实现与传统基于类的语言有所不同。ECMAScript,也就是...

    深入理解javascript原型和闭包

    深入理解javascript原型和闭包(01)——一切都是对象 深入理解javascript原型和闭包(02)——函数和对象的关系

    Javascript面向对象编程.

    2. **原型(Prototype)**:JavaScript中的每个对象都有一个内置的`__proto__`属性,指向其构造函数的原型对象。原型对象可以包含共享的方法和属性,使得实例可以访问。我们也可以通过`prototype`属性来修改构造函数...

    JavaScript 面向对象与原型

    - 可以通过`Object.getPrototypeOf()`或`__proto__`访问原型对象,但`__proto__`在ES6及以后的版本中不推荐使用,推荐使用`Object.getPrototypeOf`。 6. 原型问题: - 每个实例都有自己的属性,但共享方法。这...

    深入理解javascript原型和闭包.pdf

    JavaScript原型和闭包是这门语言中两个比较难以理解且与其他面向对象语言区别较大的概念。理解这两个概念,不仅能让我们更深层次地理解JavaScript,而且有助于我们了解编程语言的设计思路,拓宽我们的视野。 首先,...

    原生JS原型对象练习

    在JavaScript的世界里,原型对象(Prototype)是理解对象继承机制的关键。这个练习旨在帮助学习者深入理解原型链的概念,这是JavaScript实现面向对象编程的核心部分。原生JS,即不依赖于像jQuery这样的库,让我们...

    JAVASCRIPT 面向对象编程精要

    每个对象都有一个原型对象,可以通过`__proto__`属性访问。创建一个对象时,它可以继承另一个对象的属性和方法。 ```javascript function Person(name, age) { this.name = name; this.age = age; } Person....

    JavaScript面向对象编程指南.pdf

    函数、闭包、对象和原型等概念,以代码重用为目的的继承模式;BOM、DOM、浏览器事件、AJAX和JSON;如何实现JavaScript中缺失的面向对象特性,如对象的私有成员与私有方法;如何应用适当的编程模式,发挥JavaScript...

    JavaScript面向对象编程指南

    函数、闭包、对象和原型等概念,以代码重用为目的的继承模式;BOM、DOM、浏览器事件、AJAX和JSON;如何实现JavaScript中缺失的面向对象特性,如对象的私有成员与私有方法;如何应用适当的编程模式,发挥JavaScript...

Global site tag (gtag.js) - Google Analytics