[JS] 개념정리 06. 객체 Object {}

Ⅵ. 객체 Object{}

객체 : 키와 값 한쌍으로 이루어져 있는 변수. 하나의 변수안에 여러 정보가 담겨있을 때 사용.

    object = {
      key : value,
      key2 : value2
           .
           .
           .
    }

한사람에 대한 정보를 만든다고 가정했을 때,
필요한 정보는 이름, 이메일, 사는 지역( -> 이게 변수)가 된다.

ex) 
    let userFirstName = 'Jim';
    let userLastName = 'kirk';
    let userMail = 'JimK@gmail.com';
    let userCity = 'iowa';

위에서 한 사람에 대한 정보로 변수 4개가 선언되었다.
Javascript에서는 이 변수들이 한사람꺼라고 인식하기 어렵다. 'user~'로 구분되어 추측할 뿐.
여기서 만약에 사람을 늘어난다면 'user2~'로 해서 변수 4개를 더 선언해야 할까?

일단, 배열을 사용하면 변수를 하나만 선언하여 여러개의 정보를 다 담을 수 있다.

ex)
    let user = [
      'Jim',
      'kirk',
      'JimK@gmail.com',
      'iowa'
    ]

배열을 사용할 경우 하나의 변수로 묶여있지만 각각의 인덱스가 어떤 정보를 가지고 있는지 미리 알고 있어야한다.

ex) user[1] = ?
'krik' // user의 첫번째 인덱스의 값은 kirk로 userLastName을 의미하지만
          user[1]로 검색해보지 않으면 뭔지 알 수 없다.

여기서 객체를 사용하면 인덱스와 값을 대응하여 정보를 담을 수 있다.

ex)
    let user = {
      firstName : 'Jim',
      lastName : 'kirk',
      email : 'JimK@gmail.com',
      city : 'iowa'
    }

• 배열과 객체의 차이점
  배열 : 각각의 요소가 순서가 있고 의미는 없을 때 사용.
  객체 : 순서가 필요없고 각각의 요소에 이름이 있거나 의미가 있을 때 사용.

ex)
    let fruits = ['banana', 'apple', 'peach']

    let fruitsColor = {
      red : 'apple',
      yellow : 'banana',
      pink : 'peach'
    }

객체 키의 값 사용하기

1. Dot notation : .key -> 객체의 속성을 가져오는 것
   user.firstName; // 'Jim'
user.city; // 'iowa'

   ---

2. Bracket notation : ['key'] -> ※반드시 key가 문자열로 들어가야 한다.
   user['firstName']; // 'Jim'
user['city']; // 'iowa'

   ---

3. Dot/Bracket notation를 이용하여 값 추가 -> 값에 불리언, 배열 등 다 들어갈 수 있다.
   user['tall'] = 186;
user.age = 32;
user.tags = ['commender', 'starplit'];

   ---

4. Delete 키워드로 삭제
   delete user.lastName; // lastName을 제외한 내용만 남는다.

   ---

5. in 연산자로 해당 키가 있는지 확인 가능
   'city' in user; // true
'animal' in user; // false

---

• 2번 ['key']와 [key] : key가 문자열로 들어가야 하는 이유

user[city]; // error
-> 에러의 이유 Uncaught ReferenceError: city is not defined
city의 값이 정의되지않았다.
-> city가 user의 key가 아닌 변수로 취급되고 있다.

ex)
    let keyName = 'city'
    user[keyName] // 'iowa'

    즉, user['city'] === user[keyName] // 'iowa'
    let city = 'seoul'
    user[city] === user['city'] // false -> 'seoul' === 'iowa'
    user[city] === user['seoul'] // ture -> 'seoul'

만약, key가 상황에 따라 다른 값이 들어가는 매개변수라면 문자열 ['key']이 아닌 [key]를 사용해야한다.