/*
-
输出
-
吃饭
-
游泳
*/
[]( )继承与多态------------------------------------------------------------------------1. 子类继承父类特征子类 extends 父类2. 当需要父类参数传递时，用子类也可以，这就是多态/*
-
继承：子类继承父类
-
多态：当需要父类参数时，传入子类的也可以
-
*/
class Animal{
name: stringconstructor(name:string) {this.name=name}run(distance=0){console.log(this.name+"跑了" + distance + "米")}
}
class Dog extends Animal{
constructor(name:string="dog") {super(name);}run(distance=5){console.log(this.name+"跑了" + distance + "米")}
}
class Cat extends Animal{
constructor(name:string="cat") {super(name);}run(distance=10){console.log(this.name+"跑了" + distance + "米")}
}
const animal1=new Animal(“aniaml”)
animal1.run()
const dog1=new Dog()
dog1.run()
const cat1=new Cat()
cat1.run()
const dog2:Animal=new Dog() // 当使用了父元素类型Animal也没报错，这就是因为多态
dog2.run()
/*
-
输出
-
aniaml跑了0米
-
dog跑了5米
-
cat跑了10米
-
dog跑了5米
*/
[]( )类的修饰符------------------------------------------------------------------------1. 修饰构造函数，属性，方法是否可以被外部访问| 修饰符 | 作用范围 || :-: | :-: || public | 公共的，默认属性，都可以访问 || protected | 外部无法访问，子类可以访问 || private | 内部使用，外部无法访问，子类也无法访问 || readonly | 只读属性，添加后外部就不能修改了，只能在构造函数内修改 |class Person{
readonly name: stringconstructor(name: string) {this.name=name}showName(){//在类中的普通方法中也不能对只读属性的name重新赋值// this.name="rose"console.log(this.name)}
}
//实例化对象
const p1: Person=new Person(“jack”)
p1.showName()
//输出jack
// p1.name=“rose”
/*
- 这里应为实在类的外部，name为只读的，所以不能再对name赋值
*/
3. 参数属性* 构造函数中的参数如果使用readonly修饰后，那么参数就叫参数属性* 构造函数中的参数如果使用readonly修饰后，那么类中就有了一个参数成员* 构造函数中的参数如果使用readonly修饰后，外部也是无法访问的* 构造函数中的参数如果使用其他修饰后，那么类中就有了一个相应作用范围的参数成员class Person{
//虽然类中并没name属性，但这里使用了readonly属性修饰，在类中隐式添加了一个name属性constructor(readonly name: string='jack') {this.name=name}showName(){console.log(this.name)}
}
//实例化对象
const p1: Person=new Person()
p1.showName()
[]( )存取器----------------------------------------------------------------------TypeScript 支持通过 getters/setters 来截取对对象成员的访问，它能帮助你有效的控制对对象成员的访问class Person{
private firstName: stringprivate lastName: stringconstructor(firstName,lastName) {this.firstName = firstNamethis.lastName = lastName}get fullName(){return this.firstName+ "-" + this.lastName}set fullName(value){let val = value.split("-")this.firstName = val[0]this.lastName = val[1]}
}
const p1: Person=new Person(“东方”,“不败”)
console.log(p1.fullName)
p1.fullName = “西门-吹雪”
console.log(p1.fullName)
/*
-
输出
-
东方-不败
-
西门- 吹雪
Vue 面试题
1.Vue 双向绑定原理
2.描述下 vue 从初始化页面–修改数据–刷新页面 UI 的过程？
3.你是如何理解 Vue 的响应式系统的?
4.虚拟 DOM 实现原理
5.既然 Vue 通过数据劫持可以精准探测数据变化,为什么还需要虚拟 DOM 进行 diff 检测差异?
6.Vue 中 key 值的作用？
7.Vue 的生命周期
8.Vue 组件间通信有哪些方式?
9.watch、methods 和 computed 的区别?
10.vue 中怎么重置 data?
11.组件中写 name 选项有什么作用？
12.vue-router 有哪些钩子函数?
13.route 和 router 的区别是什么？
14.说一下 Vue 和 React 的认识，做一个简单的对比
15.Vue 的 nextTick 的原理是什么？
16.Vuex 有哪几种属性?
17.vue 首屏加载优化
18.Vue 3.0 有没有过了解？
19.vue-cli 替我们做了哪些工作？
的生命周期
8.Vue 组件间通信有哪些方式?
9.watch、methods 和 computed 的区别?
10.vue 中怎么重置 data?
11.组件中写 name 选项有什么作用？
12.vue-router 有哪些钩子函数?
13.route 和 router 的区别是什么？
14.说一下 Vue 和 React 的认识，做一个简单的对比
15.Vue 的 nextTick 的原理是什么？
16.Vuex 有哪几种属性?
17.vue 首屏加载优化
18.Vue 3.0 有没有过了解？
19.vue-cli 替我们做了哪些工作？
[外链图片转存中…(img-zkYVZ2gN-1720101823341)]
