JavaScript系列之访问器属性

---

包含getter和setter的函数，读取访问器时候回调取getter，设置访问器的时候调取setter；

一、访问器属性原理

访问器属性是专门控制对一个数据属性读写操作的特殊属性。

二、应用场景

设置一个属性值会导致一些其他变化发生，vue中数据响应式就是用的这一原理。

三、示例

class Person {
    
    
	#age = 25;
	constructor(name) {
    
    
		this.name = name;
		// this.height = "178cm";
	}
	get height() {
    
    
		return "178cm";
	}
	set height(newVal) {
    
    
		console.log(newVal);
	}
	// 或者age
	get age() {
    
    
		console.log("读取的时候调用get");
		return this.#age;
	}
	// 设置age
	set age(newVal) {
    
    
		console.log("设置的时候调用set", newVal);
		this.#age = newVal;
	}
}
let zhangsan = new Person("张三");
console.log(zhangsan.age); // 读取age属性
zhangsan.age = 30;

对一个私有属性定义了访问器属性后，就可以通过实例访问到私有属性了。

参考

1. js的访问器属性和获取dom元素两种方法

写在最后

如果你感觉文章不咋地//(ㄒoㄒ)//，就在评论处留言，作者继续改进；o_O???
如果你觉得该文章有一点点用处，可以给作者点个赞；\\*^o^*//
如果你想要和作者一起进步，可以微信扫描二维码，关注前端老L；~~~///(^v^)\\\~~~
谢谢各位读者们啦(^_^)∠※！！！