理解JS中原型链prototype，__proto__与constructor，以及如何手写继承

最新推荐文章于 2022-05-27 15:20:05 发布
最新推荐文章于 2022-05-27 15:20:05 发布
阅读量218 收藏
点赞数
分类专栏： js javascript 文章标签： js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/lixuhui2468/article/details/108293674
版权
本文探讨JavaScript中prototype、__proto__和constructor的作用。prototype是函数特有的属性，用于添加共享实例属性，当函数作为构造函数时，实例通过__proto__继承prototype的属性和方法。__proto__指向函数的prototype，而constructor则是prototype中的属性。在原型链上修改共享属性如testArray会影响所有实例，而新增属性如testNumber则在实例本身。理解这些概念对于避免潜在问题至关重要。
摘要由CSDN通过智能技术生成

提示：
    当前文章是本人在学习过程中记录的知识点， 如果有什么错的欢迎指出，大家一起学习进步！！

知识点：

  1. proto 和 constructor 属性是所有对象都会拥有的

这是普通对象
在这里插入图片描述
在这里插入图片描述

  1. prototype 这个属性在系统默认情况下是函数独有的。（注意，这里强调了默认情况）

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

  1. 因为函数也是属于对象，所以函数同时也拥有 proto 和 constructor 属性。再第一点第三张图就是，这里就不再多次放图了

根据上面3个知识点，可以知道这三个属性分别会出现在哪里，后面再来了解其作用，这样相对于会简单点



