Skip to content

Commit 7b811db

Browse files
elfgoddelfgodd
committed
Section 6: Objects and Reference Types & Array Object Equality
1 parent b550806 commit 7b811db

2 files changed

Lines changed: 127 additions & 14 deletions

File tree

‎06-Objects-The-Core-of-Javascript/01/01.js‎

Lines changed: 77 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -120,7 +120,7 @@ console.log(userReviews.mrSmith78) */
120120
// ******************************
121121
// Nested Arrays & Objects ******************************
122122
// Example 5
123-
123+
/*
124124
const student = {
125125
firstName: 'Alberto',
126126
lastName: 'Guzman',
@@ -137,8 +137,9 @@ console.log(
137137
student.strengths[0],
138138
',',
139139
student.strengths[1]
140-
)
141-
140+
) */
141+
/*
142+
// Example 6
142143
console.log('\n')
143144
const tetrisGame = {
144145
player1: {
@@ -167,7 +168,9 @@ for(i = 0; i < tetrisGame.board.length; i++) {
167168
console.log(tetrisGame.board[i][j])
168169
}
169170
}
170-
171+
*/
172+
/*
173+
// Example 7
171174
console.log('\n')
172175
const shoppingCart = [
173176
{
@@ -191,3 +194,73 @@ console.log(shoppingCart)
191194
console.log(shoppingCart[0].product)
192195
console.log(shoppingCart[1].price)
193196
console.log(shoppingCart[2].quantity)
197+
*/
198+
// console.log('\n')
199+
// ******************************
200+
// Objects and Reference Types ******************************
201+
// Example 8
202+
/*
203+
const palette = {
204+
red: '#eb4d4b',
205+
yellow: '#f9ca24',
206+
blue: '#30336b',
207+
}
208+
209+
const palette2 = palette
210+
palette2.green = '#ebf876'
211+
// You'll see that pallet has been updated, as has pallet2
212+
// The're referring to the same object, the same thing in memory
213+
console.log(palette);
214+
*/
215+
216+
// console.log('\n')
217+
// ******************************
218+
// Array Object Equality ******************************
219+
// Example 9
220+
221+
let nums = [1, 2, 3];
222+
let mystery = [1, 2, 3];
223+
224+
console.log(nums == mystery); // false
225+
console.log(nums === mystery); // false
226+
227+
let moreNums = nums;
228+
console.log(nums === moreNums); // true
229+
230+
console.log('\n')
231+
const user = {
232+
username : 'ElfGodd',
233+
email: 'elfgodd@elfgodd.com',
234+
notifications: []
235+
};
236+
237+
// false can't compare Reference Types, new place in memory
238+
// They look the same, but each time i type
239+
// empty array, it's a new place in memory
240+
console.log('[] === []: ', [] === [])
241+
242+
// This will not work
243+
if (user.notifications === []) {
244+
console.log('user.notifications === []' + 'NO NEW NOTIFICATIONS!');
245+
}
246+
247+
console.log('\n')
248+
if (user.notifications.length === 0) {
249+
console.log('NO NEW NOTIFICATIONS!');
250+
}
251+
252+
if (!user.notifications.length) {
253+
console.log('NO NEW NOTIFICATIONS!');
254+
}
255+
256+
console.log('\n')
257+
console.log({} === {}); // false
258+
console.log({a:1} === {a:1}); // false
259+
260+
let data1 = {a: 1};
261+
let data2 = {a: 1};
262+
console.log(data1 === data2); // false
263+
let compareObject = data2;
264+
console.log(data1 === compareObject); // false
265+
let data3 = data1;
266+
console.log(data3 === data1); // true

‎06-Objects-The-Core-of-Javascript/README.md‎

Lines changed: 50 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@
55
### How would you store this?
66

77
Health App, User dashboard
8+
89
- 308.272 total steps
910
- 1.826 total floors
1011
- 211.70 total miles
@@ -13,12 +14,13 @@ Health App, User dashboard
1314
- 7 of 5 days exercising this week
1415
- 2 hrs 13 mins of restful sleep
1516

16-
If we used an array, we definitely could, It just would be confusing and we'd have to come up with some arbitrary rules.
17+
If we used an array, we definitely could, It just would be confusing and we'd have to come up with some arbitrary rules.
1718

1819
### OBJECTS
20+
1921
- Objects are collections of properties
2022
- Properties are a key-value pair
21-
- Rather than accessing data using an index, we use custom keys.
23+
- Rather than accessing data using an index, we use custom keys
2224

