JS中的getter和setter

Posted 2021-02-06 提升自己，才有选择的能力和勇气

对象有两种属性：（1）数据属性，就是我们经常使用的属性（2）访问器属性，也称存取器属性

存取器属性就是一组获取和设置值的函数。在ECMAScript5中，属性值可以getter和setter方法获取和设置，因此getter和setter定义的属性被称为存取器属性。getter负责获取值，它不带任何参数。setter负责设置值，在它的函数体中，一切的return都是无效的。

var o = {
  get val(){
    /*函数体*/
    return ;
  },
  set val(n){
    /*函数体*/
  }
}

 

在对象内如果设置了存取器属性，如果某一变量只声明了getter方法，那么它仅仅只可读而不可写。如果只声明了setter方法，那么读到的该变量值永远都是undefined。

//只声明getter方法时不能通过getter方法来改变变量值
var obj = {
  a: 3,
  b: 8,
  get val() {
    return this.a;
  }
}

console.log(obj.val);     //3
obj.val= 100;
console.log(obj.val); //3

//只声明setter方法时不能获取变量的值
var obj = {
  a: 3,
  b: 8,
  set val(n) {
    this.a = n;
  }
}
console.log(obj.val);     //undefined
obj.val= 100;
console.log(obj.val); //undefined
console.log(obj.b);　　//8   其他变量不受影响

//同时声明两种方法
var obj = {
  a: 3,
  b: 8,
  get val(){
    return this.a;
  },
  set val(n) {
    this.a = n;
  }
}
console.log(obj.val);     //3
obj.val= 100;
console.log(obj.val); //100

setter和getter方法在定义时并未用function关键字，事实上这里的get或set，你可以理解为两种不同状态下的function：包容的一面（写），安全的一面（读）。当不通过存取器属性而是直接按平时习惯拿数据属性时，获取和设置都不受影响，或许这两个方法时为了以后的安全设计的吧。