title: AngularJS : copy vs extend
body: <p><strong>Explanation :</strong></p>
  <p>we come across some situation in which we need to copy one object to another object. In that case, we probably have two solutions: <a href="https://docs.angularjs.org/api/ng/function/angular.copy" rel="nofollow noreferrer">angular.copy()</a> or <a href="https://docs.angularjs.org/api/ng/function/angular.extend" rel="nofollow noreferrer">angular.extend()</a>.</p>
  <p><strong>Challenge i am facing :</strong></p>
  <p>As we know <code>angular.copy(source, destination)</code> creates a deep copy of source object and assign it to destination. By writing deep copy, we mean that a new copy of the referred object is made and its working fine.</p>
  <p><strong>deep copy code :</strong></p>
  <pre><code>var mySource = {'name' : 'Beta', 'age' : '24'}
  var myDest = {}
  angular.copy(mySource,myDest);
  mySource.name = &quot;Alpha&quot;;
  console.log(mySource); // Object {name: &quot;Alpha&quot;, age: &quot;24&quot;}
  console.log(myDest); // Object {name: &quot;Beta&quot;, age: &quot;24&quot;}
  console.log(mySource.obj === myDest.obj); // false
  </code></pre>
  <p>Here, I modify the source object <code>mySource.name = &quot;Alpha&quot;</code> but it is not affecting the destination object <code>myDest</code> as expected.
  If we check <code>mySource.obj === myDest.obj</code>, this will give false because both point to different objects.</p>
  <p>Now,I am facing issue with <code>angular.extend(destination, source)</code> as it creates a <code>shallow copy</code> means in this both source and destination will point to same address. <code>So, if i will modify source object then it will also reflect in destination object. But it's not happening.</code></p>
  <p><strong>shallow copy code :</strong></p>
  <pre><code>var mySource = {'name' : 'Beta', 'age' : '24'}
  var myDest = {}
  angular.extend(myDest,mySource);
  mySource.name = &quot;Alpha&quot;;
  console.log(mySource); // Object {name: &quot;Alpha&quot;, age: &quot;24&quot;}
  console.log(myDest); // Object {name: &quot;Beta&quot;, age: &quot;24&quot;}
  console.log(mySource.obj === myDest.obj); // True
  </code></pre>
  <p>jsfiddle : <a href="https://jsfiddle.net/U3pVM/24322/" rel="nofollow noreferrer">https://jsfiddle.net/U3pVM/24322/</a></p>
  <p>As i am new in this, need help to understand the proper flow of angular.copy() &amp; angular.extend().</p>
  <p>Any immediate help will be highly appreciable. Thanks</p>