`
icekiller110
  • 浏览: 71476 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

JS的prototype和__proto__

    博客分类:
  • JS
js 
阅读更多
终于弄明白了__proto__ 和 prototype。
阅读此文还有一个前提就是要很明确JS中new Function()的含义,不清楚的可以参考:http://rockyuse.iteye.com/blog/1426510

__proto__是JS内部使用寻找原型链的属性。
prototype是显示修改对象的原型的属性。

这两句很重要,以下我会详细说明,此文章就是为了说明上面的两句话的含义。

var Programmer = function(){};  
Programmer.prototype.WriteCode = function() {
    return "programmer writes code";
};
Programmer.prototype.Salary = 50000;
var p = new Programmer();


我们来看一下p, p是一个引用指向programmer对象。我们给programmer对象的prototype定义了一个属性Salary和一个方法WriteCode();
显然我们直接定义了Programmer.prototype属性和方法。
当我们执行p.Salary的时候,会先从p的this范围内查找,没有找到这时候会沿着原型链向上追溯,可是具体怎么向上的呢,那么就是使用了programmer.__proto__来找到programmer的prototype。我再强调一遍__proto__是JS内部自己用来追溯用的,虽然FF把它的给暴露出来了,但是我们不能依赖于这个,浏览器各自的实现不一样,可见性不一样,甚至变量名称都不一样。

这样我们就很清楚了,我们使用prototype修改我们自定义类的原型的属性和方法。
JS内部使用__proto__来追溯自己的原型。

再来看一个例子:
var Person = function(){};
Person.prototype.ask = function(){
    return "haha............";
}
Person.prototype.Say = function() {
    return "Person say";
}
Person.prototype.Salary = 50000;

var Programmer = function(){};
Programmer.prototype.WriteCode = function() {
    return "programmer writes code";
};
Programmer.prototype.Salary = 500;
Programmer.prototype = new Person();
var p = new Programmer();


执行p.WriteCode(), 会是什么结果? //programmer writes code
NO, 应该是" ... has no method 'WriteCode' "

虽然我们定义了programmer.prototype.WriteCode, 但是在15行我们将programmer.prototype 设置为 Person了。person及它的prototype都没有WriteCode方法,所以“has no method 'WriteCode' ”。

使用这种方式便实现了JS的继承。
第二个例子是一种错误的用法,希望引起大家的注意。
分享到:
评论

相关推荐

    prototype,__proto,constructor

    分析javascript中 prototype __proto__ constructor之间的关系

    js prototype和__proto__的关系是什么

    在JavaScript中,prototype和__proto__是理解对象原型继承机制的关键知识点。下面将详细介绍这两者之间的关系以及它们在JavaScript对象继承中所扮演的角色。 首先,prototype属性是函数所独有的。在JavaScript中,...

    详解帮你彻底搞懂JS中的prototype、__proto__与constructor(图解)

    JavaScript中的`prototype`、`__proto__`和`constructor`是理解JavaScript面向对象编程的关键概念。这篇文章通过图解的方式深入浅出地解析了这三个概念之间的关系。 首先,`__proto__`属性是对象独有的,它指向对象...

    浅谈javascript中的prototype和__proto__的理解

    在工作中有时候会看到prototype和__proto__这两个属性,对这两个属性我一直比较蒙圈,但是我通过查阅相关资料,决定做一下总结加深自己的理解,写得不对的地方还请各位大神指出。 跟__proto__属性相关的两个方法 ...

    prototype与__proto__区别详细介绍

    在JavaScript中,`prototype`和`__proto__`都是与对象继承和原型链紧密相关的概念,但它们在用途和性质上有所不同。以下是这两者的主要区别和详细解释: 1. **prototype(原型)** - `prototype`是函数特有的属性...

    JS原型prototype和__proto__用法实例分析

    JavaScript中的原型(Prototype)机制是实现继承的一种方式,它涉及到两个关键的概念:`prototype`和`__proto__`。这两个属性在JavaScript的对象和函数中扮演着不同的角色。 首先,`prototype`属性主要用于函数对象...

    Javascript中prototype与__proto__的关系详解

    主要给大家介绍了关于Javascript中prototype与__proto__的关系的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧。

    帮你彻底搞懂JS中的prototype、__proto__与constructor(图解)

    JavaScript中的`prototype`、`__proto__`和`constructor`是理解JavaScript面向对象编程的关键概念。这篇文章将通过图解的方式帮助读者深入理解这三个属性的关系。 首先,`__proto__`属性,它存在于每个对象中,表示...

    javascript 中__proto__和prototype详解

    __proto__是内部原型,prototype是构造器原型(构造器其实就是函数) 构造器的原型(prototype)是一个对象 那什么是构造器呢? 要想创建一个对象,首先要有一个对象构造器,就像php里面一样,要想创建一个对象,...

    TsangTszKin#HexoBlog#prototype、__proto__与constructor1

    它的作用就是当访问一个对象的属性时,如果该对象内部不存在这个属性,那么就会去它的__proto__属性所指向的那个对象(可以理解为父对象)里找,如果父对象也不存

    简单解析JavaScript中的__proto__属性

    总的来说,__proto__属性是JavaScript原型继承机制的关键部分,它揭示了对象之间通过原型链接的关系,以及通过这种关系实现属性和方法的查找和继承。理解__proto__有助于深入理解JavaScript的对象模型及其继承机制。

    prototype_oop_javascript_ruby_prototype_

    标题 "prototype_oop_javascript_ruby_prototype_" 暗示了我们将探讨的是关于原型(Prototype)面向对象编程(Object-Oriented Programming, OOP)的概念,主要关注JavaScript和Ruby这两种语言之间的相似性和差异性...

    跟我学习javascript的prototype,getPrototypeOf和__proto__

    一、深入理解prototype, getPrototypeOf和_ proto _ prototype,getPropertyOf和 _ proto _ 是三个用来访问prototype的方法。它们的命名方式很类似因此很容易带来困惑。 它们的使用方式如下: C.prototype: 一般...

    JavaScript中__proto__与prototype的关系深入理解

    在JavaScript中,`__proto__` 和 `prototype` 是两个重要的概念,它们分别涉及对象的内部原型链和构造函数的原型。这篇文章将深入探讨这两者之间的关系。 首先,`__proto__` 属性是一个对象的内部属性,它指向该...

Global site tag (gtag.js) - Google Analytics