Repository navigation
Expand file tree
/
Copy path5_object.js
More file actions
109 lines (88 loc) · 2.8 KB
/
Copy path5_object.js
File metadata and controls
109 lines (88 loc) · 2.8 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
// ! Object
// one of the JavaScript's data types
// a collection of related data and/or functionality
// Nearly all objects in JavaScript are instances of Object
// object = { key : value }
console.log('--- 1. Literals and properties ---');
// ! 1. Literals and properties
const obj1 = {}; // 'object literal' syntax
const obj2 = new Object(); // 'object constructor' syntax
const ellie = { name: 'ellie', age: 4 };
function print(person) {
console.log(person.name);
console.log(person.age);
}
print(ellie);
// note) Runtime: program이 동작하고 있을 때
// note) JavaScript는 dynamic language이기 때문에 추가, 삭제 가능
// can add properties later
ellie.hasJob = true;
console.log(ellie.hasJob);
// can delete properties later
delete ellie.hasJob;
console.log(ellie.hasJob);
console.log('--- 2. Computed properties ---');
// ! 2. Computed properties
console.log(ellie.name);
console.log(ellie[name]);
console.log(ellie['name']); // key should be always string
ellie['hasJob'] = true;
console.log(ellie.hasJob);
function printValue(obj, key) {
// console.log(obj.key);
console.log(obj[key]); // 동적으로 key의 value를 받아올 때 사용
}
printValue(ellie, 'name');
console.log('--- 3. Property value shorthand ---');
// ! 3. Property value shorthand
const person1 = { name: 'bob', age: 2 };
const person2 = { name: 'steve', age: 3 };
const person3 = { name: 'dave', age: 4 };
const person4 = new Person('ellie', 30);
console.log(person4);
console.log('--- 4. Constructor Function ---');
// ! 4. Constructor Function
function Person(name, age) {
this.name = name;
this.age = age;
}
console.log('--- 5. in operator: property existence check (key in obj) ---');
// ! 5. in operator: property existence check (key in obj)
console.log('name' in ellie);
console.log('age' in ellie);
console.log('random' in ellie);
console.log(ellie.random);
console.log('--- 6. for..in VS for..of ---');
// ! 6. for..in VS for..of
// for (key in obj)
for (key in ellie) {
console.log(key);
}
// for (value of iterable)
const array = [1, 2, 3, 4, 5];
for (value of array) {
console.log(value);
}
console.log('--- 7. Fun cloning ---');
// ! 7. Fun cloning
// Object.assign(dest, [obj1, obj2, obj3...])
const user = { name: 'ellie', age: 20 };
const user2 = user;
console.log(user);
user2.name = 'coder';
console.log('user2에서 name value가 변경된 user: ', user);
// @ old way
const user3 = {};
for (key in user) {
user3[key] = user[key];
}
console.log('user3: ', user3);
// @ new way
const user4 = Object.assign({}, user);
console.log('user4: ', user4);
// # another example
const fruit1 = { color: 'red' };
const fruit2 = { color: 'blue', size: 'big' };
const mixed = Object.assign({}, fruit1, fruit2);
console.log(mixed.color); // 동일한 property여서 color는 'red'에서 'blue'로 바뀜
console.log(mixed.size);