super与this

目录

  • 原型链与继承
    • 继承中的原型链
  • class
  • super与this

我们可能会对一个问题感到好奇:为什么在派生类中,我们需要在调用this之前调用super。我们通常将其视为一种规范,却很少深入探究这个规范的真正意义。许多人认为super不过是ES6之前继承方式的语法糖。但实际上,这种看法是不准确的。要真正理解super的必要性,我们必须探究JavaScript中继承机制的内部工作原理

原型链与继承

JavaScript中,继承的实现本质上是通过原型链的查找机制来完成的。这个过程涉及将一个类(如Person)的实例作为另一个类(如Student)的原型。这样,Student类实例就能够访问Person类的属性和方法,从而实现继承

class Person {
}
class Student extends Person {
}
const p1 = new Student()
const p2 = new Person()
console.log(p1)
console.log(p2)

我们观察一下p1和p2的原型链
原型链
我们先来观察一下p2的原型链关系,因为p2是直接通过new Person得到的,Person是基类,所以不存在继承关系,p2.__proto__直接指向了Person.prototypePerson.prototype.__proto__直接指向了Object.prototypeObject.prototype.__proto__直接指向了null

原型图

继承中的原型链

再看看p1的原型链,因为p1通过new Student得到,,所以p1.__proto__Student.prototype,而Student继承了Person,所以Student.prototype.__proto__指向了Person.prototype

原型链

粗看似乎和Person的原型链并没有什么不同,但仔细观察就会发现Student.__proto__指向了Person自身,即指向了Person.prototype.constructor,这一点似乎与我们之前在ES5实现的继承并不相同

class

那么,为什么class中的继承与ES5中的继承不一致呢
我们知道,在class中如果使用了extends就需要在constructor中调用super方法,而且必须在派生类构造方法返回前且访问this前调用

在面向对象编程语言中,继承机制通常首先确保父类的构造函数被正确调用以初始化this对象,然后这个this对象会被传递给子类。这种做法被认为是更安全的

相比之下,在ES5及之前的JavaScript版本中,继承可以通过借用构造函数组合寄生继承实现,这些方式允许开发者选择是先调用父类构造函数还是子类构造函数。这种灵活性使得JavaScriptES6引入class关键字之前,虽然具有对象构造的能力,但并不完全符合传统意义上的面向对象编程语言的规范

super与this

那么回到我们最开始的问题 ,为什么派生类在调用super前不能访问this
我们可以认为,在ES6中,ECMA委员会对类的继承机制进行了调整,从直接由子类发出this给父类的情况变为了从父类发出this并依次传递到子类,我们可以合理认为super本身是有返回值的,而这个返回值就是this,所以我们可以进一步得出子类的this是由父类得到的,所以在访问this前必须调用super

let obj = null
class Person {constructor() {this.name = "person"}getName() {return this.name}
}
class Student extends Person {constructor() {obj = super()console.log(obj === this)}
}
const p1 = new Student()
console.log(p1 === obj)

结果

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

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

相关文章

python作业 切片逆转

题目: (反转显示一个整数)编写下面的函数,反向显示一个整数。 列如:reserse(3456)。编写一个测试程序,提示用户输入一个整数,然后显示它的反向数。 第一步定义一个函数: def rev…

Django——Auth模块以及admin站点

Django——Auth模块 一、Auth 模块 Auth 用户认证,本质上也是设置 Session。 Django 认证系统同时处理认证和授权认证:验证一个用户是否为 django 声明的用户,如果是可以进行登录授权:决定一个已经验证的用户有哪些功能是允许操…

Python3操作redis百万级数据迁移,单机到单机,集群到集群

Python3操作redis大量数据迁移 脚本 背景使用前使用注意事项脚本总结 背景 之前写过一个用python迁移redis的脚本,但是对于小批量的数据、单节点的,还可以用。对于大量数据,集群模式的就不太适合了。所以写了下面的脚本,而且做了…

【前端开发基础知识快速入门】

前端开发基础知识&快速入门 一、VSCode 使用1.1 安装常用插件1.2 创建项目1.3 创建网页1.4 运行效果二、ES62.1 简介2.2 什么是 ECMAScript2.3 ES6 新特性2.3.1 let 声明变量2.3.2 const 声明常量(只读变量)2.3.3 解构表达式2.3.4 字符串扩展2.3.5 函数优化2.3.6 对象优化…

Ubuntu中apt更新时报错The certificate issuer is unknown的解决办法

Ubuntu 22.04更新apt出现The certificate issuer is unknown的解决办法 问题描述解决办法讨论 问题描述 使用docker安装Ubuntu22.04,官网给出的镜像只是一个裸系统,预装软件很少。换阿里源以后,apt update,出现如下报错&#xff…

【C语言】动态内存分配(一)

