文章目录
- 1. Es6-类-class
- 2. Es6-class 实现继承
- 3. Es6-class 静态属性和私有属性
- 4. Es5-寄生组合式继承
1. Es6-类-class
类是创建对象的模板,用代码封装数据以处理该数据,js中的类建立在原型上。
如何定义类,首先需要关键字 class,之后紧跟着类名,类名首字母需要大写,最后是需要写上大括号。
定义公有属性,直接在类下的大括号下添加对应的变量名即可,可以为变量名设置默认值。
// 类名首字母大写
class 类名{
公有属性变量
constructor(arg1){
this.公有属性变量 = arg1
}
// 构造方法
方法名(){
// 一些代码逻辑
}
}
// 调用该类
const abc = new 类名()
如下:
class Student{
name
constructor(name){
this.name = name
}
logName(){
console.log('你好,我的名字是',this.name)
}
}
const s = new Student('张三')
s.logName()
2. Es6-class 实现继承
使用关键字 extends,表示当前类继承于某个父类。
使用关键字super,用于访问对象字面量或类的原型上的属性,或调用父类的构造方法。
class Person{
name
constructor(name) {
this.name = name
}
logName(){
console.log('你好,我的名字是',this.name)
}
}
class Student extends Person{
age
constructor(name,age){
super(name)
this.age = age
}
}
const s = new Student('张三',23)
如果子类中定义了与父类同名的方法,那么采用就近原则(重写),即子类调用该方法时调用的是子类下的该方法。
3. Es6-class 静态属性和私有属性
静态:类通过关键字static定义静态方法。不能在类的实例上调用静态方法,而应该通过类本身调用。
私有:类属性在默认情况下是公有的,但是可以使用增加哈希前缀 # 的方法定义私有类字段,声明和访问时也需要加上。定义私有的属性和方法无法在外部进行访问。
class Person{
static pName = '静态属性'
static logPName(){
console.log('静态方法')
}
#age = '私有属性'
#logName(){
console.log('私有方法')
}
logName2(){
console.log(this.#age)
this.#logName()
}
}
console.log(Person.pName)
Person.logPName()
const p = new Person()
p.logName2()
4. Es5-寄生组合式继承
通过接用构造函数来继承属性,通过原型链的混合形式来继承方法。
function Person(name){
this.name = name
}
Person.prototype.logName = function(){
console.log('我的名字是',this.name)
}
function Stu(name){
Person.call(this,name)
}
// 继承属性
const prototype = Object.create(Person.prototype,{
constructor:{
value:Stu
}
// 修改constructor的指向
})
// 继承方法
Stu.prototype = prototype
const s = new Stu('张三')
没有修改constructor的指向的运行结果
修改constructor的指向的运行结果