드림코딩 : JS -7. object

//Objects
//자바스크립트의 data types중 하나
//관련된 데이터나 함수들의 집합체
//자바스크립트의 거의 모든 객체들은 Object의 예시이다
//object = {key : value};
 
//1. Literals and properties
const obj1 = {}; //'object literal'문법
const obj2 = new Object(); //'object constructor'문법
 
print(name, age);
function print(person){
    console.log(person.name);
    console.log(person.age);
}
 
const sigcho = {name: 'sigcho', age: 26}
print(sigcho);
 
sigcho.hasJob = true;
console.log(sigcho.hasJob); //이후에 추가 가능(보통은 안 된다)
 
delete sigcho.hasJob; //속성 삭제 가능
console.log(sigcho.hasJob);
 
 
 
//2. Computed properties (계산된 속성)
//key는 항상 문자형이어야 한다 ''써야한다
console.log(sigcho.name);  //sigcho, 바로 출력할 때
console.log(sigcho['name']);  //sigcho, 나중에 동적으로 출력할 때, ex 입력값 받아서 출력
sigcho['hasJob'] = true;  //다시 할당 가능하다
console.log(sigcho.hasJob);
 
function printValue(obj, key){
    console.log(obj[key]);
}
printValue(sigcho, 'name');
printValue(sigcho, 'age');
 
 
 
//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('sigcho', 26); //함수(4)를 미리 만들어 놓았기 때문에 가능하다
console.log(person4);
 
 
 
//4. Constructor Function
function Person(name, age){  //함수는 보통 대문자로 시작하게 만든다
    //this = {}; 생략됨
    this.name = name;
    this.age = age;
    //return this;  생략됨
}
 
 
 
//5. in operator: 속성이 존재하는지 확인 (객체의 키로써)
console.log('name' in sigcho);  //true
console.log('age' in sigcho);  //true
console.log('random' in sigcho);  //false
console.log(sigcho.random);  //undefined
 
 
 
//6. for..in vs for..of
//for (key in obj) 
//객체 안에 모든 key 출력된다
console.clear();  //이전 로그들이 지워진다
for (key in sigcho){
    console.log(key);  //name, age, hasJob 모두 출력
}
 
//for (value of iterable)
//순차적인 배열?형식의 value 모두 출력한다
const array = [1,2,3,4];
for (value of array){
    console.log(value);  //1,2,3,4 모두 출력
}
 
 
 
//7. Fun cloning (복제)
//Object.assign(dest, [obj1, obj2, obj3...])
const user = {name: 'sigcho', age: '26'};
const user2 = user;
user2.name = 'corder';
console.log(user);  // {name: "coder", age: "26"} 출력된다
 
// old way
const user3 = {};  //비어있는 객체 만들기
for (key in user){
    user3[key] = user[key];  //함수 돌면서 각각 키 값 복사
}
console.clear();
console.log(user3);
 
const user4 = {};
Object.assign(user4, user);
//const user4 = Object.assign({}, user); 위의 두줄과 같은 의미이다
console.log(user4);
 
//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