proto

以前要访问原型, 必须使用构造函数来实现. 无法直接使用实例对象来访问原型.

火狐最早引入属性 __proto__ 表示使用实例对象引用原型. 但是早期是非标准的.

通过该属性可以允许使用实例对象直接访问原型

	function Person() {}
// 神秘对象就是 Person.prototype
// 那么只有使用 构造函数 才可以访问它
var o = new Person();
// 以前不能直接使用 o 来访问神秘对象
// 现在有了 __proto__ 后
// o.__proto__ 也可以直接访问神秘对象( 两个下划线 )
// 那么 o.__proto__ === Person.prototype
  1. 神秘对象中默认都有一个属性 constructor, 翻译为 构造器. 表示该原型是与什么构造函数练习起来的.
  2. __proto__ 有什么用?
    • 可以访问原型
    • 由于在开发中除非特殊要求, 不要使用实例去修改原型的成员. 因此属性开发时使用较少
    • 但是再调试过程中非常方便, 可以轻易的访问原型进行查看成员
  3. 如果在 早期的浏览器中使用 实例需要访问原型如何处理?
    • 可以使用实例对象访问 构造器, 然后使用构造器访问原型
	var o = new Person();
o.constructor.prototype
  1. 如果给实例继承自原型的属性赋值
	function Foo() {}
Foo.prototype.name = 'test';
var o1 = new Foo();
var o2 = new Foo();
o1.name = '张三'; // 不是修改原型中的 name 而是自己增加了一个 name 属性
console.log( o1.name + ', ' + o2.name );

继承

  1. 最简单的继承就是 将别的对象的属性强加到 我的 身上, 那么我就有这个成员了.
  2. 利用原型也可以实现继承, 不需要在我的身上添加任何成员, 只要原型有了, 我就有了.

结论:

将属性, 方法等成员利用 混入的办法, 加到构造函数的原型上, 那么构造函数的实例就都具有该方法了.

混合式继承复杂描述

  1. new DivTag() 用来 创建 div 对象
  2. appendTo 加到某元素上
  3. 扩展
    • img
    • p
    • span
    • a
    • ...
  4. 无论方法怎么写, 方法是谁调用的, this 就是谁

细节

使用点语法给原型添加成员与使用直接替换修改原型对象有什么区别?

  1. 原型指向发生了变化
  2. 构造函数所创建的对象所继承的原型不同
  3. 新增的对象默认是没有 constructor 属性

注意: 在使用替换的方式修改原型的时候, 一般都会添加 constructor 属性.

	function Person() {}
Person.prototype = {
constructor: Person
}; // 拆解
function Person() {}
var o = {};
o.costructor = Person; // 属性中就存储着函数的地址 Person.prototype = o; Person = 123;

静态成员与实例成员的概念

也是从 面向对象的 变成语言中引入的

  1. 静态成员表示的是 静态方法和 静态属性的概念. 所谓的静态, 就是由构造函数所提供的.
  2. 实例成员表示的是 实例方法 和 实例属性. 所谓的实例就是由构造函数所创建的对象.

一般工具型方法都有静态成员提供, 一般与实例对象有关的方法由实例成员表示.

