在JavaScript中,对象的属性不仅可以是数据属性(即常规的键值对),还可以是访问器属性(accessor properties)。访问器属性不包含实际的数据值,而是定义了如何获取(get)和设置(set)一个值。这些操作由getter和setter函数执行。
get
属性(getter)
get
是一种定义在对象内部的函数,用于访问某个属性值时返回一个值。当你试图访问该属性时,getter函数会被自动调用。
使用方法:
const obj = {
_value: 42,
get value() {
console.log("Getter is being called!");
return this._value;
}
};
console.log(obj.value); // 输出: "Getter is being called!" 然后输出: 42
get
的作用:
- 计算属性:当对象的属性值取决于其他属性或某些外部因素时,可以使用getter。
- 验证和控制访问:当访问对象的某个属性时,可以使用getter来执行特定的验证或日志操作。
- 懒加载:只在首次访问属性时计算其值,并缓存该值以供后续使用。
- 代理属性:为对象的其他属性或外部数据源提供别名或特定的访问逻辑。
使用场景示例:
-
计算属性:
const circle = { radius: 5, get area() { return Math.PI * this.radius * this.radius; } }; console.log(circle.area); // 输出圆的面积
-
控制属性访问:
const person = { _age: 0, get age() { return this._age; }, set age(value) { if (value < 0) { console.warn("Age cannot be negative!"); } else { this._age = value; } } }; person.age = -5; // 输出警告: "Age cannot be negative!"
-
懒加载:
let expensiveObject = { _data: null, get data() { if (!this._data) { console.log("Fetching data..."); this._data = "Expensive Data"; } return this._data; } }; console.log(expensiveObject.data); // "Fetching data..." 然后输出: "Expensive Data" console.log(expensiveObject.data); // 直接输出: "Expensive Data"(不再"Fetching data...")
综上,getter使我们能够对对象属性的访问进行更精细的控制,并提供计算、验证、日志记录、懒加载等功能。
get会被Json序列化?
在JavaScript的JSON序列化过程中,get
和 set
的行为有所不同:
get
(getter):当你使用JSON.stringify
方法序列化一个对象时,如果该对象的某个属性是通过getter定义的,那么getter会被调用,并且返回的值会被序列化到JSON字符串中。换句话说,getter的结果会被序列化。
const obj = {
_value: 42,
get value() {
return this._value;
}
};
const jsonString = JSON.stringify(obj); // 输出为'{"_value":42,"value":42}'
如上所示,尽管value
属性是通过getter定义的,它的值(由getter返回的值)被正确地序列化到了JSON字符串中。
-
set
(setter):setter在JSON.stringify
的序列化过程中不起作用,因为它与特定的值无关。setter只定义了如何设置某个属性的值,而不定义了要序列化的具体值。因此,setter本身不影响序列化的结果。const obj = { _value: 42, get value() { return this._value; }, set value(val) { this._value = val; } }; const jsonString = JSON.stringify(obj); // 输出依然为'{"_value":42,"value":42}'
总结:在JSON.stringify
的序列化过程中,getter会被调用并将其返回的值序列化,而setter则被忽略。