对JS prototype的理解

1.什么是prototype?

function F() {}
f1 = new F();f2 = new F();

以上的代码,F()是一个构造函数,f1和f2是由这个构造函数产生的对象。

prototype是构造函数的一个属性,它的值就是由这个构造函数构造出来的对象的原型对象。(换句话来说,prototype既是构造函数的属性,也是由这个构造函数构造出来的对象的原型对象)

原型对象的属性和方法都会被“继承”,换句话来说,F.prototype的属性和方法都会被f1和f2“继承”。

2.什么是__proto__?它与prototype有什么区别?

__proto__是某个对象的属性,它指向这个对象的原型对象。从上面的例子分析,f1.__proto__和f2.__proto__就等同于F.prototype。

但是,我们一般不会直接访问__proto__这个属性,而是采用以下的方法去访问:

Object.getPrototypeOf(f1)
Object.getPrototypeOf(f2)

先用一张图总结一下上面的东西吧:

3.原型链

每个对象都有自己的原型对象,那一层层地,就形成了原型链。原型链的最上端,就是Object.prototype(注意这里的Object是一个构造函数啊),它没有原型对象(为null)。原型链后面的对象,能够使用前面的属性和方法(假如没有覆盖掉的话)。因此,有着相同原型对象的两个对象,就可以使用与原型对象相同的方法和属性了,这也是使用prototype的好处了。

4.constructor

prototype对象有一个constructor属性,F.prototype.constructor的值就是F本身。用文字描述,一个函数对象的原型对象的constructor属性指向这个函数本身。

利用这一点,我们可以进行判断一个对象是否由某个构造函数产生的。(利用这个例子来理解constructor属性吧)

function A(){};
var a = new A();
console.log(a.constructor===A) //true

分析一下以上的代码,a原本是没有constructor这个属性的,但是它的原型对象有,所以它“继承”了下来,自己也能使用这个属性。即a.constructor,其实也等于a.__proto__.constructor和A.prototype.constructor,而A.prototype.constructor的值,就是A,因此返回true了。

关于constructor的作用还有很多,这里不详述了。

5.总结

这篇文章只是谈谈我对prototype这东西的理解,供日后回看,因此写得很不详尽。更为详细的分析,包括它的作用,更多的分析,请看下面的网页:

http://www.jb51.net/article/91826.htm

假如不理解prototype和__proto__,下面的网页会更好地帮助理解:

http://blog.csdn.net/ligang2585116/article/details/53522741

原文地址:https://www.cnblogs.com/fengziwei/p/8595300.html

时间: 2024-10-13 17:12:49

对JS prototype的理解的相关文章

js面向对象深入理解

js面向对象深入理解 ECMAScript 有两种开发模式:1.函数式(过程化),2.面向对象(OOP).面向对象的语言有一个标志,那就是类的概念,而通过类可以创建任意多个具有相同属性和方法的对象.但是,ECMAScript 没有类的概念,因此它的对象也与基于类的语言中的对象有所不同. 一.创建对象 创建一个对象,然后给这个对象新建属性和方法. var box = new Object(); //创建一个Object 对象 box.name = 'Lee'; //创建一个name 属性并赋值 b

37.浅谈js原型的理解

浅谈Js原型的理解 一.js中的原型毫无疑问一个难点,学习如果不深入很容易就晕了!    在参考了多方面的资料后,发现解释都太过专业,对于很多还没有接触过面向对象    语言的小白来说,有理解不了里面的专有名词!如果你没学过c++或者Java之类的更接触底层的语言,那就不要太深究,理解会用自然可以了,当接触到更多语言时慢慢的会理解越来越深刻! 下面我就举例分享一下prototype的概念!知道对于初学者知道这些就足够了! 分析一下,上面这个例子!我们可以知道 People的类型是一个对象!按照j

js prototype

prototype 原型. 我们每创建一个函数 都会创建一个 prototype的属性,这个属性指向了这个函数的原型对象. function A(){}  ,A.prototype  ,prototype原型只能运用在对象上,不能运用在对象的实例上 也就是说 A.prototype 是可以的 var a=new A(),  a.prototype 是不可以的. 所有对象的实例共享原型对象.什么意思如下: function A(){} A.prototype.Name="张三"://为原

js深入学习-js prototype constructor属性区别

在很多js 插件中出现这两个属性的频率很高,我自己写插件时,也用到过,知道用,不知道具体的区别,今天研究了下, constructor 返回的是对象(类型的实例)的构造函数,通过prototype 添加的属性和方法不会返回. prototype 返回的是类型的原型,不会饭后构造函数部分. 实例如下: <html> <head> <script type="text/javascript">    var cat=function (name,sex)

JS数据类型的理解(猜测)

Js 数据类型 对于这个主题,首先来看几个问题,如果你对这几个问题很清楚的话,那就请直接跳过吧,不用接着往下看了,如果不清楚,建议你还是看看. 1)如果判断函数?function 和object的联系是什么? 2)typeof 和instanceof 的区别是什么和作用是什么? 3)undefined 和null 有什么区别? 4)js 有哪几种基本的数据类型? 5)Undefined,undefined,’undefined’分别是什么? 6)typeof null  ,null instan

node.js module初步理解,exports与module.exports的区别

在开发一个复杂的应用程序的时候,我们需要把各个功能拆分.封装到不同的文件,在需要的时候引用该文件.没人会写一个几万行代码的文件,这样在可读性.复用性和维护性上都很差,几乎所有的编程语言都有自己的模块组织方式,比如Java中的包.C#中的程序集等,node.js使用模块和包来组织,其机制实现参照了CommonJS标准,虽未完全遵守,但差距不大,使用起来非常简单. 在node.js中模块与文件是一一对应的,也就是说一个node.js文件就是一个模块,文件内容可能是我们封装好的一些JavaScript

JS中对于prototype的理解

JS中的prototype是JS中比较难理解的一个部分 本文基于下面几个知识点: 1 原型法设计模式 在.Net中可以使用clone()来实现原型法 原型法的主要思想是,现在有1个类A,我想要创建一个类B,这个类是以A为原型的,并且能进行扩展.我们称B的原型为A. 2 javascript的方法可以分为三类: a -> 类方法 b -> 对象方法 c -> 原型方法 例子: function People(name){ //对象属性 this.name=name; //对象方法 this

js prototype 理解

简单理解:prototype对象是实现面向对象的一个重要机制.每个函数也是一个对象,它们对应的类就是 function,每个函数对象都具有一个子对象prototype.Prototype 表示了该函数的原型, prototype表示了一个类的属性的集合.当通过new来生成一个类的对象时,prototype对象的属 性就会成为实例化对象的属性. (类似反射出来的一样) ps.(在JS 里面 全都是对象,  类Function是function的顶级超类,function实例化了叫对象,在funct

深入理解js——prototype原型

之前(深入理解js--一切皆是对象)中说道,函数也是一种对象.它也是属性的集合,你也可以对函数进行自定义属性.而JavaScript默认的给了函数一个属性--prototype(原型).每个函数都有一个属性叫做prototype(原型). 这个prototype的属性值是一个对象(属性的集合,再次强调!),默认的只有一个叫做constructor的属性,指向这个函数本身. prototype(原型)既然作为对象即属性的集合,不可能就只弄个constructor来玩玩,肯定可以自定义的增加许多属性