大厂面试经典问题：什么是继承 ？JavaScrpt中如何通过原型链实现继承 ？

原创 已于 2022-03-31 22:06:39 修改 · 928 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#前端 #javascript #面试

于 2022-03-31 22:06:09 首次发布
本文深入探讨了继承的概念，通过UML类图解释了继承的原理，并详细讲解了JavaScript中如何利用原型链来实现继承，指出子类必须拥有父类的所有属性和方法。最后提到了在ES6中继承的新方法，并鼓励读者提问交流。

有同学提问，能不能讲讲继承，这一篇笔记就来深入说说继承相关的内容，包含了什么是继承，JavaScript如何实现继承，通过原型链实现继承。
什么是继承 ？JavaScript中如何通过原型链实现继承 ？

以下我们先使用UML类图来表示类的属性和方法，用以举例说明

UML（统一建模语言）是一种为面向对象系统的产品进行说明、可视化和编制文档的一种标准语言，是非专利的第三代建模和规约语言。

UML是面向对象设计的建模工具，独立于任何具体程序设计语言。

以下两个无关的类：我们发现，People类 和 Car类 没有任何

People类和Student类的关系：我们发现，Student是一种 People

  • People类拥有的属性和方法Student类都有，Student类还扩展了一些属性和方法

  • Student “是一种” People，两类之间是 “is a kind of ”关系

  • 这就是继承关系：Student 类继承自People类

1、什么是继承

继承描述了两个类之间的 “ is a kind

