js-ES6学习笔记-Class(4)
1、Object.getPrototypeOf
方法可以用来从子类上获取父类。因此,可以使用这个方法判断,一个类是否继承了另一个类。
2、super
这个关键字,既可以当作函数使用,也可以当作对象使用。在这两种情况下,它的用法完全不同。
第一种情况,super
作为函数调用时,代表父类的构造函数。ES6 要求,子类的构造函数必须执行一次super
函数。
class A {} class B extends A {
constructor() {
super();
}
}
注意,super
虽然代表了父类A
的构造函数,但是返回的是子类B
的实例,即super
内部的this
指的是B
,因此super()
在这里相当于A.prototype.constructor.call(this)
。
第二种情况,super
作为对象时,指向父类的原型对象。
class A {
p() {
return 2;
}
} class B extends A {
constructor() {
super();
console.log(super.p()); //
}
} let b = new B();
子类B
当中的super.p()
,就是将super
当作一个对象使用。这时,super
指向A.prototype
,所以super.p()
就相当于A.prototype.p()
。这里需要注意,由于super
指向父类的原型对象,所以定义在父类实例上的方法或属性,是无法通过super
调用的。
ES6 规定,通过super
调用父类的方法时,super
会绑定子类的this
。
3、由于绑定子类的this
,所以如果通过super
对某个属性赋值,这时super
就是this
,赋值的属性会变成子类实例的属性。
class A {
constructor() {
this.x = 1;
}
} class B extends A {
constructor() {
super();
this.x = 2;
super.x = 3;
console.log(super.x); // undefined
console.log(this.x); //
}
} let b = new B();
上面代码中,super.x
赋值为3
,这时等同于对this.x
赋值为3
。而当读取super.x
的时候,读的是A.prototype.x
,所以返回undefined
。
4、使用super
的时候,必须显式指定是作为函数、还是作为对象使用,否则会报错。
5、子类的原型的原型,是父类的原型。因此,通过子类实例的__proto__.__proto__
属性,可以修改父类实例的行为。
js-ES6学习笔记-Class(4)的更多相关文章
- JS&ES6学习笔记(持续更新)
ES6学习笔记(2019.7.29) 目录 ES6学习笔记(2019.7.29) let和const let let 基本用法 let 不存在变量提升 暂时性死区 不允许重复声明 块级作用域 级作用域 ...
- ES6学习笔记(三):教你用js面向对象思维来实现 tab栏增删改查功能
前两篇文章主要介绍了类和对象.类的继承,如果想了解更多理论请查阅<ES6学习笔记(一):轻松搞懂面向对象编程.类和对象>.<ES6学习笔记(二):教你玩转类的继承和类的对象>, ...
- ES6学习笔记<五> Module的操作——import、export、as
import export 这两个家伙对应的就是es6自己的 module功能. 我们之前写的Javascript一直都没有模块化的体系,无法将一个庞大的js工程拆分成一个个功能相对独立但相互依赖的小 ...
- ES6学习笔记<一> let const class extends super
学习参考地址1 学习参考地址2 ECMAScript 6(以下简称ES6)是JavaScript语言的下一代标准.因为当前版本的ES6是在2015年发布的,所以又称ECMAScript 2015:也 ...
- js再学习笔记
#js再学习笔记 ##基本 1.js严格区分大小写 2.js末尾的分号可加,也可不加 3.六种数据类型(使用typeof来检验数据的类型) `typeof` - undefined: `var ...
- JS数组学习笔记
原文:JS数组学习笔记 最近在备课数组,发现很多ES5的方法平时很少用到.细节比较多,自己做了大量例子和整理,希望对大家了解JavaScript中的Array有所帮助. 概念 数组是值的有序集合.每个 ...
- es6学习笔记-class之一概念
前段时间复习了面向对象这一部分,其中提到在es6之前,Javasript是没有类的概念的,只从es6之后出现了类的概念和继承.于是乎,花时间学习一下class. 简介 JavaScript 语言中,生 ...
- ES6学习笔记<四> default、rest、Multi-line Strings
default 参数默认值 在实际开发 有时需要给一些参数默认值. 在ES6之前一般都这么处理参数默认值 function add(val_1,val_2){ val_1 = val_1 || 10; ...
- ES6学习笔记<三> 生成器函数与yield
为什么要把这个内容拿出来单独做一篇学习笔记? 生成器函数比较重要,相对不是很容易理解,单独做一篇笔记详细聊一聊生成器函数. 标题为什么是生成器函数与yield? 生成器函数类似其他服务器端语音中的接口 ...
- ES6学习笔记<二>arrow functions 箭头函数、template string、destructuring
接着上一篇的说. arrow functions 箭头函数 => 更便捷的函数声明 document.getElementById("click_1").onclick = ...
随机推荐
- 转载:TCP/IP四层模型
转载:TCP/IP四层模型 一. TCP/IP参考模型示意图 ISO制定的OSI参考模型的过于庞大.复杂招致了许多批评.与此对照,由技术人员自己开发的TCP/IP协议栈获得了更为广泛的应用. 如图所示 ...
- 不同Mesh技术的比较-总结版
引言 在过去的几年里,Mesh 网络逐渐变得流行,随之会有越来越多的无线产品面世.Mesh 网络技术作为一种无线自组网技术是物联网的核心技术.物联网的概念现在也逐渐贴近人们的生活, 据预测 2011 ...
- Windows下Mongodb安装及配置
安装文件:MongoDB-win32-x86_64-2008plus-ssl-3.2.6-signed.msi 电脑配置:win7 64位 mongodb的安装很简单,设置好安装路径后,一直Next直 ...
- CSS中text-shadow的几个好看的文字demo及其代码
最近有看到一些镂空的或者立体的文字设计图非常好看,然后想了想,应该是使用text-shadow来实现的,这里我贴出我仿的八个demo,分享给大家 首先是HTML代码 <div class=&qu ...
- java list集合运算
list集合运算 import java.io.ByteArrayInputStream; import java.io.ByteArrayOutputStream; import java.io.I ...
- Wilcoxon-Mann-Whitney rank sum test
Wilcoxon-Mann-Whitney ranksum test 无节点状况,假定为样本服从类似形状,如果不是类似形状的话,秩的比较没有过多意义. X有m个数,Y有n个数 \(H_0:\mu_1= ...
- widows下 python环境变量配置
widows下 python环境变量配置 便于cmd命令行操作,例如:直接进入Python解释器环境.使用pip安装模块等.
- MySql中插入乱码问题解决
今天在使用Java写入数据库时候,发现Insert语句和Update语句在执行过后,数据库中中文显示的是“??”,经过一番查阅,其中关键的问题在于编码格式是否统一. 其中创建表时候,每个关键字的格式都 ...
- 全网最详细的Windows系统里PLSQL Developer 32bit的下载与安装过程(图文详解)
不多说,直接上干货! 注意的是: 本地若没有安装Oracle服务端,Oracle server服务端32位,是远程连接,因此本地配置PLSQL Developer32位. PLSQL Develope ...
- gcc编译时对’xxxx’未定义的引用问题
gcc编译时对’xxxx’未定义的引用问题 原因 解决办法 gcc 依赖顺序问题 在使用gcc编译的时候有时候会碰到这样的问题,编译为.o(obj) 文件没有问题,但是编译(这一步应该是链接)为可执行 ...