1、原型关系 prototype

显式原型:prototype

隐式原型:__proto__

1. 每个函数function都有一个prototype,即显式原型(属性)
2. 每个实例对象都有一个__proto__,可称为隐式原型(属性)

3. 对象的隐式原型的值为其对应构造函数的显式原型的值

4. 总结:

  * 函数的prototype属性: 在定义函数时自动添加的, 默认值是一个空Object对象

* 对象的__proto__,默认指向其构造函数的prototype

* Object.prototype的__proto__属性指向null。(Object构造函数的原型的隐式原型指向null)

* __proto__虽然可以改写,但性能消耗大、风险高、最重要的是被“已被W3C废弃”(链接),可以用等效替换方法 Object.getPrototypeOf(obj) == obj.__proto__

// Function 与 Object 原型链关系
console.log(Function.prototype.__proto__ == Object.prototype) // true
console.log(Object.prototype.__proto__) // null // 声明的函数
function fun1(){}
console.log(fun1.prototype.__proto__ == Object.prototype) // true
console.log(fun1.prototype.__proto__ == Function.prototype.__proto__) // true var o1 = new fun1()
function fun2(){}
fun2.prototype = o1
console.log(fun2.prototype != fun1.prototype) //true var o2 = new fun2()
console.log(o2.__proto__ == fun2.prototype) // true
// 创建一个对象、空对象 的隐式原型指向 Object的原型
var obj = new Object() // 等效 var obj = {}
console.log(obj.__proto__ == Object.prototype) // true

2、构造关系 constructor

* 对象和函数都有construction属性

* Object的construction属性指向Function,而Function的construction指向自己

* constructor属性并不是实例化的对象的属性,而是其构造函数的原型对象的constructor属性,会通过原型链往上一直找到头

* 可以用来查找原型链的“尽头”(实际创建的构造函数的尽头),constructor也可以重指向

// Function 与 Object 构造constructor 关系
console.log(Object.constructor == Function) // true
console.log(Function.constructor == Function) // true // 通过关键字function 进行函数声明
function fun1(){}
//通过函数声明的函数,constructor指向 Function
console.log(fun1.constructor == Function) var o1 = new fun1()
// 通过构造函数创建的对象,constructor指向它的构造函数
console.log(o1.constructor == fun1) //true function fun2(){}
fun2.prototype = o1
var o2 = new fun2()
// constructor默认不是指向 实例化对象的构造函数
console.log(o2.constructor != fun2) //true
// 是指向其构造函数的原型的constructor,通过原型链向上一直找到头
console.log(o2.constructor == fun1) //true function fun3(){}
fun3.prototype = o2
var o3 = new fun3()
// o3这个孙级对象实例,constructor依然指向祖级原型的constructor
console.log(o3.constructor == fun1) //true
// 所以有时候,会重定向constructor
o3.constructor = fun3
console.log(o3.constructor == fun3)

