14 js references v copying

Kyle Bradshaw · Kyle Bradshaw · commit f5db7f550af9 · 2016-12-30T19:47:07.000-05:00
diff --git a/14 - JavaScript References VS Copying/index.html b/14 - JavaScript References VS Copying/index.html
@@ -8,13 +8,17 @@
 
   <script>
     // start with strings, numbers and booleans
+    let age = 100;
 
     // Let's say we have an array
     const players = ['Wes', 'Sarah', 'Ryan', 'Poppy'];
 
     // and we want to make a copy of it.
+    const team = players;
+    console.log(players, team);
 
     // You might think we can just do something like this:
+    team[3] = 'Lux'; //updating an array will always reference back
 
     // however what happens when we update that array?
 
@@ -25,26 +29,60 @@
     // Why? It's because that is an array reference, not an array copy. They both point to the same array!
 
     // So, how do we fix this? We take a copy instead!
+    const team2 = players.slice(); //makes a copy(entire array)
 
     // one day
 
+
     // or create a new array and concat the old one in
+    const team3 = [].concat(players);
 
     // or use the new ES6 Spread
+    const team4 = [...players];
+    team4[3] = 'wacko';
+    console.log(team4);
 
     // now when we update it, the original one isn't changed
+    const team5 = Array.from(players);
 
     // The same thing goes for objects, let's say we have a person object
 
     // with Objects
+    const dog = {
+        name: 'Porter',
+        age: 5
+    };
 
     // and think we make a copy:
+    const captain = dog;
+    captain.age = 99;
 
     // how do we take a copy instead?
+    const cap2 = Object.assign({}, dog, { age: 100});
+    console.log(cap2);
 
     // We will hopefully soon see the object ...spread
 
     // Things to note - this is only 1 level deep - both for Arrays and Objects. lodash has a cloneDeep method, but you should think twice before using it.
+    const porter = {
+        name: 'Porter',
+        social: {
+            twitter: '@porter',
+            facebook: 'porter.dog'
+        }
+    };
+    console.clear();
+    console.log(porter);
+
+    const special = Object.assign({}, porter);
+    console.log(special,'super');
+
+    //to make a deep copy
+
+    const dev = Object.assign({}, porter);
+    const dev2 = JSON.parse(JSON.stringify(porter));
+
+    console.log(dev,dev2);
 
   </script>
 
