当前位置:网站首页>ES6学习笔记(二):教你玩转类的继承和类的对象
ES6学习笔记(二):教你玩转类的继承和类的对象
2020-11-06 20:48:00 【叫我詹躲躲】
文章目录
继承
程序中的继承: 子类可以继承父类的一些属性和方法
class Father {
//父类
constructor () {
}
money () {
console.log(100)
}
}
class Son extends Father {
//子类继承父类
}
let son = new Son()
son.money() // 100
son.
super关键字
super关键字用于访问和调用对象父类上的函数,可以通过调用父类的构造函数,也可以调用父类的普通函数
class Father {
//父类
constructor (x, y) {
this.x = x
this.y = y
}
money () {
console.log(100)
}
sum () {
console.log(this.x + this.y)
}
}
class Son extends Father {
//子类继承父类
constructor (x, y) {
super(x, y) //调用了父类中的构造函数
}
}
let son = new Son(1,2)
son.sum() // 3
son.
继承的特点:
- 继承中,如果实例化子类输出一个方法,先看子类有没有这个方法,如果有就先执行子类,(就近原则)
- 继承中,如果子类里面没有,就去查找父类有没有这个方法,如果有,就执行父类的这个方法
- 在子类中,可以用super调用父类元素的方法
class Father {
say() {
return '我是父元素'
}
sing() {
return '父元素唱一首歌'
}
}
class Son extends Father {
say() {
console.log('我是子元素')
}
sing() {
console.log(super.sing())
}
}
var son = new Son()
son.say() //我是子元素
son.sing() //
子元素可以继承父元素的方法的同时,子元素也可以扩展自己的其他方法,子类在构造函数中用super调用父类的构造方法时候,必须放在子类的this之前调用
class Father {
constructor(x, y) {
this.x = x
this.y = y
}
sum() {
console.log(this.x + this.y)
}
}
class Son extends Father {
constructor(x,y) {
//利用super 调用父类的构造函数
super(x,y)
this.x = x
this.y = y
}
subtract() {
console.log(this.x - this.y)
}
}
let son = new Son(5,3)
son.subtract() // 2
son.sum() //8
ES6中的类和对象的4个注意点:
- 在ES6中类没有变量提升,所以必须先定义类,才能通过类实例化对象
- 类里面的共有属性和方法一定要加this使用
- 类里面的this指向问题
- constructor里面的this指向实例对象,方法里面的this向这个方法的调用者
总结
这篇文章主要分享了,关于类的继承、继承需要的用到的extends,super、ES6中的类和对象的注意点等。
版权声明
本文为[叫我詹躲躲]所创,转载请带上原文链接,感谢
https://my.oschina.net/u/3995971/blog/4558932
边栏推荐
- Synchronous configuration from git to consult with git 2consul
- Save the file directly to Google drive and download it back ten times faster
- 10 easy to use automated testing tools
- Word segmentation, naming subject recognition, part of speech and grammatical analysis in natural language processing
- Basic principle and application of iptables
- “颜值经济”的野望:华熙生物净利率六连降,收购案遭上交所问询
- H5 makes its own video player (JS Part 2)
- Aprelu: cross border application, adaptive relu | IEEE tie 2020 for machine fault detection
- 6.2 handleradapter adapter processor (in-depth analysis of SSM and project practice)
- 從小公司進入大廠,我都做對了哪些事?
猜你喜欢
中小微企业选择共享办公室怎么样?
如何玩转sortablejs-vuedraggable实现表单嵌套拖拽功能
This article will introduce you to jest unit test
Existence judgment in structured data
快快使用ModelArts,零基础小白也能玩转AI!
axios学习笔记(二):轻松弄懂XHR的使用及如何封装简易axios
Troubleshooting and summary of JVM Metaspace memory overflow
加速「全民直播」洪流,如何攻克延时、卡顿、高并发难题?
ES6学习笔记(五):轻松了解ES6的内置扩展对象
比特币一度突破14000美元,即将面临美国大选考验
随机推荐
Summary of common algorithms of binary tree
Elasticsearch database | elasticsearch-7.5.0 application construction
6.3 handlerexceptionresolver exception handling (in-depth analysis of SSM and project practice)
Do not understand UML class diagram? Take a look at this edition of rural love class diagram, a learn!
IPFS/Filecoin合法性:保护个人隐私不被泄露
6.1.1 handlermapping mapping processor (1) (in-depth analysis of SSM and project practice)
6.5 request to view name translator (in-depth analysis of SSM and project practice)
Computer TCP / IP interview 10 even asked, how many can you withstand?
Listening to silent words: hand in hand teaching you sign language recognition with modelarts
Vue 3 responsive Foundation
至联云分享:IPFS/Filecoin值不值得投资?
Wiremock: a powerful tool for API testing
Existence judgment in structured data
如何玩转sortablejs-vuedraggable实现表单嵌套拖拽功能
Every day we say we need to do performance optimization. What are we optimizing?
Save the file directly to Google drive and download it back ten times faster
How long does it take you to work out an object-oriented programming interview question from Ali school?
Arrangement of basic knowledge points
How to select the evaluation index of classification model
H5 makes its own video player (JS Part 2)