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

  

  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. WCF代理是怎么工作的?用代码说话

    1.WCF生成代理的方式 2.WCF代理原理 第一个问题引用 一篇Robin's博文[WCF生成客户端对象方式解析] 讲述了创建客户端服务对象的方法 1.代理构造法 a.开启服务后,添加服务引用 b. ...

  2. congos 日期控件的简单使用

    congos 添加html的标签,然后写上js的代码,这段代码的功能是得到前一天的日期. <input type="button" value="查询" ...

  3. DHCP Relay 简介

    DHCP Relay(DHCPR)DHCP中继 也叫做DHCP中继代理 如果DHCP客户机与DHCP服务器在同一个物理网段,则客户机可以正确地获得动态分配的ip地址.如果不在同一个物理网段,则需要DH ...

  4. 用CALayer实现淡入淡出的切换图片效果

    由于直接更改layer的contents显示的隐式动画切换的时候的动画持续时间没办法控制, 切换效果不尽人意,所以这里配合了CABasicAnimation实现淡入淡出的切换效果, 另外还可以使用组合 ...

  5. zepto源码研究 - zepto.js - 5(dom属性管理)

    index: $.fn = {...... indexOf: emptyArray.indexOf,} index: function(element){ //这里的$(element)[0]是为了将 ...

  6. react-native-router-flux 下部导航

    github url:https://github.com/aksonov/react-native-router-flux API: https://github.com/aksonov/react ...

  7. django 学习 --- 环境搭建

    1 安装django a: pip安装 pip install Django==版本号 b:源码安装 https://www.djangoproject.com/download/ tar -xvzf ...

  8. php代码的一些高效写法

    用单引号代替双引号来包含字符串,这样做会更快一些.因为PHP会在双引号包围的字符串中搜寻变量,单引号则不会,注意:只有echo能这么做,它是一种可以把多个字符串当作参数的“函数”(译注:PHP手册中说 ...

  9. php计算剩余时间的自定义函数

    把两个日期格式的字符串转化成unix时间戳,然后相减获得时间戳差,最后判断剩余时间,生成类似(2小时30分钟20秒前发布)这样的时间格式,代码如下: function gettime($time_s, ...

  10. Flume笔记--source端监听目录,sink端上传到HDFS

    官方文档参数解释:http://flume.apache.org/FlumeUserGuide.html#hdfs-sink 需要注意:文件格式,fileType=DataStream 默认为Sequ ...