夯实JavaScript基础之prototype, __proto_

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.prototypep instanceof Person  // true
p instanceof Person2  // true

p可以是多个构造函数的实例。

试验之后的结论是：

instanceof 与constructor属性无必然关系，只要对象的隐藏属性__proto__指向任何构造器的prototype属性，那么对象都会是该构造器的实例；对象也可以是多个构造器的实例。

修改：

结论改为：

instanceof 与constructor属性无必然关系，只要对象的隐藏属性__proto__，或者对象的__proto__的__proto__，或者对象的__proto__的__proto__的__proto__..........指向任何构造器的prototype属性，那么对象都会是该构造器的实例；对象也可以是多个构造器的实例。

转载于:https://www.cnblogs.com/molinglan/p/8473214.html

夯实JavaScript基础之prototype, proto, instanceof相关推荐

面试：JavaScript基础概念
文章目录 1. JS基础概念 JavaScript 常见知识总结重点 1.js的基本数据类型都有哪些 2.判断基本数据类型的方法 typeof instanceof Object.prototype ...
JavaScript基础之基础
JavaScript基础 JavaScript简介一个完整的JavaScript实现应该由以下三个部分构成: ECMAScript 标准 DOM 文档对象模型 BOM 浏览器对象模型 JS也是一种面 ...
VN-SGG JavaScript 基础（中）
[VN-SGG] JavaScript 基础(中) JavaScript视频课程笔记[入门到精通],这只是笔记!!! 主要内容: this,对象,原型对象,垃圾回收,数组: call.apply,ar ...
JavaScript 基础知识点
JavaScript (JS) 是一种编程语言,为通常用于客户端(client-side)的网页动态脚本,不过,也常通过像Node.js这样的包,用于服务器端(server-side). 今天,发一 ...
【JS】1037- 面试前必备的 JavaScript 基础知识梳理总结
1. JavaScript简介 JavaScript 最开始是专门为浏览器设计的一门语言,但是现在也被用于很多其他的环境. 如今,JavaScript 已经成为了与 HTML/CSS 完全集成的,使用 ...
2020-web前端-JavaScript基础笔记
==================================================================================================== ...
前端小白学习路线及知识点汇总（三）-- JavaScript基础
前端小白学习路线及知识点汇总(三)-- JavaScript基础一. JavaScript的组成 ECMAScript:由ECMA国际进行标准化的一门编程语言,往往被称为JavaScript或Jsc ...
前端工程师自检清单（JavaScript基础）
知识体系来源于一名[合格]前端工程师的自检清单 winter在他的<重学前端>课程中提到: 到现在为止,前端工程师已经成为研发体系中的重要岗位之一.可是,与此相对的是,我发现极少或者几乎没 ...
前端面试知识点总结JavaScript基础之原型和原型链（二）
一.JavaScript基础原型和原型链 1.理解原型设计模式以及JavaScript中的原型规则设计模式 1.工厂模式:在函数内建立一个对象,给对象赋予属性及方法再将对象返回设计模式. func ...

夯实JavaScript基础之prototype, proto, instanceof

夯实JavaScript基础之prototype, proto, instanceof相关推荐

最新文章

热门文章

夯实JavaScript基础之prototype, __proto__, instanceof

夯实JavaScript基础之prototype, __proto__, instanceof相关推荐

最新文章

热门文章

夯实JavaScript基础之prototype, proto, instanceof

夯实JavaScript基础之prototype, proto, instanceof相关推荐