getter和setter是访问器属性(accessor property)。它们本质上是用于获取和设置值的函数,但从外部代码来看就像常规属性。
getter 和 setter 的好处
满足封装的特性
getter的作用就是给对象加了一层拦截,保护属性本身不被篡改。比如有些属性只是可读但不可写,那么只提供它的getter方法就好,意思就是某些属性只能单一方向的被访问,getter和setter就是提供这样的接口,
保证数据的安全性:
通过 getter 方法,可以只读取属性值,而不改变其定义的属性值。通过 setter 方法,可以对传入的参数进行验证或处理,防止非法或错误的赋值 setter 也可对新的值进行过滤,判断是否符合条件
实现属性的动态绑定:
通过 getter 和 setter 方法,可以将属性值的获取和设置分别绑定到方法上,称之为“存取器”。这样,可以实现属性值的动态计算或更新,而不是固定的值
例子
class Person {
constructor({name, age}) { //解构赋值
this.name = name;
this.age = age;
}
// getter方法
get info() {
console.log("get info:" + this.name, this.age);
}
// setter方法
set info(value) {
console.log("set info:", value)
let part = value.split(",")
this.name = part[0]
this.age = part[1]
// console.log(this.name, this.age)
}
}
let person = new Person({name: "tim", age: 34});
person.info //通过访问属性的方式访问对象内部
person.info = "bob 34" //通过访问属性的方式给数据赋值
output
get info:tim 34
set info: bob 34
图示
如果直接访问info的话就是访问getter
给info 赋值, 就是给传参给setter里的value
给setter 加个验证
给setter的数据加一个限制,姓名不长度不能为1,年龄介于0~100之间
set info(value) {
console.log("set info:", value)
let part = value.split(",")
let age = parseInt(part[1])
if (part[0].length <= 1) {
throw new Error("姓名长度大于1")
} else {
this.name = part[0]
}
if (age > 0 && age < 100) {
this.age = age
} else {
throw new Error("年龄大于0 小于100")
}
// console.log(this.name, this.age)
}
person.info = "tt,0"
output
C:\Users\zy\dev\proxy\getter.js:26
throw new Error("年龄大于0 小于100")
^