如何通过修改全局变量同步更新所有关联对象的对应属性值

字符串属于JavaScript基础数据类型，初始化car对象时只是将cartype的当前值*Fiat*拷贝给了car.type，二者后续是完全独立的变量，修改cartype不会自动同步到car.type。

以下两种方案都不需要修改update函数的赋值逻辑，适配多对象共用cartype的场景：

方案1：将公共变量封装到引用类型对象中（推荐） #

引用类型传递的是内存地址，所有关联对象都指向同一个配置地址，修改配置后所有引用方自动生效，后续扩展其他公共属性也非常方便：

// 公共配置对象（引用类型）
var config = {
  cartype: 'Fiat'
}

var car = {type: config, model:"500", color:"white"};
// 其他引用cartype的对象也可以直接关联config

function update(){
  config.cartype = 'Safari';
}

function show(){
  console.log(config.cartype);
  // 取值时从公共配置中取最新值即可
  document.getElementById("demo").innerHTML = car.type.cartype;
}

方案2：给对象属性设置getter访问器 #

每次读取car.type时都会实时获取最新的全局cartype值，不需要调整原有全局变量的定义逻辑：

var cartype = 'Fiat';

var car = {
  // 定义getter，每次读取type属性时返回当前全局cartype的最新值
  get type() {
    return cartype
  },
  model:"500", 
  color:"white"
};
// 其他需要关联cartype的对象也可以通过同样的方式定义getter

function update(){
  cartype = 'Safari';
}

function show(){
  console.log(cartype);
  // 直接访问type属性即可自动拿到最新值
  document.getElementById("demo").innerHTML = car.type;
}

以上两种方案都不需要修改原有HTML代码。

内容的提问来源于stack exchange，提问作者Raj Kamal