adding script wesbos#14

Watson6982 · Watson6982 · commit bfca6fa436af · 2018-09-14T09:53:36.000+01:00
diff --git a/14 - JavaScript References VS Copying/index-START.html b/14 - JavaScript References VS Copying/index-START.html
@@ -8,32 +8,43 @@
 
   <script>
     // start with strings, numbers and booleans
+    // let age = 100;
+    // let age2 = age;
+    // console.log(age, age2);
+    // age = 200;
+    // console.log(age, age2);
+
+    // let name = 'Josh';
+    // let name2 = name;
+    // console.log(name, name2);
+    // name = 'Joshua';
+    // console.log(name, name2);
 
     // Let's say we have an array
     const players = ['Wes', 'Sarah', 'Ryan', 'Poppy'];
-
+    
     // and we want to make a copy of it.
-
     // You might think we can just do something like this:
-
+    const team = players;
+    console.log(players, team);
     // however what happens when we update that array?
-
+    team[3] = 'Lux';
     // now here is the problem!
-
+    console.log(players, team);
     // oh no - we have edited the original array too!
-
     // 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!
-
     // one way
-
+    const team2 = players.slice();
     // 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] = 'Amended';
+    //or use array from
+    const team5 = Array.from(players)
     // now when we update it, the original one isn't changed
-
+    console.log(players, team2, team3, team4);
     // The same thing goes for objects, let's say we have a person object
 
     // with Objects
@@ -43,13 +54,34 @@
     };
 
     // and think we make a copy:
-
+    const captain = person;
+    captain.number = 99;
     // how do we take a copy instead?
-
+    const captain2 = Object.assign({}, person, {number: 99, age: 12});
+    console.log(captain2);
     // We will hopefully soon see the object ...spread
-
+    //const captain3 = {...person};
     // 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 josh = {
+      name: 'josh',
+      age: '25',
+      social: {
+        twitter: '@developer_josh',
+        facebook: 'watson6982'
+      }
+    }
+    console.log(josh);
+
+    const dev = Object.assign({}, josh, {name: 'joshua'});
+    dev.social.twitter = '@devhandle';
+    console.log(dev);
+    // object will only assign top layer
+    // function clone deep will close full object
+    // or poor mans deep clone
+    const dev2 = JSON.parse(JSON.stringify(josh));
+    dev2.social.twitter = '@handle';
+
+    console.log(dev2)
   </script>
 
 </body>
