不能直接用 Object.defineProperty 逐个定义，因为批量配置带 get/set 的属性时重复写 obj 参数且易漏 configurable: true；Object.defineProperties 要求描述符对象结构严格，混用 value 和 get/set 会报错，应只保留 get/set 并设 configurable: true，用 WeakMap 存内部状态，getter 中 this 指向调用对象，避免硬编码对象名，注意性能与兼容性。
为什么不能直接用 Object.defineProperty 逐个定义？
因为业务对象常需批量配置多个带 get/set 的属性，比如表单模型中 fullName 依赖 firstName 和 lastName，同时还要控制 age 的取值范围。逐个调用 Object.defineProperty 不仅重复写 obj 参数，还容易漏掉 configurable: true 导致后续无法修改描述符——尤其在开发阶段频繁调试时，这个限制会卡住你。
Object.defineProperties 的参数结构必须严格对齐
第二个参数（属性描述符对象）的每个 key 必须是目标对象上要定义的属性名，value 必须是完整描述符对象；不能省略 value 或 get/set，否则该属性会被当成数据属性而非访问器属性。
常见错误现象：Uncaught TypeError: Invalid property descriptor. Cannot both specify accessors and a value or writable attribute —— 这是因为混用了 value 和 get。
实操建议：
- 每个属性描述符里只保留
get和/或set，删掉value、writable - 显式写
configurable: true，方便后续热更新逻辑 - 如果需要初始化内部状态（如缓存），用闭包或 WeakMap 存储，别塞进
this上污染实例
const user = {};
const internal = new WeakMap();
Object.defineProperties(user, {
fullName: {
get() {
const data = internal.get(this) || {};
return `${data.firstName || ''} ${data.lastName || ''}`.trim();
},
set(val) {
const [first, last] = val.split(/\s+/).filter(Boolean);
const data = internal.get(this) || {};
internal.set(this, { ...data, firstName: first, lastName: last });
},
configurable: true
},
age: {
get() {
return internal.get(this)?.age || 0;
},
set(val) {
const num = Number(val);
if (isNaN(num) || num < 0 || num > 150) throw new RangeError('age must be 0–150');
const data = internal.get(this) || {};
internal.set(this, { ...data, age: num });
},
configurable: true
}
});
Getter/Setter 中的 this 指向和陷阱
在 get/set 函数里，this 是调用时的对象，不是定义时的上下文。这意味着如果你把描述符对象复用到多个实例上，而内部又依赖了外部变量（比如直接引用 user），就会出错。
使用场景：封装可复用的属性模板，比如给多个 API 响应对象统一加 isLoaded 计算属性。
实操建议：
- 避免在
get/set里硬编码对象名，一律通过this访问 - 不要在描述符对象里直接写
user.xxx，那会绑定死 - 若需跨属性联动（如改
email自动清空isValid），确保所有相关属性都在同一defineProperties调用中定义，否则触发顺序不可控
性能与兼容性注意点
现代浏览器中，Object.defineProperties 本身开销极小，但频繁触发 getter（尤其含复杂计算或副作用）会影响渲染性能。IE9+ 支持该 API，但 IE9 不支持在 DOM 元素上使用（会报错），Node.js 0.12+ 完全可用。
容易被忽略的地方：V8 引擎会对未被优化的 getter 做去优化（deoptimization），尤其是当 getter 内部有 try/catch、arguments 或动态属性访问（如 this[key]）时。如果发现响应变慢，先检查 getter 是否写了这些。
建议：
- 纯计算型 getter 尽量保持无副作用、无动态键访问
- 需要缓存结果的，用闭包变量或 WeakMap，别用
this._cache（可能被业务代码覆盖） - 服务端渲染（SSR）环境注意：某些 getter 可能依赖浏览器全局对象（
window、document），需提前 guard
