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. NFC 与 Windows Phone 的那点事儿

    说起NFC这个词儿应该已经不陌生了,在我们的生活中有很多使用场景都是使用的这项技术,例如公交卡,门禁,还有银联的闪付卡等等.并且近些年在移动设备上使用的场景也越来越多,例如 对 NFC TAG 的读写 ...

  2. mysql ODBC connector相关问题

    mysql ODBC connector我安装了,怎么就不成功了 进到命令行,运行下边的:C:\>cd \windows\SysWOW64 C:\Windows\SysWOW64>odbc ...

  3. Java知多少(完结篇)

    Java知多少(1)语言概述 Java知多少(2)虚拟机(JVM)以及跨平台原理 Java知多少(3) 就业方向 Java知多少(4)J2SE.J2EE.J2ME的区别 Java知多少(5) Java ...

  4. 3D全景!这么牛!!

    如果你用过网页版的百度地图,你大概3D全景图浏览是一种怎样的酷炫体验:在一个点可以360度环顾周围的建筑.景色,当然也可以四周移动,就像身临其境. 全景图共分为三种: ①球面全景图 利用一张全景图围成 ...

  5. Sublime Text 安装sftp插件

    1. 先安装Package Control组件,用于管理插件. 按ctrl+`组合键,输入以下内容后按Enter键 sublime text 2 版本: import urllib2,os;pf='P ...

  6. Could not load file or assembly 'System.Core, Version=2.0.5.0 和autofac冲突的问题

    在部署到iis的时候会出现这个状况. 解决:下载安装这个补丁 http://support.microsoft.com/kb/2468871 http://www.microsoft.com/zh-c ...

  7. ruby -- 进阶学习(十)自定义路由中:new, :collection和:member的区别

    学习链接:http://rubyer.me/blog/583/ RESTful风格的路由动词默认有7个(分别为:index, show, create, new, edit, update, dest ...

  8. 斐波那契堆(二)之 C++的实现

    概要 上一章介绍了斐波那契堆的基本概念,并通过C语言实现了斐波那契堆.本章是斐波那契堆的C++实现. 目录1. 斐波那契堆的介绍2. 斐波那契堆的基本操作3. 斐波那契堆的C++实现(完整源码)4.  ...

  9. 使用fat-jar打包多个java工程为可执行文件

    对于一个从C++转向Java的程序员来说,制作java的可执行文件,也算是比较棘手的问题.项目是前几个同事留下来的,几个必备的库文件和制作可执行文件的工具居然都是加密未解封的:不知道是不是因为公司和前 ...

  10. sitemesh学习笔记(3)

    前两篇博客浅谈了一下sitemesh3.0和2.4的区别和简单用法,今天我做了一个结合sturts2的sitemesh构架,由于strusts2只能用sitemesh2.x的版本,与3.0目前还不能兼 ...