JS原型解析

adam1q84 发布于2019-08-23 18:34 / 2537人阅读

摘要：它通过给对象添加原型关系即给某个对象添加属性实现一个关联。里面的原型关系真的很复杂也很绕，如果只是很枯燥的讲述各种关系，真的很难记住，在这里希望通过代码和思维导图组合的形式，对的原型进行一次深度的剖析和理解。

概述

JS中原型是为了实现代码重用的一种仿类机制，不过它跟类又完全不同。它通过给对象添加原型关系（即给某个对象添加__proto__属性）实现一个关联。把共有的方法和属性放到这个关联上即实现了JS的继承。简单来说就是一种委托机制。

JS里面的原型关系真的很复杂也很绕，如果只是很枯燥的讲述各种关系，真的很难记住，在这里希望通过代码和思维导图组合的形式，对JS的原型进行一次深度的剖析和理解。

代码分析

首先，我们给出下面的一组关系代码

function Test() {}

var t1 = new Test()
var t2 = {}
var t3 = new Number(1)

t1.__proto__ === Test.prototype
Test.__proto__ === Function.prototype
Test.prototype.__proto__ === Object.prototype
t2.__proto__ === Object.prototype
Number.__proto__ === Function. prototype
Math.__proto__ === Object.prototype 
t3.__proto__ === Number.prototype
Number.prototype.__proto__=== Object.prototype

导图理解

下图是根据上述关系绘制的思维导图，方便大家理解。

总结

引擎会创建两个对象Object.prototype和Function.prototype

用__proto__将Function.prototype和Object.prototype关联

非函数对象可以通过__proto__找到Object.prototype

函数对象通过__proto__找到Function.prototype

函数的 prototype 是一个对象，该对象的__proto__指向Object.prototype

超融合服务器服务器托管 js原型面试题 js原型链的继承 js原型属性有什么用原型原型链

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/105472.html

独家解析Javascript原型继承 - 之函数原型和AOP

摘要：引子独家解析原型继承已经比较全面的分析了自定义函数类型，内置基本类和内置对象类型的的以及的原型链。鉴于函数是的一等公民，另辟新篇介绍函数的原型及其应用。函数本身也是对象，它遵循独家解析原型继承所描述的自定义函数类型对象的原型法则。引子独家解析Javascript原型继承已经比较全面的分析了自定义函数类型，JS内置基本类(undefined, null, bool, number, ...

ispring 2019-08-20 18:02 评论0 收藏0
JS基础-原型、原型链真的不能一知半解

摘要：原型链和对象的原型是对象实例和它的构造函数之间建立的链接，它的值是构造函数的。对象的原型根据上文提到的构造调用函数的时候会创建一个新对象，自动将的原型指向构造函数的对象。 showImg(https://segmentfault.com/img/remote/1460000020185197); JS的原型、原型链一直是比较难理解的内容，不少初学者甚至有一定经验的老鸟都不一定能完全说清...

changfeng1050 2019-08-26 11:00 评论0 收藏0
JS那些奇怪的题目（2）

摘要：属性返回所属函数的函数名称。正确字符串如果格式错误构造函数返回的仍是一个的实例所以结果为第题解析一个的属性就是参数的个数。的结果中国标准时间，获得当前时间是个对象，是获得当前时间是个字符串。第23道 [1 < 2 < 3, 3 < 2 < 1] 解析：如果加上括号就清楚了许多。(1 < 2) < 3 => (true) < 3 => 1 < 3 => true(3 < 2) < 1 ...

dinfer 2019-08-20 14:32 评论0 收藏0
JS继承与工厂构造及原型设计模式解析

　　我们在前一篇文章《JS精粹，原型链继承和构造函数继承的毛病》,提到了：原型链继承、构造函数继承、组合继承；　　在另一篇文章《蓦然回首，工厂、构造、原型设计模式，正在灯火阑珊处》，提到了：我们用于创建对象的三种设计模式：工厂设计模式、构造设计模式、原型设计模式；　　至此，我们可以明显的感受到：JS 要实现面向对象（继承的能力），离不开这 3 种设计模式；　　原型链 + 构造函数 = 组合继承　...

3403771864 2023-05-21 16:21 评论0 收藏0
独家解析Javascript原型继承

摘要：面向对象实现代码动物发声汪汪喵喵调用代码动物发声喵喵动物发声汪汪当要增加一种动物时，只需增加一个继承，不会影响其他已有的动物逻辑。所以的继承和的原型继承，可谓殊途同归。传统面向对象的继承和多态我们知道C++／Java／C#等面向对象语言，都原生地支持类的继承。继承的核心作用大抵是创建一个派生类，并使其复用基本类（即父类）的字段和／或方法。并且派生类可以重写基本类的方法。这样基本类和...

verano 2019-08-20 18:01 评论0 收藏0