最低0.47元/天 解锁文章
fizzbuzz:javascrpt中的简单fizzbuzz解决方案
07-12
在JavaScript中，我们可以通过一个简单的for循环和条件判断来实现这个功能。下面是一种常见的解决方案： ```javascript function fizzBuzz(n) { for (let i = 1; i ; i++) { let output = ''; if (i % 3 === 0) ...
用JavaScrpt实现文件夹简单轻松加密的实现方法图文
10-30
文件加密是保护信息安全的重要手段，在个人电脑中，对文件夹进行加密尤其常见。文章中提到的使用JavaScript进行文件夹加密的方法，虽然在实际应用中可能存在安全风险，但作为技术讲解和学习示例，依然具有一定的价值...
【面试题】什么是继承
风信子
08-04 1400
继承是面向对象中的一个非常中要的的特性。通过继承，子类可以使用父类中的一些成员变量与方法，从而能够提高代码的复用性，提高开发效率。在Java语言中，被继承的类叫基类（superclass）或父类，继承基类或父类的类叫派生类或子类（subclass)。继承是通过extends关键字来实现的，使用格式为：class 子类名 extends 父类名。 继承主要有如下几个特性： Java语言不支持多重继...
JavaScript 原型链和继承面试题
木木木森林
10-29 3590
JavaScript 原型链和继承问题 JavaScript 中没有类的概念的，主要通过原型链来实现继承。通常情况下，继承意味着复制操作，然而 JavaScript默认并不会复制对象的属性，相反，JavaScript只是在两个对象之间创建一个关联（原型对象指针），这样，一个对象就可以通过委托访问另一个对象的属性和函数，所以与其叫继承，委托的说法反而更准确些。 原型 当我们 new 了一个新的对象实例，明明什么都没有做，就直接可以访问 toString 、valueOf 等原生方法。那么这些方法是从哪里来的
关于原型 /原型链/ 继承/ 的面试题
AnlanJion的博客
06-14 1527
                                不说废话了，直接上代码function Foo(){ getName=funtion(){ alert(1) } return this; } Foo.getName=function(){ alert(2) } Foo.prototype.getName=function(){ alret(3) } var getName=fun...
面试必备系列（一）：原型链与继承
TinaSlowDown的博客
06-21 845
js的继承没有多么神秘，本质上，它的存在就是为了帮助我们复用属性和方法，并将所有对象联系起来。 一切为了简化 Brendan Eich开始设计js的时候，正值面向对象编程兴盛，受此影响，js里面的所有数据类型都是对象（准确地说，是所有引用类型）。由于最初对js的定位就是一种脚本语言，Brendan Eich希望设计得简单一点，在设计继承机制时，没有引入类的概念，而是使用new + 构造函数的方式，...
前端面试必杀技：原型、原型链以及继承（一张图搞定面试）
weixin_33787529的博客
04-15 2583
对象基础 对象介绍 什么是对象 多个数据（属性）的集合； 用来保存多个数据（属性）的容器； 属性组成 属性名：字符串（标识）； 属性值：任意类型； 属性的分类： 一般：属性值不是function，描述对象的状态； 方法：属性值为function的属性，描述对象的行为； 特别的对象 数组：属性名是0，1，2，3之类的索引； 函数：可执行的； 对象是一种复合数据类型...
【FastAdmin】全栈视角下的页面跳转实现：从原生html、javascrpt、php技术到jQuery、FastAdmin框架
田豆芽的IT技术专栏
10-09 1526
页面跳转是Web开发中的基本操作，不同的技术栈提供了不同的实现方法。本文将详细介绍在原生JavaScript、原生HTML、原生PHP、jQuery以及FastAdmin框架中实现页面跳转的各种方法，并分析每种方法的优势、劣势和适用场景。
如何在Ubuntu操作系统中安装JavaScrpt？
宁静致远
09-11 67
详细介绍了在Ubuntu操作系统中安装JavaScript运行环境的方法。
JS 常见的 6 种继承方式
roamingcode的博客
03-14 5737
探究 JS 常见的 6 种继承方式 第一种：原型链继承 原型链继承是比较常见的继承方式之一，其中涉及的构造函数、原型和实例，三者之间存在着一定的关系，即每一个构造函数都有一个原型对象，原型对象又包含一个指向构造函数的指针，而实例则包含一个原型对象的指针。 function Parent1() { this.name = 'parent1' this.play = [1, 2, 3] } function Child1() { this.type = 'child1' } Child1.pro
面试题：对于原型和继承的理解
iblackboy的博客
05-11 3212
前言:js基础中很重要的一部分内容，前端面试必问题目。主要从以下几个方面讲讲原型和继承（讲的很浅薄，只适合初学者瞅瞅，大佬求放过） 构造函数和普通函数 [[protoptype]]和prototype（[[prototype]]也可以叫做__proto__） 原型、原型链、原型对象 继承的六种方式 一、构造函数和普通函数 说到原型，一定离不开构造函数...
【重点】图解：告诉面试官什么是 JS 原型和原型链?
小鹿动画学编程
10-24 7455
写在前边 在我初学 JS 语言的继承机制原型和原型链的时候，我一直理解不了这种设计机制，再加上之前原有对 Java继承的理解，在学习 JS 继承机制的设计上踩了一个大坑，很多知识点前期都是死记硬背，无法真正的理解它的设计思想。 JS 中的继承机制思想可以说是学习 JS 的一个核心思想，更可以说是 JS 中的一个命脉，往往这些复杂、抽象的继承关系，以及专业术语、代名词确成为了困扰初学者的绊脚石。当...
JS学习笔记 原型链和利用原型实现继承
热门推荐
倪晓磊的博客
05-12 1万+
原型链原型链是一种关系，实例对象和原型对象之间的关系，关系是通过原型(__proto__)来联系的实例对象中有__proto__,是对象,叫原型,不是标准的属性,浏览器使用,并且有的游览器不支持构造函数中有prototype属性,也是对象,叫原型注意 原型中的方法是可以互相访问的实例代码 function Animal(name,age){ this.name=name; ...
前端面试题：继承的实现
欢迎来到我的博客
08-18 1441
这个是让我崩溃的那个面试题，不是说这个题有多难，而是说自己粗心吧，只是简单的看了实现继承的方式有原型继承，构造函数继承，组合继承，class继承，但是怎么实现的都不知道。昨天面试完总结了一下，索性就把它写成文章，分享加自我回顾。 1、原型链继承 首先说的继承就是原型链的继承，因为在问我继承前先问了原型和原型链，原型链的集成有什么特点呢，就是子类的prototype指向父类的一个实例。这样的话子类没有的属性方法会在他的原型中去找到，就是说子类的实例的__proto__会指向父类的实例，这个时候就可以拿到父
面试官：谈谈你对原型和原型链的理解
Tz
02-19 4676
金三银四的旺季即将拉开序幕，这段时间有朋友陆陆续续去面试，和她们沟通发现，最高频出现问题就是：谈谈你对原型和原型链的理解？ 无形之刃 最为致命。 ——影流之主 一个看似最最最基础的面试题，但是这送分题，回答的不好可能就变成了送命题。接下来就让我们一起来探讨探讨~ 基于原型的语言？ JavaScript 常被描述为一种基于原型的语言 (prototype-based language)——每个实例对象（ object ）都有一个私有属性（称之为 proto ）指向
面试题之原型、原型链、和继承
weixin_33933118的博客
03-31 1536
似乎生活中常常会遇到这种情况，你去一家公司面试，前面面的都挺好，你觉得你对基础算法的了解很好，各种排序，红黑树，二叉树，深度/广度优先算法都答出来了，leetcode上的若干困难题目也都答上来了，然后面试官说，"那么好吧，介绍一下你对原型的看法吧。" ？？？我头发。我leetcode上刷了100天，我费劲心思研究了各种算法和数据结构，你叫我讲讲原型？ 为了应对这种情况，本文通过如下代码展示下j...
JavaScript面试题-javascript如何实现继承？
weixin_44486539的博客
11-02 532
javascript如何实现继承 类式继承 将父类对象的实例赋值给子类的原型，则子类的原型可以访问父类原型上的属性和方法，以及父类构造函数中复制的属性和方法。 缺点： 子类通过其原型prototype对父类实例化，继承了父类。但当父类中的共有属性是引用类型时，会在子类中被所有的实例共用，如此在一个子类实例中更改从父类中继承过来的公有属性时，会影响到其他子类。 由于子类是通过原型prototy...
Vue开发工具使用技巧
最新发布
2509_93946471的博客
11-24 279
打开DevTools的"Events"标签页，所有组件间传递的事件都会按时间顺序列出来，连事件负载数据都能展开看详情。更绝的是，你还能手动触发事件——比如在父组件里模拟一个事件，直接测试子组件的响应逻辑，省得反复修改代码来调试。如果组件用了作用域插槽，可以在"Scoped Slots"子面板里实时查看slot传递的数据内容，比在模板里写调试代码清爽得多。路由调试经常被忽略。热重载调试时，如果发现修改代码后页面没及时更新，可以到DevTools的"Settings"里勾选"Log reloads"选项。
Python全栈开发项目——AI智能聊天机器人
qiao_yue的博客
11-24 786
本项目实现了AI聊天功能，具有语音输入和聊天背景自定义等亮点功能
深入理解JavaScript：调试、原型链与执行原理
JavaScript原理涵盖了变量、函数、原型链、执行机制、断点调试和资源管理等多个层面，理解这些原理有助于提升编程技能，优化代码性能，以及解决实际开发中的问题。熟练掌握JavaScript的这些核心概念，是每个前端...
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

艾编程前端技术

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值