__proto__和protype的区别

news2024/9/20 5:30:19

概述:

prototype 函数静态属性,非实例属性,所有实例都可以继承它
__proto__ 实例属性,指向实例的原型对象,原型对象包括构造函数和protype属性

替代


现代浏览器中可以使用Object.getPrototypeOf()来替代__proto__来获取原型对象

var obj = {};  
var proto = Object.getPrototypeOf(obj);  
console.log("obj.__proto_===proto",obj.__proto_===proto)//true
console.log(obj.__proto_===proto === Object.prototype); // 输出 true


更加复杂的例子


实例的构造函数的原型对象的__proto__的构造函数Base,
obj.constructor.prototype.__proto__.constructor===Base

function Base() {}
Base.prototype.say=function(){
    
}
function Derived() {}
Derived.prototype.derivedSay=function(){
    
}
Derived.prototype.constructor=Derived;
// 将 `Derived.prototype` 的 `[[Prototype]]` 设置为 `Base.prototype`
Object.setPrototypeOf(Derived.prototype, Base.prototype);
const obj = new Derived();

//####1obj.__proto等于obj.constructor.prototype,也就是Derived原型对象(底层生成),非Derived函数
console.log(obj.__proto__===obj.constructor.prototype)



//###2通过构造函数的原型对象的__proto__找到构造函数Derived的原型对象Base的构造函数Base
//原型对象Base的构造函数Base不是一个东西,原型对象以来函数Base生成,同时生成的原型对象,且把函数赋予原型对象的constructor属性
console.log(obj.constructor.prototype.__proto__.constructor===Base)

 

__proto__prototype是JavaScript中两个重要的概念,它们在对象原型链和继承中起着关键作用。下面将详细解释它们之间的区别:

  1. 定义和性质:

    • prototype:这是每一个函数创建后都会拥有的一个属性,它指向函数的原型对象。这个原型对象包含了可以由该函数的所有实例共享的属性和方法。prototype是一个静态属性,它属于函数对象本身,而不是函数的实例,es6标准里面可以理解是类属性
    • __proto__:这是JavaScript中任意对象都有的一个内置属性[[Prototype]]的非标准访问方式。在ES5之前,没有标准的方法可以直接访问这个内置属性,但大多数浏览器支持通过__proto__来访问它。__proto__是一个实例属性,它存在于每个对象实例中,用于引用创建该实例的构造函数的prototype属性,即该对象的原型对象。
  2. 作用和用途:

    • prototype:主要用于实现基于原型的继承和属性的共享。当创建一个新对象时,新对象__proto__属性会指向构造函数的prototype属性,从而建立起原型链。这使得对象可以访问其原型对象上的属性和方法,实现继承和共享。这里的继承是从原型对象继承
    • __proto__:主要用于在原型链中查找属性和方法。当一个对象试图访问一个不存在的属性时,JavaScript会沿着__proto__链向上查找,直到找到该属性或达到原型链的末端。这种机制使得对象可以继承其他对象的属性和方法。
  3. 注意事项:

    • 在使用__proto__时需要注意,它不是一个标准的属性,因此在不同的环境和浏览器中可能存在差异。在ES5之后,推荐使用Object.getPrototypeOf()方法来获取一个对象的原型。
    • prototype属性通常用于定义构造函数的原型对象,以便在创建新对象时共享属性和方法。而__proto__属性则用于在运行时动态地改变一个对象的原型,从而实现动态继承。

总的来说

__proto__prototype都是JavaScript中非常重要的概念,它们在原型链和继承中发挥着关键作用。理解它们的区别和用途对于掌握JavaScript中的对象模型和继承机制至关重要。

  1. prototype 函数静态属性,非实例属性,所有实例都可以继承它
  2. __proto__ 实例属性,指向实例的原型对象,原型对象包括构造函数和protype属性

 函数不是原型对象

javascript中如果new一个函数,其实它的原型对象是在底层生成的,

  • 该函数不等于原型对象 
  • 该函数是构造函数,
  • 原型对象 包括构造函数以及prototype

