[드림코딩 by 엘리] 7. 오브젝트 넌 뭐니?

Object

• 자바스크립트 타입의 일종
• 관련 있는 데이터나 함수의 묶음
• { key: value }
• key와 value의 집합체

1. Literals and properties

   • object literal

       const obj1 = {};

   • object constructor

       const obj2 = new Object();

   • 나중에 property 추가 가능

       obj.plus = "+";

   • 나중에 property 삭제도 가능

       delete obj.plus;

   • 자바 스크립트는 동적 언어라 가능하다.

2. Computed properties

   • object안의 값을 접근하는 방법

     console.log(me.name);
     
     // Computed properties
     console.log(me['name']); // key는 string type으로 지정해야됨

3. Property value shorthand

    function makePerson(name, age) {
        return {
            name, // name: name
            age // age: age
        };
    }

   • key와 value의 이름이 동일하면 생략가능

4. Constructor Function

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

5. in operator

   • object안에 key가 있는지 없는지 확인

     console.log('name' in soo);
     // true

6. for..in vs for..of

    for (key in soo) {
        console.log(key);
    }
    // name
    // age
    const array = [1, 2, 3];
    for (val of array) {
        console.log(val);
    }
    // 1
    // 2
    // 3

   • for ... in 은 object에
   • for ... of 는 array에

   1. Fun cloning

       const user = { name: 'soo', age: '20' };
       const user2 = user;
       user2.name = 'hyun'
       console.log(user);
       // {name: "hyun", age: "20"}

      • user가 가리키는 것은 값들의 ref, 따라서 user2가 ref를 복사해오면 같은 값을 가리키게 됨

        const user3 = {};
        Object.assign(user3, user);
        user3.name = 'choi';
        console.log(user);
        // {name: "hyun", age: "20"}
        console.log(user3);
        // {name: "choi", age: "20"}

      • Object.assign을 통해 cloning