最低0.47元/天 解锁文章
白子兄弟
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
手写 new 操作符(构造函数模式)
weixin_43484007的博客
06-08 680
new 运算符创建一个用户定义的对象类型的实例或具有构造函数的内置对象的实例。
彻底理解什么是原型链，prototype和__proto__的区别，以及手写实现instanceof关键字
最新发布
m0_68997646的博客
10-22 157
彻底理解什么是原型链，prototype和__proto__的区别，以及手写实现instanceof关键字
原型对象，原型链的理解（__proto__，prototype）（构造函数和类）
weixin_44441196的博客
05-20 146
创建一个对象可以通过一个类或者构造函数来创建 构造函数 // 简单创建一个 const Mum = function(a, b, c) { this.name = a this.age = b this.gender = c } const son1 = new Mum('zlz', 25, '男') 每一个函数在创建的时候都会默认生成一个原型对象prototype,以Mum这个构造函数为例子：console.log(Mum.prototype) { constructor:.
js原型链以及手写new方法
m0_54944506的博客
12-23 147
//原型链 //通过new 函数名来实例化对象的函数叫做构造函数 //构造函数的主要功能为初始化对象，特点是和new一起使用 构造函数定义时首字母大写 为初始化的对象添加属性和方法 function Person(name) { this.name = name } let person = new Person('张三'); //person为一个新对象 console.log(person.name); //new一个新对象的过程 //1.创建一个空对象 //2.空对象的_proto_指向构
js 手写 原型链 继承
gongzuoyongde的博客
05-28 766
直接上代码 function Animal() { this.colors = ['black', 'white'] } Animal.prototype.getColor = function() { return this.colors } function Dog() {} Dog.prototype = new Animal() let dog1 = new Dog() dog1.colors.push('brown') let dog2 = new Dog() console.
【4期】彻底搞懂JS原型继承之——__proto__、prototype、constructor
微光·火炬
09-09 565
__proto__ __proto__属性指向原型对象，也可以理解为父类对象。 prototype 函数的原型对象，给其它对象提供共享属性，函数所独有的。所有对象，都可以作为另一个对象的 prototype。 原型链 当你在访问一个对象属性的时候，如果该对象内部不存在这个属性，那么就回去它的__proto__属性所指向的对象（父类对象）上查找，如果父类对象依旧不存在这个属性，那么就回去其父类的__proto__属性所指向的父类的父类上去查找。以此类推，知道找到 null。而这个查找的过程，也.
js原型链与继承解析（初体验）
10-22
JavaScript中的原型链和继承是其面向对象编程的核心概念。它们允许对象之间共享属性和方法，实现代码的复用。在JavaScript中，每个对象都有一个内部属性`[[Prototype]]`，通常可以通过`__proto__`（非标准，但在很多...
js代码-js手写继承
07-16
本篇将深入探讨如何在JavaScript中实现手写继承，并通过分析`main.js`中的代码来理解这一过程。 一、原型链继承 在JavaScript中，对象都有一个`__proto__`属性，指向创建它的构造函数的原型对象。原型对象又有一个`...
js代码-手写代码练习-----原型继承 ,class 继承
07-15
在JavaScript中，继承是面向对象编程的一个核心概念，它允许我们创建基于现有对象的新对象，共享和重用代码。在这个话题中，我们将深入探讨两种主要的继承方式：原型继承和类（Class）继承。 ### 1. 原型继承 原型...
Javascript原型和原型链透析详解—下（手写原型链，图文说明）
weixin_45745641的博客
01-12 454
前言 上一篇文章从class类入手写了个小案例，从而引入类型判断的方法 instanceof，带大家了解了什么是原型。这篇接着上篇去讲，给大家介绍重头戏—原型链，面试高频：如何手写原型链，对原型链的理解。 没看过上集的建议点下方链接去瞅瞅，图文并茂，方便理解本文 ✿(。◕ᴗ◕。)✿ Javascript原型和原型链透析详解—上 原型链 上集文章中我们写了一个案例。在案例中定义了父类People，子类Student继承父类，那么就有如下全等关系： People的显示原型prototype 全等 Studen
js之原型链与继承
vanora1111的博客
05-27 383
目录1、构造函数的prototype原型修改2、原型式继承3、借助构造函数继承4、寄生式工厂继承 （不推荐使用） 5、寄生组合式继承 (推荐)
JS学习笔记 原型链和利用原型实现继承
热门推荐
倪晓磊的博客
05-12 1万+
原型链原型链是一种关系，实例对象和原型对象之间的关系，关系是通过原型(__proto__)来联系的实例对象中有__proto__,是对象,叫原型,不是标准的属性,浏览器使用,并且有的游览器不支持构造函数中有prototype属性,也是对象,叫原型注意 原型中的方法是可以互相访问的实例代码 function Animal(name,age){ this.name=name; ...
手写一个继承（组合继承）
weixin_43199838的博客
07-07 421
function superType(){} function subType(){ //构造函数继承 superType.call(this,...args) } //原型链继承 subType.prototype = new superType() //对象增强 subType.prototype.constructor = subType()
关于原型，原型链，以及继承的一些理解（JS中的prototype、__proto__与constructor）
王小雨的博客
07-19 267
前段时间从上个公司离职后，便开始了疯狂的面试之旅，面试中遇到最多的问题就是，请说说你对原型、原型链以及继承的理解，怎奈用vue的时间已经太久，早就忘记了原生，更不记得什么继承、原型这些，于是发誓要将这些东西刻在心里，最近经过煎熬，翻完无数博客以及论坛，终于有了那么一丝丝理解，如下是最近的一点理解。如有不对，希望指正！ 首先先总结： 1、__proto__和constructor是对象的...
原型链以及继承的几种方式
码农的博客
03-05 2820
原型链以及继承的几种方式学习原型链前需要了解原型链继承的几种方式 学习原型链前需要了解 使用构造函数模式创建的对象实例，都有一个constructor(构造函数) 属性，该属性指向构造函数。 function Person (name, age, job) { this.name = name; this.age = age; this.job = job; thi...
原型链的两种继承方式及区别
qq_29912733的博客
02-10 908
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta ...
画一个js原型链
caipital的博客
09-04 322
要点： 每个函数（function）都有一个prototype（即：显式原型），它在函数被定义的时候产生。 每个实例对象都有一个__proto__，（即：隐式原型），它在对象被创建时产生。 原型对象中有一个constructor属性，它指向相对应的函数对象。 对象的隐式原型的值为其对应的构造函数的显式原型的值。 原型链的作用： 当访问一个对象的属性时，先在自身的属性中查找，若找到，则可以访问自身的这个属性。若没有找到，再沿着__proto__这条链向上查找，若找到，则可以访问原型对象中的该属性。若都没能找
js高级----回顾new做了什么、prototype、__proto__、constructor、原型链、继承
muzidigbig的博客
04-10 544
用new调用一个函数，这个函数就被称为构造函数，任何函数都可以是构造函数，只需要用new调用它顾名思义，构造函数用来构造新对象，它内部的语句将为新对象添加若干属性和方法，完成对象的初始化构造函数必须使用new关键字调用，否则不能正常工作，因此，开发者约定构造函数命名时首字母要大写如果不用new调用构造函数构造函数中的this不是函数本身尝试为对象添加方法为什么需要构造函数？
原型与原型链详解：构造函数、__proto__与继承机制
首先，我们来深入理解"prototype"与 "__proto__"。 "prototype"，也被称为显式原型，是每个JavaScript函数在创建后固有的一个特性，它代表了函数的原型对象。这个对象包含了函数内部方法和属性，以及可能继承自其...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值