JavaScript对象初始化时如何将值设为已声明的前序键对应的值

JavaScript的对象字面量在初始化完成前，无法直接引用同个对象内部的其他属性，你写的两种写法都会报错：第一种会把a识别为外部作用域变量，触发ReferenceError；第二种在赋值阶段object还未完成初始化，值为undefined，访问属性也会报错。你可以通过以下几种常见方案实现需求：

• 方案1：提前声明公共变量（最简洁，适合单配置场景）
  直接先定义公共的基础值，再组装对象，代码如下：

// 基础变量仅在当前作用域使用，不会有额外污染
const base_url = "www.google.com"
const object = {
  base_url,
  images_url: `${base_url}/images`,
  maps_url: `${base_url}/maps`
}
console.log(object) // 输出符合预期：{ base_url: 'www.google.com', images_url: 'www.google.com/images', maps_url: 'www.google.com/maps' }

如果担心变量污染外部作用域，可以用立即执行函数包裹，把变量收敛到函数作用域内：

const object = (() => {
  const base_url = "www.google.com"
  return {
    base_url,
    images_url: `${base_url}/images`,
    maps_url: `${base_url}/maps`
  }
})()

• 方案2：使用getter（完全收敛逻辑到对象内部）
  利用对象的getter特性，访问属性时才动态计算值，此时对象已经初始化完成，可以正常访问内部属性：

const object = {
  base_url: "www.google.com",
  get images_url() {
    return `${this.base_url}/images`
  },
  get maps_url() {
    return `${this.base_url}/maps`
  }
}
// 访问时自动拼接，后续修改base_url会自动同步到派生属性
console.log(object.images_url) // www.google.com/images

这个方案的额外好处是后续修改base_url时，所有派生的路径属性会自动同步更新，不需要手动修改。

• 方案3：使用类/构造函数（适合批量生成同类配置）
  如果需要生成多个结构一致的URL配置对象，可以用类封装逻辑：

class UrlConfig {
  constructor(baseUrl) {
    this.base_url = baseUrl
    this.images_url = `${this.base_url}/images`
    this.maps_url = `${this.base_url}/maps`
  }
}
const object = new UrlConfig("www.google.com")

内容的提问来源于stack exchange，提问作者Mario Perry