prototype和__proto__的区别

最新推荐文章于 2024-10-14 16:18:26 发布
转载 最新推荐文章于 2024-10-14 16:18:26 发布 · 742 阅读 · 1

本文解释了JavaScript中prototype和__proto__的概念及其差异。prototype主要用于定义构造函数的原型对象，而__proto__属性用于连接对象原型链。通过三张图片直观展示了两者的工作原理。
prototype的英文含义为原型，雏形，蓝本
proto的英文含义为原型机，样机
__proto__：注意proto前后各为两个"_"

下面就用三张图片来说明prototype和__proto__的区别





prototype与__proto__的联系与区别
忘云的专栏
03-04 1201
写在前面这篇文章我的目的是试图讲清楚prototype与__proto__。很多人也许和我一样，很困扰于这两个东西究竟是干啥的，网上的各种资料也是讲的云里雾里，傻傻分不清楚。今天我就来尝试把它们说清楚。JavaScript里没有类的概念首先必须明确这一点，如果你学过Java之类的面向对象语言，你肯定熟悉类的概念，在面向对象语言的逻辑里，我们要先设计类（Class），然后再把类实例化城对象（Objec
js prototype和__proto__的关系是什么
10-16
现在我们来区分一下prototype和__proto__的区别： - prototype是函数的属性，用于定义实例共享的属性和方法，即原型对象。 - __proto__是对象的属性，是一个指向其构造函数的原型对象的引用。 在JavaScript中，...
prototype 和 proto 的区别
Mean
06-04 3774
学习Vue源码时看到一篇文章写得很好，记录一下 原文链接：链接 本文主要讲三个 问题 prototype 和proto function 和 object new 到底发生了什么 prototype 和proto 首先我们说下在 JS 中，常常让我们感到困惑的地方，就是 prototype 和 __proto__ 到底是干嘛的 1. __proto__ 就是 Javascri...
_proto_与prototype的关系及区别
jijunqing321的博客
08-23 5398
__proto__与prototype这两个原型属性大概在学习前端的过程中多多少少都接触过，但是不经常用基本就忘了，不过面试的时候经常会被问到，然后就一脸懵逼的蒙混过关，总觉得这样不太好，所以看了些文章，觉得这位大神写的非常不错，简单易懂，贴给大家看看，共同学习！ 原型是javascript面向对象编程中非常重要的概念，而且并不是那么容易懂。偶然看到一个题目：阐述proto和prototype的关系。看到这个问题的时候，我的脑海浮现出一些概念，但却说不出来。先来看一张图 如果能看懂图中的关系基本上就可以解
prototype与__proto__区别详细介绍
08-31
在JavaScript中，`prototype`和`__proto__`都是与对象继承和原型链紧密相关的概念，但它们在用途和性质上有所不同。以下是这两者的主要区别和详细解释： 1. **prototype（原型）** - `prototype`是函数特有的属性...
浅谈javascript中的prototype和__proto__的理解
10-17
主要介绍了浅谈javascript中的prototype和__proto__的理解，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
JS原型prototype和__proto__用法实例分析
10-15
JavaScript中的原型（Prototype）机制是实现继承的一种方式，它涉及到两个关键的概念：`prototype`和`__proto__`。这两个属性在JavaScript的对象和函数中扮演着不同的角色。 首先，`prototype`属性主要用于函数对象...
prototype和__proto__
flowRight的博客
06-19 2545
prototype和__proto__关系图 概念 prototype是函数的一个属性（每个函数都有一个prototype属性），这个属性是一个指针，指向一个对象。它是显示修改对象的原型的属性。 __proto__是一个对象拥有的内置属性，是JS内部使用寻找原型链的属性。跟浏览器环境有关，IE不可以访问 var Person = function(){}; var p = new Person(...
JavaScript中__proto__与prototype的关系深入理解
12-12
这里讨论下对象的内部原型(__proto__)和构造器的原型（prototype）的关系。 一、所有构造器/函数的__proto__都指向Function.prototype，它是一个空函数（Empty function） 代码如下: Number.__proto__ === Function.prototype // true Boolean.__proto__ === Function.prototype // true String.__proto__ === Function.prototype // true Object.__proto__ === Function.protot
JavaScript原型链图文详解
sosososolong的博客
07-30 570
原型链原型链思路梳理 原型链 原型链只要仔细梳理, 找出规律就会发现环环相扣也没有那么复杂 思路梳理 一个函数看成是一个构造函数, 专门用来实例化对象function Person(){}; let p = new Person(); 构造函数的显示原型属性prototype和它实例化出来的对象的隐式原型属性__proto__都指向同一个原型对象(Object对象) 当读实例对象的一个属性的时候, 如果在当前实例对象中没有找到这个属性, 那么就会到这个实例对象的原型对象中去找, 比如说, 调用实例对
prototype 和 __proto__ 区别
阳光下的冷静的博客
04-10 468
prototype是构造函数的属性。 __proto__是每个实例都有的属性，可以访问[[prototype]] 属性。 实例的__proto__与其构造函数的prototype指向的是同一个对象。 function Student(name) { this.name = name; } Student.prototype.setAge = function(){ this.age...
__proto__ 和 prototype 到底有什么区别
weixin_34204057的博客
06-17 424
以前在日常工作中使用 JS 时只是粗浅的知道在原型链中会存在 __proto__ 和 prototype 这2个概念，但真正要回答这2个属性的具体作用以及之间的关系和差异时又总觉得不知道从哪里说起，今天就来深入研究并总结一下，希望在这篇文章结束的时候能彻底从这个坑中爬出来
js中__proto__, prototype的理解
xqhys的博客
11-06 635
首先，要明确几个点： 1.在JS里，万物皆对象。方法（Function）是对象，方法的原型(Function.prototype)是对象。因此，它们都会具有对象共有的特点。 即：对象具有属性__proto__，可称为隐式原型，一个对象的隐式原型指向构造该对象的构造函数的原型，这也保证了实例能够访问在构造函数原型中定义的属性和方法。 2.方法(Function) 方法这个特殊的对象，除了和其他对象一...
一文读懂原型链 prototype和__proto__详解
热门推荐
D-的博客
07-24 3万+
先在自身属性/方法中查找，找到则返回。如果没有找到。就会沿着__proto__这条链去查找，找到也会返回。如果查到了原型链的尽头还是没有查找到，则返回undefined。2.因为在实例化对象查找属性或者方法时总是沿着__proto__隐式原型链查找，所以原型链又称作隐式原型链。3.原型链的作用查找对象的属性或者方法。httpshttpshttps。..............................
原型(prototype) 和 原型链(__proto__) —— 别再为 JavaScript 的原型苦恼了
weixin_43822185的博客
10-14 1334
原型(prototype) 和 原型链(__proto__) —— 别再为 JavaScript 的原型苦恼了
__proto__和prototype
Smilequeen1的博客
08-14 1012
_proto__: 用于访问或设置对象的原型链上的一个链接，直接影响对象的原型。虽然在现代 JavaScript 中不推荐使用，但它在早期的实现中很常见。prototype: 是构造函数的一个属性，定义了由该构造函数创建的所有对象实例的原型。它是标准的 JavaScript 机制，推荐使用和来操作对象的原型链。
prototype和__proto__区别
最新发布
12-27
### JavaScript 中 `prototype` 和 `__proto__` 的区别 #### 定义与作用范围 `prototype` 是函数对象独有的属性，用于定义该函数作为构造器创建的对象实例所继承的方法和属性。当通过构造函数使用 `new` 关键字创建新对象时，这些对象会自动获得访问其构造函数的 `prototype` 属性中定义的所有方法和属性的能力[^3]。 ```javascript function Animal(type) { this.type = type; } Animal.prototype.speak = function() { console.log(`The ${this.type} speaks.`); }; const dog = new Animal('dog'); dog.speak(); // 输出 "The dog speaks." ``` 相反，`__proto__` 并不是特定于任何类型的对象；几乎所有的对象都拥有此内部链接指向它们各自的原型对象。对于由构造函数产生的对象而言，`__proto__` 默认指向构造函数的 `prototype` 属性对应的对象。这使得对象能够沿着这条链向上查找未在其自身上找到的属性或方法[^4]。 ```javascript console.log(dog.__proto__ === Animal.prototype); // true ``` #### 创建方式的不同影响 由于 ES6 引入了类的概念，在现代浏览器环境下可以更直观地看到两者之间的关系： - 类声明中的静态成员会被添加到类自身的 `prototype` 上； - 实例化后的对象则持有对其构造器 `prototype` 的引用，即 `__proto__` 指向的地方。 ```javascript class Vehicle { constructor(wheels) { this.wheels = wheels; } move() { console.log(`${this.wheels}-wheeled vehicle moving`); } } // 静态方法被挂载到了Vehicle.prototype上 console.log(Vehicle.prototype.move); let bike = new Vehicle(2); // 自动设置bike.__proto__ -> Vehicle.prototype console.log(bike.__proto__.move === Vehicle.prototype.move); // true ``` 值得注意的是，尽管可以通过操作 `__proto__` 来改变现有对象的行为模式，但这通常被认为是不推荐的做法，因为它可能导致性能下降以及难以调试的问题。相比之下，利用好 `prototype` 可以为开发者提供一种更加优雅的方式来扩展功能而不破坏原有结构[^1]。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值