js中的get和set方法

发表于 更新于 分类于 阅读次数：

get和set的介绍

get 和 set方法可以使用在对象或者构造函数中，但不能出现在普通的function里。
vue中的计算属性computed默认使用的就是vue已经封装好的get方法。

get和set的使用方法

  1. get和set是方法，因为是方法，所以可以进行判断

  2. get一般是要返回的；而set是设置，不用返回

  3. get 和 set的方法名可以重名

  4. set方法必须要有形参，否则报错

  5. 如果调用对象内部的属性约定的命名方式是变量名前加_

对象的例子

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
let obj={
    a:18,
    b:2,
    get sum(){
        return this.a + this .b;
    },
    set changeBValue(val) {
         this.b = val;
    }
}
obj.a  // 18
obj.b  // 2
obj.sum // 20
obj.changeBValue = 10
obj.b  // 10
obj.sum // 28

构造函数的例子

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
class P {
    constructor(){
        this.a = 1;
        this.b = 2;
    }
    get sum(){
        return this.a + this.b;
    }

    set sum(val) {
        this.a = val;    
    }
}
let p = new P();
console.log(p)  //{a: 1, b: 2}
p.sum   // 3
p.sum =  3;  
p.sum   // 5
console.log(p)  // {a: 3, b: 2}

即get是对象的属性值返回的方法，set是属性值修改的方法

相关博客