调用JS Class实例方法为何可修改参数实例属性并完成双端值交换

核心机制：引用类型的传参规则 #

• JavaScript中的数据类型分为两类，你的认知误区本质是混淆了两类数据的传参逻辑：
  • 原始类型（数字、字符串、布尔值、null、undefined、Symbol、BigInt）：传参时传递的是值的副本，函数内部修改参数不会影响外部原始值
  • 引用类型（对象、数组、类实例等）：传参时传递的是指向原始内存地址的引用，你通过这个引用修改它的属性，本质就是操作原始对象本身

代码执行逻辑拆解 #

你调用mary.infect(john)时，传入的john是Infected类的实例，属于引用类型，方法内部的somebody参数拿到的就是john实例的引用，而非复制出来的新对象，代码执行的两个步骤对应效果如下：

infect(somebody) {
    // 先存下当前mary的diseases数组
    const thisDiseases = this.diseases;
    // 第一步：修改当前实例（也就是mary）的diseases属性
    this.diseases = this.diseases.concat(somebody.diseases);
    // 第二步：通过somebody引用修改原始john实例的diseases属性，直接生效到外部的john对象
    somebody.diseases = somebody.diseases.concat(thisDiseases);
}

简化示例验证 #

你可以用更简单的代码验证这个逻辑：

const testObj = { count: 1 }
function changeAttr(obj) {
  // 通过引用修改属性
  obj.count = 100
}
changeAttr(testObj)
console.log(testObj.count) // 输出100，外部对象已被修改

内容的提问来源于stack exchange，提问作者Lukasz Pospiech