Part 7 <Object>

1. literals & property

primitive type은 변수 당 하나의 값만 담을 수 있음

const name = 'ellie';
const age = 4;
print(name, age);
function print(name, age) {
  console.log(name);
  console.log(age);
}

문제는 담아야 할 정보 많으면 코드 점점 길어짐

하지만 object로 하면

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


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


*Object 만드는 방법 
1. const obj1 = { };//object literal
2. const obj2 = new Object( );//object constructor

※자바스크립트는 런타임(프로그램이 동작하고 있을 때)에 동적으로 타입이 결정되는 언어
그래서 이런 경우가 가능한데 유지보수 힘드니까 추천 안함
ellie.hasJob = true;
console.log(ellie.hasJob); -> true

delete ellie.jasJob;
console.log(ellie.hasJob);

★object = { key : value };
객체는 키와 value의 집합체!!!
-----------------------------------------------------------------------------------

2. Computed properties 계산된 프로퍼티

console.log(ellie.name);
console.log(ellie['name']);
->접근방식 2가지
주의점 key는 항상 string 타입으로 지정해서 받아와야함

ellie['hasJob'] = true;
console.log(ellie.hasJob); -> true
이런것도 가능!

Question. 어떤 경우에 어떤 방식 써야하나요?
코딩하는 순간 해당 key의 value를 받아오고 싶을 때 .(dot)을 사용해서 코딩함.

우리가 정확하게 어떤 key가 필요한지 모를 때 즉,
runtime에서 결정될 때 computed properties를 쓴다. 실시간으로 필요 시

예시)
function printValue(obj, key) {
  console.log(obj.key);
}
printValue(ellie, 'name'); ->undefined 즉 key라는 property는 들어있지 않아

그러므로 이 경우에는 
function printValue(obj, key) {
  console.log(obj[key]);
}
printValue(ellie, 'name');

이렇게 사용

-----------------------------------------------------------------------------------------------------------------------------
3. Property value shorthand

const person1 = { name: 'bob', age: 2 };
const person2 = { name: 'steve', age: 3 };
const person3 = { name: 'dave', age: 4 };

const person4 = makePerson('ellie', 30);

function makePerson(name, age) {
 return {
   name,
   age,
   };
}
※key와 value의 이름이 동일하면 생략 가능
이전에 클래스가 없을 때는 순수하게 object를 담은
함수가 있었음(new, 대문자, this 사용 등)
const person4 = new Person('ellie', 30);

4. Construtor Function
function Person(name, age) {
  this.name = name;
  this.age = age;
}

5. in operator: property existence check (key in obj)
해당 object 안에 key가 있는지 확인

console.log('name' in ellie); -> true
console.log('age' in ellie); -> true

6. ★for..in vs for..of ★多

※console.clear( ); 콘솔창 지우기

for(key in ellie) {
  console.log(key);
 }

->프로퍼티 콘솔창에 나옴
------------------------------------------------------------------------------------------------------------------------------
for(value of iterable) 배열 값들 나오게 함

const array = [1,2,4,5];
for(value of array) {
  console.log(value);
 }

7. cloning

//old way
const user3 = {};
for( key in user) {
  user3[key] = user[key];
}
console.clear();
console.log(user3); -> {name: "ellie", age: "20"}

//new way
const user4 = {};
Object.assign(user4, user);
console.log(user4);

또는 이렇게 합쳐도 됨

const user4 = Object.assign({}, user);
console.log(user4);

//another example
const fruit1 = {color : 'red' };
const fruit2 = {color : 'blue', size: 'big' };
const mixde = Objectassign({}, fruit1, fruit2);
console.log(mixed.color); ->blue
console.log(mixed.size); -> big

※뒤의 값을 계속 덮어씌움