目录 1.为什么要有动态内存分配 2.malloc和free 2.1malloc 2.2free 1.为什么要有动态内存分配 我们已经掌握的内存开辟方式有: 但是上述的开辟空间的方式有两个特点: ⭐空间开辟大小是固定的。 ⭐数组在申明的时候,必须指定数组的长度,数组空间一旦…

GateWay具体的使用之全局token过滤器

1: 创建过滤器类 首先,你需要创建一个实现了GatewayFilter接口或者继承AbstractGatewayFilterFactory类的过滤器类。这里以实现GatewayFilter接口为例,创建一个全局token过滤器。 package com.by.filter;import cn.hutool.core.collection.CollUtil; imp…

SQL提升

1. SQL TOP 子句 TOP 子句用于规定要返回的记录的数目。 对于拥有数千条记录的大型表来说,TOP 子句是非常有用的。 **注释:**并非所有的数据库系统都支持 TOP 子句。 1.1 SQL TOP 语法 SQL Server 的语法: SELECT TOP number|percent c…

OpenCV C++实现区域面积筛选以及统计区域个数

目录 1、背景介绍 2、代码实现 2.1 获取原图 2.1.1 区域图像imread 2.1.2 具体实现 2.2 获取图像大小 2.3 阈值分割 2.3.1 阈值分割threshold 2.3.2 具体实现 2.4 区域面积筛选 2.4.1 获取轮廓findContours 2.4.2 获取轮廓面积contourArea 2.4.3 填充区域fil…

http请求与响应

目录 HTTP请求格式 HTTP响应格式 HTTP请求格式 请求行:请求数据第一行(请求方式,资源路径,协议) 请求头:第二行开始,格式key:value 请求体:POST请求,存放在请求参数 非restful方式&#xff1…

浅谈大数据时代下的电商风控||电商数据API接口

抢抢抢!最后1天,双十一直播活动来啦!抢直播专属优惠…… 视频号 随着大数据时代的兴起,互联网电商风控已经从无风控、人工抽取规则为主的简易规则模型发展到当前基于大数据的风控。与金融风控不同,互联网电商风控呈现出…

详解MyBatis配置文件开发与注解式开发

首先呢,五一快来啦!提前祝各位宝子们五一玩得开心,然后讲解一下MyBatis框架呀!!! 一.框架介绍 MyBatis 的主要特点 二.MyBatis工作流程 1. 初始化和配置 2. 创建 SqlSessionFactory 3. 获取 SqlSession 4. 映射器绑定 5. 执行操作 6.…

力扣1518. 换水问题

题目链接 力扣1518. 换水问题 简单方法(模拟) 思路 对换水进行模拟,每次喝完 n u m E x c h a n g e numExchange numExchange 瓶水后就去换一瓶水,直到不能再兑换为止,也就是剩余水的数量小于 n u m E x c h a n g e numExchange numE…

vscode中jsconfig.json文件首行提示错误

在使用react框架开发前端时,文件jsconfig.json首行提示错误,打开设置,勾选如下图这项

jupyter lab 如何安装和启动

Jupyter Lab 是一种基于 web 的交互式开发环境,用于 Jupyter 笔记本。与传统的 Jupyter 笔记本相比,它提供了更友好、更可扩展的界面,具有代码单元格、markdown 单元格、小部件和文件浏览器等功能。 1.安装 Jupyter Lab: 打开终端或命令提示…

【Go】通道作为函数参数

目录 一、Pings Pongs例子程序 二、使用通道进行任务分配和结果收集 三、使用通道进行错误处理 四、使用通道实现速率限制 五、使用通道进行数据同步 总结 共性 解决的问题类型 实际应用示例 Go 语言中,通道(channel)是实现协程&…

Linux 第十一章

🐶博主主页:ᰔᩚ. 一怀明月ꦿ ❤️‍🔥专栏系列:线性代数,C初学者入门训练,题解C,C的使用文章,「初学」C,linux 🔥座右铭:“不要等到什么都没有了…

Java 图形化框架 - AWT、Swing

文章目录 关于 AWTAWT继承体系 关于 Swing关于 JFC 和 Swing Swing 组件组件层次Swing组件和AWT组件的对应关系:Swing组件按照功能来分类: Java使用AWT和Swing相关的类可以完成图形化界面编程,其中AWT的全称是抽象窗口工具集(Abstract Window…

北大发现了一种特殊类型的注意力头!

检索头的发现或许将有力地帮助大模型领域在提高长上下文推理能力、减少幻觉和压缩KV缓存方面的研究。 从 Claude100K 到 Gemini10M,我们正处于长上下文语言模型的时代。如何在长上下文中利用任何输入位置的信息?北大联合另外四所高校发现了一种特殊类型…

(四)后台-对文章的增删改查操作

(四)后台-对文章的增删改查操作 文章目录 (四)后台-对文章的增删改查操作一、RESTFUL API二、路由处理1、/home 后台首页页面2、/upload 文件上传功能 三、文章模块1、/list 获取文章列表 GetList2、/ 新增|编辑文章 SaveOrUpdate…