经过几天研究查找资料,对原型终于有点理解了,今天就做下总结,不对之处,希望各位能够提出。

  

  1、每一个Javascript对象(null除外)都和另一个对象相关联,“另一个”对象就是我们今天所要总结的原型,每一个对象都从原型继承属性。

  2、所有通过对象直接量创建的对象都具有同一个原型对象,并可以通过Javascript代码Object.prototype获取对原型对象的引用。

  3、通过关键字new和构造函数调用创建的对象的原型就是构造函数的prototype属性的值。

看下图

这幅图是从一个外国网站(mollypages.org)上看到的,具体地址已经忘记了。

可以使用一下代码作为解释:

 function Foo(){};
var f1=new Foo();
var o1=new Object();

按照上图可得出一下等式:

f1._proto_ === Foo.prototype

f1._proto_.constructor === Foo

Foo._proto_ === Function.prototype

Foo.prototype.__proto === Object.prototype

f1.__proto__.__proto__ === Object.prototype

o1._proto_ === Object.prototype

Object._proto === Function.prototype  //  Object instanceof function  ==>true(可以解释为Object是Function的实例)

Function._proto_ === Object.prototype  //  Function instanceof Object ==>true(Function是Object的实例)

在Object中__proto__是Function,prototype是Object。
在Function中__proto__是Function,prototype也是Function。

所以,我们可以有如下结论:
1、Function的__proto__和prototype就是一个,扩展任何一个都是相同的效果。
2、Object的__proto__就是Function.prototype。当我们扩展Object.__proto__时,就相当于扩展了Function.prototype和__proto__,反之亦然。

从实际效果上来说,可以认为__proto__是用来扩展Function的,可以直接调用,不需要new出对象才能用,同时对象是不会通过扩展__proto__的方法或属性的。

Foo.__proto__.test="__proto__ test "; //通过__proto__扩展
alert("Foo:"+Foo.test); //可以访问
 
对于prototype来说,它是针对对象的,也就是Function是无法使用的,只有new出来的才能有效。
Foo.prototype.test="prototype test";
alert("Foo instance:"+f1.test); //可以执行
 
简单来说就是:
  __proto__扩展出来的,只有函数可以直接访问
  prototype扩展出来的,只有对象才能直接访问。
 
 
 

javascript中的原型理解总结的更多相关文章

  1. 理解JavaScript中的原型继承(2)

    两年前在我学习JavaScript的时候我就写过两篇关于原型继承的博客: 理解JavaScript中原型继承 JavaScript中的原型继承 这两篇博客讲的都是原型的使用,其中一篇还有我学习时的错误 ...

  2. 前端知识体系:JavaScript基础-原型和原型链-理解原型设计模式以及 JavaScript中的原型规则

    理解原型设计模式以及 JavaScript中的原型规则(原文地址) 1.原型对象:我们创建的每一个函数(JavaScript中函数也是一个对象)都有一个原型属性 prototype,原型属性实质上是一 ...

  3. 图解JavaScript中的原型链

    转自:http://www.jianshu.com/p/a81692ad5b5d typeof obj 和 obj instanceof Type 在JavaScript中,我们经常用typeof o ...

  4. JavaScript中的原型、原型链、原型模式

    今天,咱来聊聊JavaScript中的原型跟原型链 原型跟原型模式 这一块的知识,主要是设计模式方面的. 首先,我们知道JavaScript是面向对象的.既然是面向对象,那它自然也有相应的类跟对象等概 ...

  5. 深入了解JavaScript中基于原型(prototype)的继承机制

    原型 前言 继承是面向对象编程中相当重要的一个概念,它对帮助代码复用起到了很大的作用. 正文 Brendan Eich在创建JavaScript时,没有选择当时最流行的类继承机制,而是借鉴Self,用 ...

  6. 【转】JavaScript中的原型和继承

    请在此暂时忘记之前学到的面向对象的一切知识.这里只需要考虑赛车的情况.是的,就是赛车. 最近我正在观看 24 Hours of Le Mans ,这是法国流行的一项赛事.最快的车被称为 Le Mans ...

  7. JavaScript中的闭包理解

    原创文章,转载请注明:JavaScript中的闭包理解  By Lucio.Yang 1.JavaScript闭包 在小学期开发项目的时候,用node.js开发了服务器,过程中遇到了node.js的第 ...

  8. javascript中的原型继承

    在Javascript面向对象编程中,原型继承不仅是一个重点也是一个不容易掌握的点.在本文中,我们将对Javascript中的原型继承进行一些探索. 基本形式 我们先来看下面一段代码: <cod ...

  9. javascript中 (function(){})();如何理解?

    javascript中 (function(){})();如何理解? javascript中: (function(){})()是匿名函数,主要利用函数内的变量作用域,避免产生全局变量,影响整体页面环 ...

随机推荐

  1. Ajax跨域请求中的Cookie问题(默认不带cookie等凭证)

    1.原生Ajax请求方式,设置跨域请求附带详细参数 var xhr = new XMLHttpRequest(); xhr.open("POST", "http://xx ...

  2. MeasureSpec学习

    在自定义View和ViewGroup的时候,我们经常会遇到int型的MeasureSpec来表示一个组件的大小,这个变量里面不仅有组件的尺寸大小,还有大小的模式. 这个大小的模式,有点难以理解.在系统 ...

  3. ORA-16014: 日志 1 的序列号 242 未归档, 没有可用的目的地

    SQL> alter database open; *第 1 行出现错误:ORA-16014: 日志 1 的序列号 242 未归档, 没有可用的目的地ORA-00312: 联机日志 1 线程 1 ...

  4. angularjs中的绑定策略“@”,“=”,“&”实例

    <!DOCTYPE html> <html lang="zh-CN" ng-app="app"> <head> <me ...

  5. HashMap工作原理

    hashmap存储的为key-value键值对,get的时间复杂度是O(1),具体实现原理如下: 1. hashmap是基于数组之上,通过一定算法,用空间转换时间 2. hashmap的数据结构为数组 ...

  6. Memcached 分布式缓存系统部署与调试

    Memcache 分布式缓存系统部署与调试 工作机制:通过在内存中开辟一块区域来维持一个大的hash表来加快页面访问速度,和数据库是独立的;目前主要用来缓存数据库的数据;存放在内存的数据通过LRU算法 ...

  7. 《python基础教程》笔记之 条件语句和循环语句

    布尔变量 下面的值会被解释器看做假(false): False None 0 "" () {} [] 其它的一切都被解释为真. >>> TrueTrue>& ...

  8. Lua 仿PHP的strtotime

    由于工作原因,两周前开始研究Lua,因为之前的项目要由php改成Lua实现,而一些php里现成的东西,在Lua里就需要手写,于是就有了下面的代码.写的比较粗糙,权当做个记录吧. --[[ 获取时间戳 ...

  9. Vector3.Dot 与Vector3.Cross

    Vector3.Dot(点积) : 点积的计算方式为:  a·b=|a|·|b|cos<a,b>; 其中<a,b>和<b,a> 夹角不分顺序; 物理学中点积用来计算 ...

  10. 一句话输出网站404页面,REFER及相关排序

    cat www.log|awk '$9~/404/ {print $7"," $11}'|sort|uniq -c|sort -nr > ./www404.csv