Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Appearance settings

Commit bfca6fa

Browse filesBrowse files
committed
adding script wesbos#14
1 parent bdd0ab4 commit bfca6fa
Copy full SHA for bfca6fa

File tree

Expand file treeCollapse file tree

1 file changed

+48
-16
lines changed
Open diff view settings
Filter options
Expand file treeCollapse file tree

1 file changed

+48
-16
lines changed
Open diff view settings
Collapse file

‎14 - JavaScript References VS Copying/index-START.html‎

Copy file name to clipboardExpand all lines: 14 - JavaScript References VS Copying/index-START.html
+48-16Lines changed: 48 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -8,32 +8,43 @@
88

99
<script>
1010
// start with strings, numbers and booleans
11+
// let age = 100;
12+
// let age2 = age;
13+
// console.log(age, age2);
14+
// age = 200;
15+
// console.log(age, age2);
16+
17+
// let name = 'Josh';
18+
// let name2 = name;
19+
// console.log(name, name2);
20+
// name = 'Joshua';
21+
// console.log(name, name2);
1122

1223
// Let's say we have an array
1324
const players = ['Wes', 'Sarah', 'Ryan', 'Poppy'];
14-
25+
1526
// and we want to make a copy of it.
16-
1727
// You might think we can just do something like this:
18-
28+
const team = players;
29+
console.log(players, team);
1930
// however what happens when we update that array?
20-
31+
team[3] = 'Lux';
2132
// now here is the problem!
22-
33+
console.log(players, team);
2334
// oh no - we have edited the original array too!
24-
2535
// Why? It's because that is an array reference, not an array copy. They both point to the same array!
26-
2736
// So, how do we fix this? We take a copy instead!
28-
2937
// one way
30-
38+
const team2 = players.slice();
3139
// or create a new array and concat the old one in
32-
40+
const team3 = [].concat(players);
3341
// or use the new ES6 Spread
34-
42+
const team4 = [...players];
43+
team4[3] = 'Amended';
44+
//or use array from
45+
const team5 = Array.from(players)
3546
// now when we update it, the original one isn't changed
36-
47+
console.log(players, team2, team3, team4);
3748
// The same thing goes for objects, let's say we have a person object
3849

3950
// with Objects
@@ -43,13 +54,34 @@
4354
};
4455

4556
// and think we make a copy:
46-
57+
const captain = person;
58+
captain.number = 99;
4759
// how do we take a copy instead?
48-
60+
const captain2 = Object.assign({}, person, {number: 99, age: 12});
61+
console.log(captain2);
4962
// We will hopefully soon see the object ...spread
50-
63+
//const captain3 = {...person};
5164
// 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.
52-
65+
const josh = {
66+
name: 'josh',
67+
age: '25',
68+
social: {
69+
twitter: '@developer_josh',
70+
facebook: 'watson6982'
71+
}
72+
}
73+
console.log(josh);
74+
75+
const dev = Object.assign({}, josh, {name: 'joshua'});
76+
dev.social.twitter = '@devhandle';
77+
console.log(dev);
78+
// object will only assign top layer
79+
// function clone deep will close full object
80+
// or poor mans deep clone
81+
const dev2 = JSON.parse(JSON.stringify(josh));
82+
dev2.social.twitter = '@handle';
83+
84+
console.log(dev2)
5385
</script>
5486

5587
</body>

0 commit comments

Comments
0 (0)
Morty Proxy This is a proxified and sanitized view of the page, visit original site.