JavaScript 传播语法与 jQuery $.extend - ByRef 和 ByVal

Posted

技术标签:

【中文标题】JavaScript 传播语法与 jQuery $.extend - ByRef 和 ByVal【英文标题】:JavaScript spread syntax vs jQuery $.extend - ByRef and ByVal 【发布时间】:2018-10-14 02:00:48 【问题描述】:

我正在尝试更新一个深度嵌套的对象,因此我不想在我的代码中继续输入一个相当长的名称。在本次讨论中,我将使用较短的名称“目标”来称呼它。

我首先用较短的名称“c”来引用它:

c = target

然后我想用另一个对象更新它的内容;叫它update

如果我使用c = $.extend(c,update),对 c 的引用仍然是“完整的”;即c === target 为真。

但是,如果我使用c = ...c, ...update,则会创建一个新变量;即c === target 是假的。我原来的target 变量没有更新。

我不明白为什么。谁能解释一下?

$extends vs javascript spread 有一个垃圾箱

【问题讨论】:

【参考方案1】:

jQuery 文档非常清楚 extend() 的工作原理:

目标对象(第一个参数)将被修改,也会从 $.extend() 中返回

使用扩展运算符是不同的。当你写这个时:

c = ...c, ...update

您正在创建一个新对象。然后分配c 指向该新对象。 c 之前指向的对象与此无关。它只是(来自:tc29/proposal):

将自己的可枚举属性从提供的对象复制到新创建的对象上

要获得你想要的行为,你可以使用Object.assign();

let target = 
  name: "Mark",
  place: "AK"


let c = target;

Object.assign(c, 
  name: "Tim"
)
console.log(target)

【讨论】:

谢谢。您对事物顺序的解释很有帮助。我是这样理解的:...c,...target 创建了一个新对象。然后将变量名称 c 重新分配给具有 c = ...c,...target 的新对象【参考方案2】:

$.extend()的描述如下:

将两个或多个对象的内容合并到第一个对象中。

意思,合并两个对象,用秒(或第三、第四等)的属性修改第一个对象

JavaScript is pass-by-reference,因此,当更新 c 时(而不是将其设置为新值),您正在修改 target 引用的同一对象。

c = ...c, ...update;

c 设置为cupdate 的组合,而

$.extend(c,update);

正在通过添加update 的属性来修改c 所引用的对象。

我希望你说清楚

【讨论】:

以上是关于JavaScript 传播语法与 jQuery $.extend - ByRef 和 ByVal的主要内容,如果未能解决你的问题,请参考以下文章

JavaScript - 如何合并/附加到对象/数组 - ReactJS - 传播语法

在 javascript 中传播语法后使用分号会中断执行并出现错误“Unexpected token =”

JavaScript事件冒泡及使用jQuery阻止

反应休息参数语法与传播语法

新知识:JQuery语法基础与操作

Array.from() 与传播语法