原型链 | 显示原型、隐式原型 | 构造关系constructor | instanceof的更多相关文章

  1. JS 原型链 prototypt 和隐式原型 _proto_

    prototype(原型) :  对象的一个属性,此属性使您有能力向对象添加属性和方法,当访问对象不存在属性是会自动到 prototype 中找 _proto_(隐式原型): 此对象构造函数(类)的原 ...

  2. 构造函数、原型对象prototype、实例、隐式原型__proto__的理解

    (欢迎一起探讨,如果有什么地方写的不准确或是不正确也欢迎大家指出来~) PS: 内容中的__proto__可能会被markdown语法导致显示为proto. 建议将构造函数中的方法都定义到构造函数的原 ...

  3. JS高阶---显式原型和隐式原型

    前言: 1.函数对象即函数的prototype原型属性指向原型对象,在创建函数时便存在,默认为空Object 2.实例对象的__proto__隐式原型在实例化创建实例时产生,值等于构造函数的显式pro ...

  4. JavaScript 隐式原型(_proto_)与显示原型(prototype)

    作者:苏墨橘链接:https://www.zhihu.com/question/34183746/answer/59043879来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明 ...

  5. 275 原型与原型链:显式原型prototype ,隐式原型__proto__,隐式原型链,原型链_属性问题,给原型对象添加属性/方法

    1.所有函数都有一个特别的属性 prototype : 显式原型属性 [普通构造函数的实例对象没有prototype 属性,构造函数有__proto__属性,原型对象有__proto__属性 ] 2. ...

  6. 深入理解javascript原型和闭包(4)——隐式原型

    注意:本文不是javascript基础教程,如果你没有接触过原型的基本知识,应该先去了解一下,推荐看<javascript高级程序设计(第三版)>第6章:面向对象的程序设计. 上节已经提到 ...

  7. 深入理解js——隐式原型

    每个函数都有一个prototye(原型),而每个对象都有一个_proto_,可成为隐式原型. _proto_是一个隐藏的属性,javascript不希望开发者用到这个属性值,有的低版本浏览器甚至不支持 ...

  8. 【学习笔记】深入理解js原型和闭包(4)——隐式原型

    注意:本文不是javascript基础教程,如果你没有接触过原型的基本知识,应该先去了解一下,推荐看<javascript高级程序设计(第三版)>第6章:面向对象的程序设计. 上节已经提到 ...

  9. 深入理解javascript原型和闭包(4)——隐式原型 (转载)

    深入理解javascript原型和闭包(4)——隐式原型   注意:本文不是javascript基础教程,如果你没有接触过原型的基本知识,应该先去了解一下,推荐看<javascript高级程序设 ...

随机推荐

  1. VSC 创建 Net Core 3.0 版本 WebAPI

    首先确保安装好了VSC(这个算是废话......), 并且为VSC安装了Microsoft提供的C#插件, 以及.Net Core 3.0, 然后就可以开始了 1. 使用VSC打开已经创建好的文件夹( ...

  2. 使用VeeValidate的data-vv-scope指定验证范围

    <div class="login" v-show="activeTab === 1"> <div class="panel-con ...

  3. RESTful 架构风格

    在移动互联网的大潮下,『微服务』的概念也越来越被大家接受并应用于实践,日益增多的web service逐渐统一于RESTful 架构风格,如果开发者对RESTful 架构风格不甚了解,则开发出的所谓R ...

  4. Parallel.ForEach 使用多线遍历循环

    Parallel.ForEach相对于foreach是多线程,并行操作;foreach是单线程品德操作. static void Main(string[] args) { Console.Write ...

  5. 松软科技web课堂:JavaScript 布尔(逻辑)

    JavaScript 布尔(逻辑)代表两个值之一:true 或 false. 布尔值 通常,在编程中,您会需要只能有两个值之一的数据类型,比如 YES / NO ON / OFF TRUE / FAL ...

  6. iviewer插件

    jQuery-iviewer插件的使用 iviewer是一个具有缩放和图像旋转功能的图像查看小部件. 在jQuery官网下载后,有很多文件. 直接把文件夹解压拖到项目里. 然后再html中引入主要的文 ...

  7. JavaScript 标准内置对象Promise使用学习总结

    Javascript标准内置对象Promise使用学习总结   by:授客 QQ:1033553122 1.   基础用法 var condition = true; let p = new Prom ...

  8. Android项目实战之高仿网易云音乐创建项目和配置

    这一节我们来讲解创建项目:说道大家可能就会说了,创建项目还有谁不会啊,还需要讲吗,别急听我慢慢到来,肯定有你不知道的. 使用项目Android Studio创建项目我们这里就不讲解了,主要是讲解如何配 ...

  9. CSS新特性之3D转换

    1. 三维坐标系 x轴:水平向右(右边是正,左边是负) y轴:垂直向下(向下是正,向上是负) z轴:垂直屏幕(向外是正,向里是负) 2. 3D转换 3D转换中最常用的是3D位移和3D旋转.主要知识点如 ...

  10. JS时间戳与时间字符串之间的相互转换

    时间字符串 转 时间戳 /** * 时间字符串 转 时间戳 * @param {String} time_str 时间字符串(格式"2014-07-10 10:21:12") * ...