TIL [객체]

1. 회원 주소록을 만든다고 가정해볼때 과연 한 회원당 몇 개의 변수 메모리가 필요할까?

let userFirstName = 'Steve';
let userLastName = 'Lee';
let userEmail = '[email protected]';
let userCity = 'LA';
        .
        .
        .
let age = 30;

아마 각 회원당 필요한 정보의 수 만큼 변수를 할당해 주어야 할 것이다. 이는 아주 비효율적이라고 할 수 있다. 거기다 회원 수가 수 백, 수 천, 수 만명일 경우 변수의 수는 기하 급수적으로 증가하게 될 것이다.

2. 그렇다면 배열을 쓰면 달라질까?

let user = [
  	     'Steve', 
             'Lee', 
             '[email protected]', 
             'LA'
           ];
let user2 = [
  	     'Jason',
             'Jeong',
             '[email protected]',
             'Seoul'
            ];

조금은 나아졌지만 각 index가 어떤 정보를 갖고 있는지 미리 알아야 하는 불편함이 있다. user[1], user2[3] 이렇게 가독성도 떨어지게 된다.

3. 객체를 쓰면 어떻게 될까?

let user = {
            firstName: 'Steve', // key: value는 key-value pair라고 한다
            lastName: 'Lee',
            email: '[email protected]',
            city: 'LA' 
           };

이렇게 각각의 정보가 key와 value로 나눠져서 가독성도 훨씬 좋아지고 user.firstName 처럼 쉽게 정보를 찾아낼 수도 있다.

4. 객체의 key를 표현하는 방법

  • 닷 노테이션 (dot notation)
let user = {
            firstName: 'Steve', 
            lastName: 'Lee',
            email: '[email protected]',
            city: 'LA' 
           };
user.firstName; // 'Steve'
user.city; // 'LA'
  • 브라켓 노테이션 (Bracket notation)
let user = {
            firstName: 'Steve', 
            lastName: 'Lee',
            email: '[email protected]',
            city: 'LA' 
           };
user['firstName']; // 'Steve'
user['city']; // 'LA'

Bracket notation 안에는 꼭 ' ' or " "가 들어가야 한다.

user[firstName]; // []안에 ' '을 쓰지 않아서 틀린 표현이다. 
user[city]; // []안에 ' '을 쓰지 않아서 틀린 표현이다.

꼭 Bracket notation 을 써야만 할 때는 key값으로 동적인 변수가 들어올 때이다.

function getProperty(obj, property) { // 매개 변수는 항상 바뀔 수 있다
  if (obj[property] === undefined){
    return undefined;
  }
  return obj[property]; // 바뀌는 매개 변수를 처리하려면 bracket notation을 써야한다.
}
const person = {
  name: 'Steve',
  age: 16,
};
let output = getProperty(person, 'name'); 
console.log(output); // 'Steve'
output = getProperty(person, 'age');
console.log(output); // 16

5. 객체에 key가 있는 없는지 확인하는 법

let person = {
  name: 'Steve',
  age: 16,
  city: 'Seoul'
};
'name' in person; // true
'city' in person; // false

6. 객체에서 반복문을 쓰는 법

let person = {
  name: 'Steve',
  age: 16,
  city: 'Seoul'
};
for (key in person){
  console.log(key); // name, age, city
  console.log(person[key]); // 'Steve', 16, 'Seoul'
} 

좋은 웹페이지 즐겨찾기