17370845950

本文讲解为何直接访问未初始化的对象属性会返回 undefined，以及如何通过 getter 属性实现按需计算、自动更新的年龄值，避免手动调用函数和状态不同步问题。

在 JavaScript 中，当你定义一个对象方法（如 calcAge）但从未主动调用它，该方法内部设置的 this.Age 属性就不会被创建——因此 console.log(rajat.Age) 输出 undefined 是完全符合预期的行为，而非 bug。

来看原始代码的问题所在：

const rajat = {
  birthYear: 1998,
  calcAge: function () {
    this.Age = 2025 - this.birthYear; // ✅ 只有执行此行时，Age 才会被赋值
    return this.Age;
  }
};

console.log(rajat.Age); // ❌ undefined —— 因为 calcAge() 根本没被调用！

你可能误以为 calcAge 会“自动运行”并初始化 Age，但实际上：方法不会自执行，属性不会自动声明。若想让 rajat.Age 像普通属性一样直接读取且始终准确，推荐使用 getter —— 它让属性访问语法（obj.prop）背后触发函数逻辑，既简洁又响应式：

const rajat = {
  birthYear: 1998,
  get Age() {
    return 2025 - this.birthYear; // ✅ 每次读取 Age 时实时计算
  }
};

console.log(rajat.Age); // ✅ 输出 25（2025 - 1998）

✅ 优势总结：

• 无需手动调用：rajat.Age 直接可用，语义清晰；
• 始终最新：若后续修改 rajat.birthYear，下次访问 Age 自动重算；
• 不可意外赋值：默认 getter 是只读的（尝试 rajat.Age = 30 会静默失败或报错，取决于严格模式）；
• 无副作用风险：不改变对象状态，符合函数式思维。

⚠️ 注意事项：

• 不要在 getter 中执行异步操作或高开销计算（如 DOM 查询、大型循环），因其会在每次访问时同步执行；
• 若需缓存结果（避免重复计算），可结合私有变量 + 条件判断实现 memoized getter；
• 如需支持设置（如 rajat.Age = 26），可搭配 set Age(value) 实现双向绑定逻辑。

总之，用 get 定义计算属性，是解决“方法已写但属性未生效”这类问题的最佳实践——它让对象接口更自然、更健壮、更易维护。