[JS]原型链的解释和梳理

已于 2022-04-13 17:18:31 修改
阅读量95 收藏
点赞数
分类专栏： js
于 2022-04-13 16:17:32 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/wyy7293/article/details/124150737
版权

javascript 前端

在这里插入图片描述

  • 链关系:
    • 自身 => 原型 => Object
  • 当我们使用一个属性或方法时,会先在自身查找
    • 自身如果有,则直接使用
    • 自身没有则去原型查找,原型上有则使用
    • 原型上没有,则去原型(Object)查找,有则使用,无则返回undefined
举个栗子

在这里插入图片描述

wyy7293
关注
专栏目录
JavaScript什么是原型和原型链JS
Liberty_yes的博客
02-25 625
从事前端这么久，发现原型和原型链一直都是云里雾里，网上看了好多文章、博客也还是不怎么明朗，相信被它困扰的小伙伴，不在少数 以下是我总结的原型和原型链，个人认为是比较浅显易懂的： 一、首先大家在对JS原型进行解释的时候，会涉及两个概念：构造函数、原型对象 构造函数：通俗的一句话说，就是你在script标签里面声明的函数： function Person(params) { /**我就是构造函数*/ } 原型对象：当我们创建了一个函数A，浏览器就会在内存中创建一个对象B
javascript构造函数及原型链梳理
to_the_Future的博客
07-06 356
构造函数和原型链是 JavaScript 中的重要概念，它们可以用于创建对象和实现继承功能。掌握构造函数和原型链的基本概念和用法，有助于提高 JavaScript 编程技能。下次再见。
JavaScript 原型和原型链详细解释
weixin_45509705的博客
07-26 174
关于 JavaScript 原型的解释 在ES6 之后，可以使用class关键字来创建一个类，并使用 new 关键字来创建对象，但在 ES6 之前，是通过构造函数来创建的对象. ES6 之后 class Animal { constructor(name, age) { this.name = name; this.age = age; this.eat = function() { console.log('吃吃吃') } } } var a = new
js原型链介绍 梳理
zxdfsdfvsd的博客
08-04 107
要了解原型链，首先要了解什么是原型模式，原型链其实就是多个原型模式的”串联”结果； 我们创建的每个函数都有一个Prototype 属性 这个属性值是一个指针，这个指针指向一个对象（原型对象）。而这个对象包含了 - 这个函数的所有实例 - 可以共享使用的属性和方法，（每一个函数都可以看做是构造函数，所以也都可以使用new 定义一个对应的实例）。 在默认情况下，所有原型对象都会自动获得一个cons...
js原型、原型链、原型链继承详解
weixin_47342392的博客
09-17 397
主要详细的解释s原型、原型链、原型链继承
javascript原型，原型链知识点梳理
yudong4062的博客
05-25 294
javascript原型 要理解原型我们要先问自己几个问题，1.什么是原型？2.为什么要用原型？3.什么是原型对象，和原型有什么区别，带着这些问题有助于我们更好的去理解原型。
理解原型和原型链
小北
04-29 1260
JavaScript中的原型和原型链是理解其面向对象特性的关键。通过原型，对象可以继承属性和方法；通过原型链，可以实现对象间的属性和方法的共享和继承；通过构造函数和函数的原型，可以方便地创建对象和实现对象间的复用。
原型以及原型链的理解
最新发布
weixin_58325937的博客
08-12 2003
object.prototype是什么Object.prototype** 是所有 JavaScript 对象的原型对象.它是所有对象的最终原型对象，意味着所有对象的原型链最终都会指向 Object.prototypeObject.prototype**包含了一些通用的方法，如 `toString`, `valueOf`, `hasOwnProperty` 等，这些方法可以被所有对象实例使用Object()在 JavaScript 中，Object()是一个全局函数，用于创建一个新的对象。
原型和原型链梳理
07-27 197
在javaScript中，经常会说到原型（prototype）和原型链（prototype chain）。我曾经以为我完全理解了，但是后来总是会发现不同的地方，这次进行一次系统的整理。 原型 什么是原型？ 看一下权威指南中的说明 每一个javaScript对象（null除外）都和另一个对象相关联。“另一个”对象就是我们熟知的原型，每一个对象都从原型继承属性。 如果是通过关键字new和...
学习javascript面向对象 理解javascript原型和原型链
11-24
【原型链】每个构造函数都有一个对象，原型对象都包含一个指向构造函数的指针，而实例都包含一个指向原型对象的内部指针。那么，如果原型对象等于另一个原型的实例，此时的原型对象将包含一个指向另一个原型的指针，...
JavaScript梳理
08-27
原型和原型链是JavaScript实现继承的关键，理解这两个概念能帮助我们更好地设计和实现面向对象的程序。 数组是另一种常用的数据结构，JavaScript提供了丰富的数组方法，如push、pop、shift、unshift、slice、splice...
Javascript原型和原型链透析详解—下（手写原型链，图文说明）
weixin_45745641的博客
01-12 490
前言 上一篇文章从class类入手写了个小案例，从而引入类型判断的方法 instanceof，带大家了解了什么是原型。这篇接着上篇去讲，给大家介绍重头戏—原型链，面试高频：如何手写原型链，对原型链的理解。 没看过上集的建议点下方链接去瞅瞅，图文并茂，方便理解本文 ✿(。◕ᴗ◕。)✿ Javascript原型和原型链透析详解—上 原型链 上集文章中我们写了一个案例。在案例中定义了父类People，子类Student继承父类，那么就有如下全等关系： People的显示原型prototype 全等 Studen
为什么说 bind 的实现非常考验对原型链的理解？
圆圆的 JavaScript 博客
10-24 1285
bind 的实现其实非常考验对原型链的理解。bind 和 apply，call 是 JS 修改 this 指向的三把利器 🔱。但看似简单的内容，实则包含了 JS 的两大核心内容：原型链和构造函数 (new) 。这篇文章分为两部分：一部分讲如何实现一个基础版本的 bind 方法，带大家做好热身运动；另一部分进入主题，详细讲解如何通过原型链来实现一个让人眼前一亮的 bind 方法。
[vue3] 子组件调用父组件的多种方法
热门推荐
wyy7293的博客
04-02 3万+
子组件调用父组件的方法 方法1 - 异步方式 父组件定义供子组件调用的xx方法 @updata:xx=xx 子组件中在setup的emit方法调用 context.emit(‘update:xx’) 注意: .sync 在这里不好用 父组件组件 <my-childe ref="RefChilde" @update:xx="xx[被子组件调用的自身方法]"></my-childe> 子组件组件 setup(props, context) { function fn
[vue3 + TS] 父组件调用子组件的多种方法
wyy7293的博客
04-02 5511
主要用 ref<InstanceType<typeof 组件>>() 来获取各个子组件实例 父组件 <Footer ref="footerRef" /> setup() { const footerRef = ref<InstanceType<typeof Footer>>() const parentClick = () => { footerRef.value?.handleFn('111') }
vue 解决 npm install 速度慢
wyy7293的博客
08-26 2473
通常我们在git clone 克隆项目下来后要进行安装项目所需的依赖,但是npm install 却很慢,因此聚集于此 // 建议不要直接使用 cnpm 安装以来，会有各种诡异的 bug。可以通过如下操作解决 npm 下载速度慢的问题 npm install --registry=https://registry.npm.taobao.org ...
[vue]build打包后将静态文件放入指定文件夹
wyy7293的博客
08-24 2449
vue build打包后将静态文件放入指定文件夹 最终效果 解决方案 在vue.config.js 添加 assetsDir module.exports = { assetsDir: 'index' }
js 加密姓名和加密身份证号码
wyy7293的博客
10-23 2384
js 加密姓名和加密身份证号码加密姓名加密身份证 例子 加密姓名 EncryptName(name) { let newStr; if(name.length === 2) { newStr = name.substr(0, 1) + '*'; } else if (name.length > 2) { let char = ''; for (let i = 0, len = name.length - 2; i < len; i++
前端面试必备：2020原生JS知识点梳理
"这篇文章是关于2020年的前端面试题整理，重点集中在原生JavaScript的知识上，包括JS的语言特性、数据类型、内置对象、内存管理以及作用域和变量声明等核心概念。" 在深入讨论JavaScript之前，让我们先回顾一下标题...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值