夯实JavaScript基础之prototype, __proto__, instanceof
function New(f){
return function(){
var o = {'__proto__': f.prototype};
f.apply(o, arguments);
return o;
}
}
function Person(name, age){
this.name = name;
this.age = age;
}
var p = New(Person)('xl', 24);
在一段javascript基础学习视频中,老师大胆想象了一下new方法创造实例对象的原理。
其中一个关键点,让对象的__proto__属性指向任何一个构造函数:{'__proto__': f.prototype}
这个我就蛮好奇的,直接这样,然后以下两段都成立了。
p instanceof Person // true
p.constructor === Person // true
以上说明,这个隐藏的属性__proto__的指向一旦建立,那么p实例的constructor就自动指向了Person构造器(此理解是错的)。
2018-05-03:今天继续了解原型链时,发现我这里理解错了。其实p实例没有生成指向Person构造器的constructor属性,因为测试发现p.hasOwnProperty('constructor')结果是false。发现p.constructor有值,并指向Person,是因为p在自己上面找不到constructor时,沿着原型找到了Person原型的constructor属性,所以下图才是对的。
但是我还是好奇为什么。
之前我一直以为instanceof 是否成立还和constructor有关系。
而实际上是,{'__proto__': f.prototype}这个直接的导致了constructor关系(上图绿线)的建立。当我试图把constructor的两个关系重新指向时,
p.constructor = {other: 1};
Person.prototype.constructor = {other: 2}; p instanceof Person // true
p仍然是Person的实例,所以instanceof和constructor无关。而当我试图改变Person的prototype的指向之后,终于变了
Person.prototype = {other: 3} p instanceof Person // false
另外我尝试了一下,在改变Person.prototype指向之前,让其他任何函数的prototype都指向Person.prototype,则
function Person2(){}
Person2.prototype = Person.prototype p instanceof Person // true
p instanceof Person2 // true
p可以是多个构造函数的实例。
试验之后的结论是:
instanceof 与constructor属性无必然关系,只要对象的隐藏属性__proto__指向任何构造器的prototype属性,那么对象都会是该构造器的实例;对象也可以是多个构造器的实例。
修改:
结论改为:
instanceof 与constructor属性无必然关系,只要对象的隐藏属性__proto__,或者对象的__proto__的__proto__,或者对象的__proto__的__proto__的__proto__..........指向任何构造器的prototype属性,那么对象都会是该构造器的实例;对象也可以是多个构造器的实例。
夯实JavaScript基础之prototype, __proto__, instanceof的更多相关文章
- 深入理解JavaScript原型:prototype,__proto__和constructor
JavaScript语言的原型是前端开发者必须掌握的要点之一,但在使用原型时往往只关注了语法,其深层的原理并未理解透彻.本文结合笔者开发工作中遇到的问题详细讲解JavaScript原型的几个关键概念, ...
- JavaScript:Function/Object/prototype/__proto__
console.log(Object.__proto__===Function.prototype); //true console.log(Object.prototype.__proto__); ...
- js prototype __proto__ instanceof constructor
JS中有两个特殊的对象:Object与Function,它们都是构造函数,用于生成对象. Object.prototype是所有对象的祖先,Function.prototype是所有函数的原型,包括构 ...
- 你真的懂JavaScript基础类型吗
夯实Javascript基础. 基本类型有六种: null,undefined,boolean,number,string,symbol. 基本类型的值是保存在栈内存中的简单数据段 基础类型特性 基础 ...
- JavaScript中的prototype和__proto__细致解析
最近在学js,体会了一点点它的灵活性.对于初学者的我,总是被它的灵活感到晕头转向,最近发现了一点东西想与大家分享. JavaScript中的prototype和_proto_: 我们先了解一点js中的 ...
- 15条规则解析JavaScript对象布局(__proto__、prototype、constructor)
大家都说JavaScript的属性多,记不过来,各种结构复杂不易了解.确实JS是一门入门快提高难的语言,但是也有其他办法可以辅助记忆.下面就来讨论一下JS的一大难点-对象布局,究竟设计JS这门语言的人 ...
- javascript--15条规则解析JavaScript对象布局(__proto__、prototype、constructor)
大家都说JavaScript的属性多,记不过来,各种结构复杂不易了解.确实JS是一门入门快提高难的语言,但是也有其他办法可以辅助记忆.下面就来讨论一下JS的一大难点-对象布局,究竟设计JS这门语言的人 ...
- 对于JavaScript对象的prototype和__proto__的理解
一.Object和Function的关系: 刚学JavaScript的时候,看书上说JavaScript中万物皆对象,而javascript中的其他对象都是从Object继承而来,包括内置对象.瞬间觉 ...
- javascript prototype __proto__区别
An Object's __proto__ property references the same object as its internal [[Prototype]] (often refer ...
随机推荐
- vps被封逃逸_v2+cloudflare+websocket+tls+nginx
每逢重大节日,总有那么一大部分vps凉凉,以下为能正经正常使用vps,无奈之举,此法由于多层代理,夜间速度会有影响,白天感受不明显. 由于博客园内容审查,v2_ray 中间的 下划线为分隔符,相关链接 ...
- linux文本处理工具篇
一.常用简单工具 cat [OPTION]... [FILE]... -E:显示行的结束符$ -n:对显示出的每一行进行编号. -A:显示所有控制符 -s:压缩连续空行为一行 more:分页查看文件 ...
- 停止node进程
运行vue-cli项目的时候经常出现端口号占用,npm run dev报错的信息, 此时可通过任务管理器粗暴的杀死node进程,也可以通过cmd检测占用某个端口的程序,进而杀死该进程,步骤如下: 1. ...
- 多线程的设计模式:Future、Master-Worker
一 简介 并行设计模式属于设计优化的一部分,它是对一些常用的多线程结构的总结和抽象.与串行程序相比,并行程序的结构通常更为复杂,因此合理的使用并行模式在多线程开发中更具有意义,在这里主要介绍==Fut ...
- Jmeter实现百分比业务比例
Jmeter实现百分比业务比例 相较于LoadRunner,jmeter在复杂场景方式貌似略有欠缺.前一段时间,想实现一个功能,如有两个采样器a与b,a采样器与b采样器被执行的概率分别为1/4与3 ...
- Office VBA 参考
Office VBA 参考:https://docs.microsoft.com/zh-CN/office/vba/api/overview/
- Python 直接赋值、浅拷贝和深度拷贝区别
Python 直接赋值.浅拷贝和深度拷贝区别 转自https://www.runoob.com/w3cnote/python-understanding-dict-copy-shallow-or-de ...
- SQL SELECT DISTINCT
SQL SELECT DISTINCT(选择不同) 语法 SELECT DISTINCT语法用于仅返回不同的(different)值. 在一张表内,一列通常包含许多重复的值; 有时你只想列出不同的(d ...
- sql 关系模型
我们已经知道,关系数据库是建立在关系模型上的.而关系模型本质上就是若干个存储数据的二维表,可以把它们看作很多Excel表.直线电机厂家 表的每一行称为记录(Record),记录是一个逻辑意义上的数据. ...
- 【LeetCode 3】无重复字符的最长子串
描述 [题解] 尺取法 对于[l..r]这段 如果新加进来的s[r]有和之前的重复. 那么就不用重新开始了. 直接递增左区间. 让这段没有重复数字了再说. *****然后再把s[r]加进去. [代码] ...