title: JavaScript spread syntax vs jQuery $.extend - ByRef and ByVal
body: <p>I am trying to update an object that is deeply nested and thus has a rather long name that I do not want to keep typing in my code. In this discussion, I shall call it by the shorter name 'target'.</p>
  
  <p>I begin by referring to it by the shorter name 'c':</p>
  
  <p><code>c = target</code></p>
  
  <p>I then want to update its contents using another object; call it <code>update</code>.</p>
  
  <p>If I use <code>c = $.extend(c,update)</code>, the reference to c remains 'intact'; i.e. <code>c === target</code> is true.</p>
  
  <p>However, if I use <code>c = {...c, ...update}</code>, a new variable is created; i.e. <code>c === target</code> is false. My original <code>target</code> variable is not updated.</p>
  
  <p>I do not understand why. Can anyone explain?</p>
  
  <p>There is a bin at <a href="https://jsbin.com/xogixax/7/edit?html,js,console" rel="nofollow noreferrer">$extends vs JavaScript spread</a></p>