js原型 原型链

JavaScript|深入了解JS原型链 原型prototype 每个函数都有一个prototype属性,它默认指向一个object空对象(没有我们定义的属性),即称为原型对象。这里一般讨论构造函数。 其中Objecty也是有原型对象的。 当函数通过构造函数形式调用时,它所创建的对象都有一个隐含的属性:指向构造函数的原型对象,我们可以通过 __proto__ 来访问该属性。 原型对象中还有一个contructor属性,它指向函数对象。 构造函数、实例和原型对象在内存中的关系图1: 图1对应的伪代码如下: function Myclass(){ 阅读详情

一、 普通对象与函数对象

1.对象分为普通对象和函数对象。
2.Object,Function 是JS自带的函数对象。
3.凡是通过new Function() 创建的对象都是函数对象,其他的都是普通对象。

function f1() {};
var f2 = function() {};
var f3 = new Function('str', 'console.log(str)');
var o3 = new f1();
var o1 = {};
var o2 = new Object(); 
console.log(typeof Object); // function
console.log(typeof Function); // function
console.log(typeof o1); // object
console.log(typeof o2); // object
console.log(typeof o3); // object
console.log(typeof f1); // function
console.log(typeof f2); // function
console.log(typeof f3); // function

在上面的例子中,o1 o2 o3 为普通对象,f1 f2 f3 为函数对象。

二. 原型对象

在 JavaScript 中,每当定义一个对象(函数)时候,对象中都会包含一些预定义的属性。其中函数对象的一个属性就是原型对象 prototype(n.原型)。注:普通对象没有prototype,但有__proto__属性。

(在javascript中每个对象都会有一个__proto__属性,当我们访问一个对象的属性时,如果这个对象内部不存在这个属性,那么它就会去__proto__里去找这个属性,这个__proto__又会有自己的__proto__,于是就这样一直找下去,这就是原型链的概念。)

原型对象其实就是普通对象(Function.prototype除外,它是函数对象,但他没有prototype属性(前面说道函数对象都有prototype属性))。看下面的例子:

function f1() {};

console.log(f1.prototype) // f1 {}
console.log(typeof f1.prototype) // Object
console.log(typeof Function.prototype) // Function
console.log(typeof Object.prototype) // Object
console.log(typeof Function.prototype.prototype) // undefined

(1).从console.log(f1. prototype) 输出f1 {}可以看出:
f1. prototype就是 f1的一个实例对象,在f1创建的时候,创建了一个它的实例对象并赋值给它的prototype,过程如下:

var temp = new f1();
f1.prototype = temp;

// new Function ()产生的对象都是函数对象,所以temp是函数对象。

(2).原型对象是主要作用是继承。

var person = function(name) {this.name = name};
person.prototype.getName = function() {	return this.name;}
var zjh = new person('zhangjiahao');
zjh.getName(); // zhangjiahao

从这个例子可以看出,通过给person.prototype设置了一个函数对象的属性,那有person实例(例中:zjh)出来的普通对象就继承了这个属性。具体是怎么实现的继承,就要讲到原型链了。

三、原型链

1.JS在创建对象(不论是普通对象还是函数对象)的时候,都有一个叫做__proto__的内置属性,用于指向创建它的函数对象的原型对象prototype。

console.log(zjh.__proto__ === person.prototype) //true

2.person.prototype对象也有__proto__属性,它指向创建它的函数对象(Object)的prototype。

console.log(person.prototype.__proto__ === Object.prototype) //true

3.Object.prototype对象也有__proto__属性,但它比较特殊,为null。

console.log(Object.prototype.__proto__) //null

4.有__proto__串起来的直到Object.prototype.__proto__为null的链叫做原型链。
在这里插入图片描述

5.var anObject = new aFunction()形式创建对象的过程实际上可以分为三步:
第一步建立一个新对象;
第二步将该对象的内置的__proto__属性设置为构造函数prototype引用的那个原型对象;
第三步就是将该对象作为this参数调用构造函数,完成成员设置等初始化工作。

Object.__proto__ === Function.prototype   // true

Object是函数对象,是通过new Function()创建,所以Object.__proto__指向Function. prototype。

Function.__proto__ === Function.prototype  // true

Function 也是对象函数,也是通过new Function()创建,所以Function.__proto__指向Function. prototype。

Function.prototype.__proto__ === Object.prototype //true

Function.prototype是个函数对象,理论上他的__proto__应该指向 Function.prototype,就是他自己,自己指向自己,没有意义。
JS一直强调万物皆对象,函数对象也是对象,给他认个祖宗,指向Object. prototype。

Object. prototype.__proto__ === null

保证原型链能够正常结束。

四、constructor

1.原型对象prototype中都有个预定义的constructor属性,用来引用它的函数对象,这是一种循环引用。

person.prototype. constructor === person  //true
Function.prototype.constructor === Function  //true
Object.prototype.constructor === Object  //true

五、总结

1.原型和原型链是JS实现继承的一种模型。
2.原型链的形成是真正是靠__proto__ 而非prototype。

js原型链污染 JavaScript 原型链是实现继承的一种方式,每个对象都有一个内部属性(在代码中可通过__proto__访问),它指向该对象的原型对象。当访问一个对象的属性或方法时,JavaScript 首先会在该对象本身查找,如果找不到,就会沿着原型链向上查找,直到找到该属性或方法,或者到达原型链的末尾(传统的面向对象(例如java),采用类的形式,以类为模版创建对象JavaScript 是基于原型链实现继承和封装。 阅读详情

相关推荐

temp:JS

temp:JS

JS 变量 运算符 数据类型,流程控制 循环 数组 函数(待补充)

文章目录 1.JS 二、使用步骤 1.引入库 2.读入数据 总结 前言 提示:这里可以添加本文要记录的大概内容: 例如:随着人工智能的不断发展,机器学习这门技术也越来越重要,很多人都开启了学习机器学习,本文就介绍了机器学习的基础内容。 提示:以下是本篇文章正文内容,下面案例可供参考 1.JS ...

qq_63260581的博客 633

JS_TEMP:JavaScript编码实践

JS_TEMP JavaScript编码实践 该存储库用于存储我编写的所有练习JavaScript代码。 它涵盖了各种主题和复杂性/难度级别。 这绝不是一个完整的项目,仅是我存储和跟踪我使用JS进行编程的不同编程主题的地方。

JavaScript-立即执行函数

JavaScript的立即执行函数是函数在被创建时就被立即执行。一般情况有俩种形式:(function () {} ())  这个较好。(function () {} ) ()下面来介绍一下这个函数的特点。函数一旦被执行,那么就不能在被执行了!eg 1: var temp=(function () { console.log(1); ...

wust_cyl的博客 517

JS实现不用中间变量temp 实现两个变量值得交换方法

主要介绍了在JS中 实现不用中间变量temp 实现两个变量值得交换 ,需要的朋友可以参考下

添加odbc数据源时的一些问题和解决办法

pl/sql

Mr_Syh的博客 9644

在JS中 实现不用中间变量temp 实现两个变量值得交换

1.使用加减法; var a=1; var b=2; a=a+b; b=a-b; a=a-b; 2.使用乘除法(乘除法更像是加减法向乘除运算的映射) var a=1; var b=2; a = a * b; b = a / b; a = a / b; 注意:该方法可以交换整型和浮点型数值的变量,但在处理浮点型的时候有可能出现精度的损失 ...

weixin_30709635的博客 207

URDF模型转换实战:解决SolidWorks到Gazebo的五大常见问题

本文详细解析了从SolidWorks导出URDF模型到Gazebo仿真过程中常见的五大问题及解决方案,包括插件安装、坐标系建立、Link与Joint配置等关键步骤。通过实战经验分享,帮助机器人仿真工程师高效完成模型转换,确保Gazebo仿真准确性。

weixin_29052717的博客 445

JS模板引擎jTemplates基础使用

1.jTemplate简介 jTemplates是一个基于Jquery的js模板引擎插件。该引擎全部代码由JS实现,可以配合AJAX,JSON一起协同工作,模板内容可以用JS代码,实现了活动更新,可以自动从服务器更新模板生成的内容。 使用jTemplates,服务端只需要把对象集合序列化成json格式并传入客户端,客户端再把json对象填充模版生成列表,这样一服务端传输的只是json格式的字符串,...

专业的计算机毕业设计指南 1660

Linux密码破解(使用hydra工具和使用john暴力破解)

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目录一、使用hydra离线破解linux密码1.准备实验环境2.创建用户名字典3.hydra密码爆破二、复制shadow文件,使用john暴力破解1.实验环境1.复制linux的shadow文件2.john暴力破解 一、使用hydra离线破解linux密码 1.准备实验环境 ①攻击机:kali_linux 2021.2(ifconfig查询IP地址:192.168.119.132) ②靶机:Ubantu 16.04(ifconfig

weixin_46447549的博客 2万+

SAP(ERP)工艺路线(Routing)业务视角解析

工艺路线(Routing)也是PP模块,即生产制造模块中最重要核心主数据之一,也是ERP(SAP)顾问,必需从业务与系统深入掌握的重要主数据,它也是整个生产计划与生产流程的重要基础。因为执行步骤只是操作层面的认知,业务顾问需要从业务本质上去理解它,要真正从业务视角理解工艺路线的业务价值,而不仅仅是操作层面的认知。因此将工艺路线理解为“有以上业务本质的理解,然后进到SAP系统中,就容易理解工艺路线(Routing)的每一组成部分结构与功能了,本质就是理解制造企业如何将设计意图转化为物理现实的编码规则。

m0_45197968的博客 1503

JavaScript基础学习笔记01——变量、数据类型

JavaScript基础学习笔记01——变量、数据类型

visionchyw的博客 582

用Python玩转Carla-Apollo联合仿真:手把手教你实现自动驾驶测试

本文详细介绍了如何使用Python实现Carla-Apollo联合仿真,从环境搭建到自动驾驶算法测试的全流程。通过Carla提供的高逼真仿真环境和Apollo的自动驾驶算法栈,开发者可以高效验证感知、规划和控制模块。文章包含环境配置、Python API操作、桥接实现及实战测试,为自动驾驶开发提供完整解决方案。

wasm7browser的博客 267

彻底弄懂javaScript中的原型、原型链(手绘js原型链图)

原型和原型链都是来源于对象而服务于对象的概念,所以我们要先明确一点:JavaScript中一切引用类型都是对象,对象就是属性的集合。、、、、等都是引用类型。也就是说 数组是对象、函数是对象、正则是对象、对象还是对象。 二、原型和原型链是什么 上面我们说到对象就是属性(property)的集合,有人可能要问不是还有方法吗?其实方法也是一种属性,因为它也是的表现形式,具体见下图。可以看到上确实多了一个的属性,值为一个函数,但是问题来了,上面并没有这个方法,为什么我们可以调用呢?这就引出了 原型。每一

懒散小青年的博客 1700

168、OIS光学防抖系统设计:陀螺仪标定、音圈马达驱动与滚珠式/悬丝式结构选型

本文总结了OIS光学防抖系统设计中的关键问题与解决方案。作者通过实际案例指出,陀螺仪标定需重视零偏、灵敏度和温度补偿问题,音圈马达驱动需采用电流环控制并优化相位补偿。在机械结构选型方面,滚珠式适合大角度补偿但存在回差问题,悬丝式精度高但受重力影响,需根据应用场景选择。系统联调建议从开环到闭环逐步验证,注意陀螺仪与驱动频率匹配。最后给出5条经验建议:关注陀螺仪信噪比而非分辨率、预留标定余量、重视机械结构公差、配备专业调试工具、协调OIS与电子防抖的分工配合。文章强调OIS调试需针对不同模组特性进行反复测试与标

zzfmlxs的博客 46

【软件系统架构】系列十一:面向对象技术—sysML

摘要: SysML(系统建模语言)是UML的扩展,专为复杂系统工程设计,支持硬件、软件、人员等跨领域建模。其核心包括9种图:4种结构图(如块定义图BDD、内部块图IBD)、4种行为图(如活动图AD、序列图SD)和需求图(REQ),覆盖需求、结构、行为及参数约束。相比UML(面向软件),SysML精简图表(9 vs 13),强化需求追踪与性能分析(如参数图PD),并支持MBSE(基于模型的系统工程)。需求关系(如满足、验证、派生)在需求图中明确关联设计实现,形成闭环管理。SysML是UML的子集与系统工程扩展

moton2017的博客 1908

【JavaScript】一文了解JS原型与原型链

浅解JavaScript中原型与原型链的概念及其应用

ztK63LrD的博客 1261

I2C 协议在 Camera Sensor 驱动中的典型配置方式与实战应用

在 Linux Camera 系统中,Sensor 与主控之间的控制信令几乎都依赖于 I2C 总线完成。I2C 协议不仅承载了 Sensor 初始化、模式切换、AE/AF 等关键功能的指令传输,也是构建 v4l2\_subdev 驱动框架的核心基础。本文将围绕 Sensor 驱动中的 I2C 通信机制展开分析,从设备树节点声明到驱动代码中的传输接口调用,结合主流平台工程实战经验,详解如何构建稳定、高效、可维护的 I2C 控制路径。

努力分享一些人工智能、计算机视觉、影像等相关的知识干货! 1713

Javascript原型链详解,一文带你彻底搞懂js原型、原型对象及原型链

原型链是 JavaScript 中的一个重要特性,它是实现对象之间继承关系的机制。在 JavaScript 中,每个对象都有一个原型属性,指向另一个对象。当试图访问一个对象的属性或方法时,如果该对象本身没有这个属性或方法,JavaScript 引擎会沿着原型链向上查找,直到找到对应的属性或方法为止。

greatming666的博客 2110

OV9734 DATASHEET,完整规格书

OV9734完整规格书,包括电气参数,尺寸规格,寄存器配置表等

WINCC7.3破解文件

WINCC7.3硬件够破解文件,有需要的下载!WINCC7.3硬件够破解文件,有需要的下载!

「JavaScript深入」彻底搞懂JS原型与原型链

「JavaScript深入」彻底搞懂JS原型与原型链:原因、使用class实现继承、原型、原型链、prototype和proto

XH_jing的博客 1612

efm32 入门.pdf

本PDF共计22页,介绍的是操作驱动API,下载与否自己斟酌。

【JS】理解 JavaScript 的原型与原型链

在 JavaScript 中,每个函数都有一个prototype属性,这个属性指向一个对象,这个对象就是该函数的原型对象。原型对象可以包含属性和方法,这些属性和方法可以被该函数创建的所有实例对象所共享。// 输出:Hello, my name is Alice// 输出:Hello, my name is Bob在上面的例子中,Person函数的prototype属性指向一个原型对象,该原型对象包含一个sayHello方法。person1和person2都是Person。

2301_78802081的博客 1254

visio安装包

Microsoft Office Visio 是一款专业的制图软件。利用经过更新的形状、协作工具和数据链接图表,创建专业级图表以简化复杂的信息。

【JS】JavaScript 中的原型与原型链

JavaScript中的原型(prototype)和原型链(prototype chain)是面向对象编程中的重要概念,用于实现对象之间的继承和属性访问。

Eliaukoyx 1099

JS原型与原型链详解—JavaScript基础篇

我们创建的每个函数都有一个prototype(原型)属性,这个属性是一个指针,指向一个对象,而这个对象的用途是包含可以由特定类型的所有实例共享的属性和方法。字面意思即prototype就是通过调用构造函数而创建的那个对象实例的原型对象。使用原型对象的好处是可以让所有对象实例共享它所包含属性和方法。无论什么时候,只要创建了一个新函数,就会根据一组特定规则为该函数创建一个prototype属性,这个属性指向函数的原型对象。

qq_21280835的博客 1634

JavaScript原型和原型链

JavaScript 的核心机制原型和原型链是实现面向对象继承的关键。每个对象(除 null 外)都有一个原型对象作为模板,通过 __proto__ 属性访问,而函数对象特有的 prototype 属性指向其实例的原型。原型链由对象通过 __proto__ 连接形成,属性查找会沿链向上直至 Object.prototype(终点为 null)。通过将子类原型指向父类实例(而非直接共享父类原型)可实现继承,避免污染父类。原型链机制使 JavaScript 无需类也能实现继承,是理解面向对象编程的基础。

students33的博客 1454

JavaScript之彻底理解原型与原型链_js contructor

知识的海洋往往比想象中还要辽阔,原型与原型链这边也反复的学过多次,我认为应该学的比较全面,比较完善了。但遇到这个面试题后,我才发现我所学的只不过是一根枝干,JS里面真的有很多深层次的宝藏等待挖掘。学海无涯,与君共勉。本文部分图源:渡一教育的学习资料。

2401_87288988的博客 663
上一篇: js数据类型
下一篇: css两栏布局
SinceSpringOnU
博客等级 码龄7年 9粉丝 52原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值