在上文中,介绍了类的定义,同时举例,在构造函数(constructor
)中声明了两个实例属性;
但是构造函数中声明属性,代码不够清晰;
一、声明属性(新写法)
ES2022为类的实例属性,又规定了一种新写法。实例属性现在除了可以定义在constructor()
方法里,也可以定义在类内部的最顶层;
class Person {
name = ''
age = ''
getUserName() {
return this.name;
}
}
把实例属性定义在类的头部,代码更整齐,可以很清晰的看到所有属性,方便代码的阅读;
二、静态属性
静态属性,是类本身的属性,而不是对象的实例属性;
静态属性通过static
关键字声明;
class Person {
// 静态属性
static version = 5
}
console.log(Person.version);
let person1 = new Person()
console.log(person1.version);
静态属性只能通过
Class.propName
来调用;
三、私有属性
私有属性,是指只能在类内部访问的属性,不能再类的外部调用;
私有属性,需要在属性名之前加#
来表示;
class Person {
#id = '123456'
getId() {
return this.#id;
}
}
let person1 = new Person()
console.log(person1.getId()); // 输出123456
console.log(person1.#id); //报错
私有属性,只能在类内部调用,外部调用会报错;
四、setter
与getter
函数
在“类”的内部可以使用get和set关键字,对某个属性设置存值函数和取值函数,拦截该属性的存取行为
class Person {
#name = ''
set name(value) {
console.log('setter')
this.#name = value
}
get name() {
console.log('getter');
return this.#name;
}
}
let person1 = new Person()
person1.name = "zhangsan";
console.log('---------')
let name = person1.name;
console.log(name);
五、属性表达式
类的属性名,可以采用表达式。
let propName = "name"
class Person {
[propName] = ""
}
let person1 = new Person()
person1.name = "zhangsan";
let name = person1.name;
console.log(name);