출처 : 유튜브 드림코딩 자바스크립트

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

Objects

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};

1. Literials and properties

object를 만드는 두 가지 방법

1. object literal
2. object constructor

const obj1 = {}; //'object literal' syntax
const obj2 = new Object(); // 'object constructor' syntax 

function print(person){
    console.log(person.name);
    console.log(person.age);
}

const ellie = {name : 'ellie', age : 4};
print(ellie);

ellie.hasJob = true; //이렇게 뒤늦게 data추가할 수 있음. 가능하면 이를 피해서 
                     //코딩하는 것이 좋음

console.log(ellie.hasJob);

delete ellie.hasJob; //삭제도 가능
console.log(ellie.hasJob); //undefined

2.Computed properties (계산된 properties)

key should be always string (항상 문자열 형태로 적어줄 것!)

console.log(ellie.name);
console.log(ellie['name']); //string형태로 접근 가능. => computed properties
ellie['hasJob'] = true;
console.log(ellie.hasJob); //true

computed properties쓰는 경우 : 우리가 정확히 어떤 key가 필요한지 모를 때, 즉 runtime에서 결정될 때
ex)

function printValue(obj, key){
    console.log(obj[key]); //이경우 obj.key라고 적으면 안됌! key라는 
                            //property가 없기 때문! 
}

printValue(ellie, 'name'); //key 는 항상 문자열 형태로 적어주기! 
printValue(ellie, 'age');

3. Property value shorthand (key와 value 이름이 동일하다면 생략 가능하다.)

const person1 = {name: 'bob', age: 2};
const person2 = {name:'steve', age : 3};
const person3 = {name:'dave',age : 4};
const person4 = new Person('ellie', 30); //class 에서 object를 만들어줌.

console.log(person4);

4. Constructor function

function Person(name, age){
    //this = {};
    this.name = name;
    this.age = age;
    // return this;
}

굳이 name:name 이렇게 적지 않아도 된다.
위의 Person 함수는 class같은 아이. 즉 template같은 아이.
위와 같이 순수하게 object를 생성하는 함수들은 보통 대문자로 시작하도록 함수를 만든다!

5. in operator : property existence check (key in obj)

해당하는 object안에 key가 있는지 없는지 확인한다.

console.log('name' in ellie); //true
console.log('age' in ellie); //true
console.log('random' in ellie); //false
console.log(ellie.random); //undefined

6. for..in vs for..of

for (key in obj)

for(key in ellie){
    console.log(key); //ellie 안에 있는 모든 key 들이 출력된다. 
}

for (value of iterable)

const array = [1, 2, 4, 5];
for(let i = 0; i < array.length; i++){
    console.log(array[i]);
}

위의 기존의 방식을 for of 활용하여 더 간단하게 만들기

for(value of array){
    console.log(value);
}

key 값 모두 출력 : for( key in obj )
value 값 출력 : for( value of iterable)

7. Fun cloning

Object.assign(dest, [obj1, obj2, obj3...])
const user = {name : 'ellie', age : '20'};
const user2 = user; 
user2.name = 'coder';
console.log(user); // name : 'coder' 로 바뀜. why? 
                   //user안에 들어있는 reference의 값이
                   //user2에도 동일하게 할당되어있으므로.

const user4 = {}; //user4라는 텅텅 빈 객체를 만들어준 후 
Object.assign(user4, user);//user4 에 user라는 객체를 복사한다.
console.log(user4); //user 객체가 출력된다.

//또는
const user5 = Object.assign({}, user);
console.log(user5);

another example

const fruit1 = {color : 'red'};
const fruit2 = {color : 'blue', size:'big'};
const mixed = Object.assign({}, fruit1, fruit2);
console.log(mixed.color);// blue
console.log(mixed.size);// big => 뒤에 나오는 아이가 앞에 나오는 아이를 계속 
			//덮어씌우기 때문! fruit2로 적용됌.