一起养成写作习惯!这是我参与「掘金日新计划 · 4 月更文挑战」的第14天,点击查看活动详情。
ts 中的修饰符主要对起到约束成员作用。
readonly(只读修饰符)
普通使用
let num: readonly number[] = [1, 2, 3];
num = [2, 3, 4] //可以重新赋值
num.push(5);//error! 由于数组是只读的, 所以使用 push 是错误的
注意:这里的 readonly number[] 修饰的是值是一个只读的数组, 而不是修饰的变量, 所以在这里一切能改变数组数据的方法都不能使用, 例如: push、pop、splice、sort、shift、unshift、都不能使用, 以及 num[0] = xxx 也是不行的。
如果你想 修饰 num 不能从重新被赋值, 使用 const num 。
在接口中使用
interface User {
readonly name: string //在成员前面加上修饰符
readonly age: number[] //这里表示的是 age 一但赋值不能修改
test: readonly string[] //和上面的普通使用一样
readonly num: readonly number[] //相当于第一次赋值之后 就只能获取值, 其他操作全部进制
}
const u:User = {
name: 'John', // 在第一次赋值之后, name 只能获取, 不能改变值
age: [30],
test: ['2'],
num:[1,2,3]
}
u.name = 'Jane' // error! 不支持
u.age = [1] // error! 不支持
u.test = ['1'] //success 支持
u.num.push(1) // error! 不支持
u.num. = [1,4,5] // error! 不支持
在类中使用
class User {
//===== S 属性列表 =====
readonly name: string //readonly
age: number
sex: '男' | '女' = '男'
//===== E 属性列表 =====
constructor(name, age) {
this.name = name
this.age = age
}
}
访问修饰符
访问修饰符可以控制类中的某个成员的访问权限。
public:默认的访问修饰符, 公开的, 所有代码均可以访问
class User {
name: string //readonly
age: number
sex: '男' | '女' = '男'
}
上面的写法相当于
class User {
public name: string //readonly
public age: number
public sex: '男' | '女' = '男'
}
private: 私有的, 只有在类中访问
class User {
name: string
age: number
sex: '男' | '女' = '男'
private test:string = '我只能在内部使用' //私有属性
constructor(name, age) {
this.name = name
this.age = age
}
printTest(){
console.log(this.test) //在类中可以访问
}
}
在外部不能访问
const u: User = new User('张三', 18)
u.test //这里访问不到 test 属性
修饰符配合类的语法糖
class User {
name: string
constructor(name: string) {
this.name = name
}
}
这种对 name 进行机械化的处理可以使用 修饰符配 语法糖简写的
class User {
constructor(public name: string) {
}
}
class User {
constructor(private name: string) {
}
}
这种写法等同于上面机械化操作
protected: 受保护的成员
protected 只能在自身类和子类中访问
举个栗子
class Person {
protected name: string = '人';
}
class Student extends Person {
sayHello(){
console.log(this.name); //在子类并且是内部访问
}
}
const s = new Student();
s.name = '学生';//error 不能在外部访问