例如这个代码:

function fun(){}
fun.prototype.xx=function(){}
var f=new fun()
console.log(Object.getPrototypeOf(f).constructor===fun)//true
console.log(Object.getPrototypeOf(f)===fun)//false原型对象不等于fun,原型对象是个包含fun这个构造函数以及构造函数prototype的对象




内容来自文心一言

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1465114.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

主流的开发语言和开发环境介绍

个人浅见,不喜勿喷,谢谢 软件开发是一个涉及多个方面的复杂过程,其中包括选择合适的编程语言和开发环境。编程语言是软件开发的核心,它定义了程序员用来编写指令的语法和规则。而开发环境则提供了编写、测试和调试代码的工具和平台…

SQL面试题及答案

介绍 在快节奏的数据管理和信息技术世界中,导航和操作结构化数据的能力是一项非常重要的技能。SQL,即结构化查询语言,是关系数据库的基石,掌握这种语言的专业人员的需求量很大。SQL 面试在科技行业很常见,潜在的候选人会接受测试以展示他们的知识和解决问题的能力。为了帮…

【Spring】常见问题总结

目录 1. 什么是 Spring 框架? 2. 列举一些重要的Spring模块? 3. RestController vs Controller 4. Spring IOC & AOP 4.1 谈谈自己对于 Spring IoC 和 AOP 的理解 IoC AOP 4.2 Spring AOP 和 AspectJ AOP 有什么区别? 5. Spring bean 5.1…

OceanMind海睿思助力企业“数据入表”之价值实现与成本计量

2023年8月21日,财政部印发《企业数据资源相关会计处理暂行规定》(以下简称《暂行规定》),明确了数据资产会计处理适用的范围、准则、列示和披露要求。 《暂行规定》是规范企业数据资产会计处理指导性和引领性的制度文件&#xff…

微信小程序 --- wx.request网络请求封装

网络请求封装 网络请求模块难度较大,如果学习起来感觉吃力,可以直接学习 [请求封装-使用 npm 包发送请求] 以后的模块 01. 为什么要封装 wx.request 小程序大多数 API 都是异步 API,如 wx.request(),wx.login() 等。这类 API 接口…

探索无限:Sora与AI视频模型的技术革命 - 开创未来视觉艺术的新篇章

✨✨ 欢迎大家来访Srlua的博文(づ ̄3 ̄)づ╭❤~✨✨ 🌟🌟 欢迎各位亲爱的读者,感谢你们抽出宝贵的时间来阅读我的文章。 我是Srlua,在这里我会分享我的知识和经验。&#x…

解决两个MySQL5.7报错

目录 1.启动不了MySQL,报错缺少MSVCR120.dll去官网下载vcredist_x64.exe运行安装进入管理员CMD 2.本地计算机 上的 mysql 服务启动后停止。某些服务在未由其他服务或程序使用时将自动停止,Fatal error: Can‘t open and lock privilege tables: Table ‘…

网络电视盒子哪个品牌好?达人强推口碑电视盒子推荐

电视盒子使用时容易卡顿、死机,广告植入过多,系统操作复杂,散热差,这是很多电视盒子都存在的问题,网络电视盒子哪个品牌好是大家都在讨论的话题,我这次要分享的是用户评价最好的五款电视盒子推荐给不懂如何…

操作系统-吸烟者问题

文章目录 概述问题分析如何实现小结 概述 操作系统中的吸烟者问题是一个经典的同步问题,它涉及到进程间的同步和互斥。 在这个问题中,有三个抽烟者进程和一个供应者进程。每个抽烟者需要三种材料:烟草、纸和胶水来完成吸烟的操作。三个抽烟…

http协议基础与Apache的简单介绍

