对于做前端的人来说，面向对象并不常用，甚至会用不到。但是对于写Java、Python的人来说，面对对象是最常用的。我们也应该做一些了解并使用。
这里运用了武侠小说中的人物来举例。
文件的结构如下：
image.png
父类
在class.js中
class zhangsanfeng{
// 一个类肯定会有一个构造方法
// 如果没写，也会自动创建
constructor(taijijian, taijiquan) {
// 类的属性
this.taijijian = taijijian
this.taijiquan = taijiquan
}
// 类的方法
taiji() {
console.log('张三丰会' + this.taijijian);
console.log('张三丰还会' + this.taijiquan);
}
}
// 把数据导出
module.exports = zhangsanfeng
在index.vue
const zhangsanfeng = require('../class/class.js')
export default {
created() {
// 实例化类 + 调用方法
new zhangsanfeng('太极剑', '太极拳').taiji()
},
}
image.png
子类
// 类的继承 - 张无忌
class zhangwuji extends zhangsanfeng{
// 张无忌继承张三丰的太极剑和太极拳
constructor(taijijian, taijiquan, jiuyangzhenying) {
// 获得了父类的this指向
super(taijijian, taijiquan)
this.jiuyangzhenying = jiuyangzhenying
}
empty() {
console.log('张无忌除了会' + this.taijiquan + ',' + '还会完整的' + this.jiuyangzhenying)
}
}
// 把数据导出
module.exports = zhangsanfeng
module.exports = zhangwuji
const zhangwuji = require('../class/class.js')
export default {
created() {
// 实例化类 + 调用方法
new zhangwuji('太极剑', '太极拳', '九阳真经').empty()
},
}
image.png
