ES6-Class类下
2024-10-21 11:43:19
前面super的源码：
查看代码
<script>
// 1.作为函数调用
// 代表父类的构造方法，只能用在子类的构造方法中，用在其他地方就会报错
// super 虽然代表了父类的构造方法，但是内部的 this 指向子类的实例
// class Person {
// constructor(name) {
// this.name = name;
// console.log(this);
// }
// }
// class Programmer extends Person {
// constructor(name, sex) {
// super(name, sex);
// }
// // hi() {
// // super(); // ×
// // }
// }
// // new Person();
// new Programmer();
// 2.作为对象使用
// 2.1.在构造方法中使用或一般方法中使用
// super 代表父类的原型对象 Person.prototype
// 所以定义在父类实例上的方法或属性，是无法通过 super 调用的
// 通过 super 调用父类的方法时，方法内部的 this 指向当前的子类实例
// class Person {
// constructor(name) {
// this.name = name;
// console.log(this);
// }
// speak() {
// console.log('speak');
// // console.log(this);
// }
// static speak() {
// console.log('Person speak');
// console.log(this);
// }
// }
// class Programmer extends Person {
// constructor(name, sex) {
// super(name, sex);
// // console.log(super.name);
// // super.speak();
// }
// // hi() {
// // super(); // ×
// // }
// speak() {
// super.speak();
// console.log('Programmer speak');
// }
// // 2.2.在静态方法中使用
// // 指向父类，而不是父类的原型对象
// // 通过 super 调用父类的方法时，方法内部的 this 指向当前的子类，而不是子类的实例
// static speak() {
// super.speak();
// console.log('Programmer speak');
// }
// }
// // new Person();
// // new Programmer();
// Programmer.speak();
// 3.注意事项
// 使用 super 的时候，必须显式指定是作为函数还是作为对象使用，否则会报错
class Person {
constructor(name) {
this.name = name;
}
speak() {
console.log('speak');
}
}
class Programmer extends Person {
constructor(name, sex) {
super(name, sex);
// console.log(super);
// console.log(super());
// console.log(super.speak);
}
}
</script>七。class的应用
通过键盘左右键切换幻灯片
应用思路：
基类写底层都适用的功能，上一张下一张切换这种、比如pc端幻灯片，移动端幻灯片继承基类，子类中写具体pc端代码或者移动端代码
基类constructor里面传两个形参，接收slider 这个DOM元素以及用户参数（用户没有传参就用默认参数），然后子类继承父类，子类的构造方法中执行super（），调用父类的构造方法，执行里面的函数体，里面实现了切换图片的部分逻辑；子类的构造方法中添加this.a()
在子类中添加方法a，该方法执行后，就给左右箭头注册了事件；
最新文章
- int与Integer的爱恨情仇
- iOS杂谈－图片拉伸的实现
- mysql 和字符串截取相关的知识点
- ?this&函数自身的引用
- HDU 1098 Ignatius's puzzle
- leetcode处女作
- django的路由系统
- mvp架构解析
- OpenGL+OpenCV实现立方体贴图
- react native原生模块引用本地jar包
- python3 os模块
- Hibernate validator使用和自定义validator及整合Spring MVC
- day31 logging 日志模块
- 用webstorm开发前端项目前的一些配置
- Dede更新提示DedeTag Engine Create File False的解决办法
- Revit API遍历系统族布置喷头
- Delphi调用网页美化SQL
- 读Understanding the Linux Kernel, 3rd Edition有感
- [POI2010]Divine Divisor
- Sql--IDENTITY()自动增长列