2325
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object
2426

@@ -39,6 +41,7 @@ isAdmin: true
3941
```
4042

4143
### AN OBJECT!
44+
4245
```
4346
const fitAppData = {
4447
totalSteps: 308727,
@@ -48,7 +51,9 @@ const fitAppData = {
4851
avgGoodSleep,: '2:13'
4952
};
5053
```
54+
5155
ALL TYPES WELCOME!
56+
5257
```
5358
let comment = {
5459
username: 'sillyGoose420',
@@ -64,12 +69,13 @@ let comment = {
6469
## 2. Creating Object Literals
6570

6671
### VALID KEYS
72+
6773
All keys are converted to strings, Except for Symbols
6874
`key: value === string: data`
6975

7076
## 3. Accessing Object Properties
7177

72-
### ACCESSING DATA
78+
### ACCESSING DATA
7379

7480
```
7581
// This is converted
@@ -85,7 +91,7 @@ const numbers = {
8591
8692
```
8793

88-
Why would you use square brackets aside from if you tried to store numbers as a key, Well sometimes you have property names that may not be valid JavaScript identifiers. Now, an identifier in JS is like the name of a variable.
94+
Why would you use square brackets aside from if you tried to store numbers as a key, Well sometimes you have property names that may not be valid JavaScript identifiers. Now, an identifier in JS is like the name of a variable.
8995

9096
```
9197
// invalid name variable
@@ -101,7 +107,7 @@ object = {
101107
console.log(numbers2['76 trombones']); // 'great song!'
102108
```
103109

104-
Another reason sometimes you want to use a dynamic value like a variable to access data from an object.
110+
Another reason sometimes you want to use a dynamic value like a variable to access data from an object.
105111

106112
```
107113
const palette = {
@@ -127,7 +133,7 @@ as a identifier like **let 76games = 'NBA team'**
127133
It's similar to viewing a property or accessing the data. We have the dot notation or the square brackets. The only difference is we use an equal sign to assign a value either to update that value or to give it an initial value.
128134

129135
```
130-
// Updating properties:
136+
// Updating properties:
131137
fitAppData.workoutsThisWeek = '6 of 7';
132138
fitAppData.totalMiles += 7.5;
133139
@@ -138,6 +144,7 @@ fitAppData.heartStillBeating = true;
138144
## 5. Nested Arrays & Objects
139145

140146
### ARRAYS + OBJECTS
147+
141148
```
142149
const shoppingCart = [
143150
{
@@ -181,8 +188,41 @@ const game = {
181188
]};
182189
```
183190

184-
Objects and Reference Types
185-
Objects and Arrays are Reference types
191+
## 5. Nested Arrays & Objects
192+
193+
## 6. Objects and Reference Types
194+
195+
### Objects and Arrays are Reference types
196+
197+
## 7. Array Object Equality
198+
199+
Arrays and Objects behave the same way when we checking for equality we are comparing Reference Types Addresses.
200+
201+
When we compare with == or ====, we're comparing these memory slot addresses, variables might look the same, but it has it's own completely unique place in memory.
202+
203+
```
204+
let nums = [1, 2, 3];
205+
let mystery = [1, 2, 3];
206+
207+
console.log(nums == mystery); // false
208+
console.log(nums === mystery); // false
209+
210+
nums -> 12873612783
211+
mystery -> 9912873621
212+
213+
let moreNums = nums;
214+
console.log(nums === moreNums); // true
215+
```
216+
217+
This means if you're trying to compare arrays, if you're trying to see if an array is equal to another array, it's not as straightforward as you might hope it would be, because a lot of times you're not trying to check if an array is the exact same array, Instead you often want to check if they look the same, if they contain the same information.
218+
219+
220+
So the next thing that it's a little trickier is trying to check if an array contains or looks like another array that isn't empty.
221+
222+
So if i wanted to know if one array contained exactly the numbers one, two and three in that order, unfortunately there's not an easy option for us right now until we talk about loops. We don't really have a way of checking for array equality of values, what we will need to do is manually compare every element in an array to another array.
223+
224+
**The exact same thing holds true for objects.**
225+
226+
```
186227
187-
Array Object Equality
188-
Arrays and Objects behave the same way when we checking for Equality We are comparing Reference Types Addresses
228+
```

0 commit comments

Comments
 (0)