一、相关介绍: 互联网:是网络的网络,是所有类型网络的母集因特网:世界上最大的互联网网络。即因特网概念从属于互联网概念。习惯上,大家把连接在因特网上的计算机都成为主机。万维网:WWW(world…

Stable Diffusion 模型分享:AstrAnime(Astr动画)

本文收录于《AI绘画从入门到精通》专栏,专栏总目录:点这里。 文章目录 模型介绍生成案例案例一案例二案例三案例四案例五 下载地址 模型介绍 AstrAnime 是一个动漫模型,画风色彩鲜明,擅长绘制漂亮的小姐姐。 条目内容类型大模型…

vue中实现拖拽排序功能

npm i vuedraggable <template><div class"app-container"><!-- <div :class"canEdit ? dargBtn-lock el-icon-unlock : dargBtn-lock el-icon-lock" click"removeEvent()">{{ canEdit ? 调整 : 锁定 }}</div> --&…

Windows传文件到Linux系统(拖拽方式)

1、概述? 在平时开发过程中,可能会遇到如下场景: 在自己的Window系统中安装了VMware虚拟机,并在里面安装了Linux系统(Centos,Ubuntu,redhat等)。这个时候我们期望将window中的文件传递到Linux中,传递的过程比较的麻烦。 这个时候我们就可以借助相关工具直接拖拽完成。 …

ubuntu内核卸载重装

目录 问题1.问题复现2.可以正常启动的方式 保存快照卸载有问题的内核重装最新内核参考资料 问题 1.问题复现 ubuntu开机出现如下画面,启动不能正常启动 2.可以正常启动的方式 使用其他内核可以正常工作 保存快照 在解决之前保存快照,防止破坏时恢复 卸载有问题的内核…

Gitea提交代码自动触发Jenkins构建版本

提交代码自动触发Jenkins构建版本 1. 下载Generic Webhook Trigger 2. 配置Generic Webhook Trigger http://JENKINS_URL/generic-webhook-trigger/invoke?tokenruoyi-ui-8978456465 http://192.168.0.136:8090 为jenkisn地址&#xff0c;/generic-webhook-trigger/invoke?…

【selenium】执行 Javascript 脚本 滚动、元素的特殊操作等

某些特殊情况下&#xff0c;使用selenium的api无法操作页面元素&#xff0c;点击、滚动实现的某些功能&#xff0c;可以考虑通过执行js来完成。 为什么不用js写自动化&#xff1f;——selenium第一版是js写的&#xff0c;但js兼容性存在问题&#xff0c;所以引入webdriver 现在…

【C语言-期末项目/项目实践】-贪吃蛇(两万五千字详解,手把手教程博文,期末答辩神助手)

重要&#xff1a;游戏逻辑设计图 目录 1.游戏背景 2.项目效果展示 3.项目实现要求 4.技能要求 5.技术要点 6.Win32 API介绍 6.1Win32API 6.2控制台程序 6.3控制台屏幕上的坐标COORD 6.4GetStdHandle 6.5GetConsoleCursorInfo 6.5.1 CONSOLE_CURSOR_ INFO 6.6 Se…

初始Nginx(基本概念)

目录 一、Nginx的概念 二、Nginx常用功能 1、HTTP(正向)代理&#xff0c;反向代理 1.1正向代理 1.2 反向代理 2、负载均衡 2.1 轮询法&#xff08;默认方法&#xff09; 2.2 weight权重模式&#xff08;加权轮询&#xff09; 2.3 ip_hash 3、web缓存 三、基础特性 四…

JAVA工程师面试专题-Mysql篇

一、基础 1、mysql可以使用多少列创建索引&#xff1f; 16 2、mysql常用的存储引擎有哪些 存储引擎Storage engine&#xff1a;MySQL中的数据、索引以及其他对象是如何存储的&#xff0c;是一套文件系统的实现。常用的存储引擎有以下&#xff1a; Innodb引擎&#xff1a;In…

Git拉取gitee代码至本地

首先需要有Git&#xff0c;才能拉取代码。 安装参考 Git安装与卸载_git卸载重装-CSDN博客 安装好后在自己想要拉取代码的位置&#xff0c;右键Git bash here gitee 点击 复制 填写到打开的窗口即可