__proto__的更多相关文章

  1. 谈谈__proto__和prototype的区别

    我想javascript中的原型链一直想很多初学javascript的同学感到非常的困惑,今天看了一些文章,结合自己的理解,把原型链这个东西从新来整理一下,如有不对之处,望大家帮忙指出. 首先,我们应 ...

  2. prototype 和__proto__

    //Animal构造函数 function Animal(name){ this.name = name; } //Animal原型对象 Animal.prototype = { id:"A ...

  3. Javascript原型继承 __proto__

    Javascript继承是通过原型链继承的 原型链是依赖__proto__而不是prototype var animal = function(){}; var dog = function(){}; ...

  4. js中的prototype和__proto__

    var Person = function(name){ this.name = name; this.say = function(){ return "I am " + thi ...

  5. Prototypes in Javascript 收集.__proto__

    It’s important to understand that a function’s prototype property has nothing to do with it’s actual ...

  6. 面试中常用的__proto__,prototype和原型链,你都了解了吗?

    上一篇随笔主要讲了变量提升的问题,今天我们来讲讲很多前端er在初期很长一段时间内都没有完全搞明白的原型链和构造函数. 1,什么是构造函数 那么要讲到构造函数,必须要有一个函数,所以我们建立一个函数 f ...

  7. javascript中对象在OOP方面的一些知识(主要是prototype和__proto__相关)

    在ES6的Class到来之前,先总结下个人对js中prototype属性的理解. 1.构造函数(大写函数名  this 无return)   2.原型对象(函数.prototype)  3.实例对象( ...

  8. 理解js中__proto__和prototype的区别和关系

    首先,要明确几个点:1.在JS里,万物皆对象.方法(Function)是对象,方法的原型(Function.prototype)是对象.因此,它们都会具有对象共有的特点.即:对象具有属性__proto ...

  9. Object.create() 和 __proto__ 的关系

    经测试得出 Ojbect.create() 也就是通过修改 __proto__ 实现的. 例: var Super = { say: function() {console.log('say')} } ...

  10. 关于 JavaScript prototype __proto__ 一点总结

    http://www.cnblogs.com/wbin91/p/5265163.html 先上代码 function(y) Foo{ this.y = y;} Foo.prototype.x = 10 ...

随机推荐

  1. ASP.NET 如何发现问题的方法

    1.打开IntelliTrace,查看遇到的问题: 2.打开IE8以上,按F12,启动js调试,查看遇到的错误:

  2. Ubuntu下PHP的扩展

    Ubuntu版本:14.04 1. 下载php-5.5.10.tar.bz2,并解压. 2.  终端进入解压后的目录php-5.5.10,运行configure.(输入命令./configure) 3 ...

  3. Fire!(BFS)

    Fire! Time Limit:1000MS     Memory Limit:0KB     64bit IO Format:%lld & %llu Submit Status Descr ...

  4. 【原创】试用十天被Pass所带来的启示

    试用十天被Pass所带来的启示   招聘是门学问,很多人在研究,也有很多方案,不过面对人员难聘问题,很多方法又不灵了.于是我们采用了降低标准方案,扩招进来一些人员,于是问题又来了,想不想听我亲身经历的 ...

  5. Sql Server 系统表功能

    SELECT Name FROM Master..SysDatabases ORDER BY Name

  6. Android 2.1 和 Android 4.4 工程目录超详细对比及详解

    在搭建Android开发环境及简单地建立一个HelloWorld项目后,本篇将通过HelloWorld项目来介绍Android项目的目录结构.本文的主要主题如下: 1.1.HelloWorld项目的目 ...

  7. [转载]AxureRP 7.0部件详解(一)

    本文为Axure RT7.0教程,本章主要介绍menu菜单.table表格.Tree Widget 树部件三个部件,后续将持续更新...... Menu 菜单 常用案例 网站导航菜单部件通常用于母板之 ...

  8. 15套帮助你展示 App 设计的透视屏幕原型素材

    Dribbble 和 Behance 是最好两个展示你的设计作品的地方.现在流行使用透视屏幕来展示应用程序设计效果,尤其是在 Dribbble 上面,有众多高品质的免费资源和设计素材. 这篇文章汇集了 ...

  9. UWP开发入门(十一)——Attached Property的简单应用

    UWP中的Attached Property即附加属性,在实际开发中是很常见的,比如Grid.Row: <Grid Background="{ThemeResource Applica ...

  10. Sql Server来龙去脉系列之二 框架和配置

    本节主要讲维持数据的元数据,以及数据库框架结构.内存管理.系统配置等.这些技术点在我们使用数据库时很少接触到,但如果要深入学习Sql Server这一章节也是不得不看.本人能力有限不能把所有核心的知识 ...