[TIL 1/24]

i do as i say·2020년 1월 24일

객체

우리가 만약 회원 주소록을 만든다고 가정했을 때, 한 사람에 대한 여러 가지 정보들을 담을 수 있는 방법은 무엇이 있을까.

일단, 한 사람의 정보들을 하나의 변수에 하나씩 담을 수 있다.

let userFirstName = 'Yujeong';
let userLastName = 'Lee';
let userEmail = 'ihannah@kakao.com';
let userCity = 'Seoul';

한 사람의 대한 정보인데 4 개의 변수가 필요하다. 세상에 단 한 명이라면 괜찮겠지만, 세상엔 70억 명의 사람이 있다. 70억 명 중 한 명의 정보를 더 입력해 보자.

let userFirstName = 'Daniel';
let userLastName = 'Kang';
let userEmail = 'danik@kakao.com';
let userCity = 'Busan';

이런 식으로 매번 여러 개의 변수를 선언해 주어야 되는데, 굉장히 소모적인 방법이 아닐 수 없다. 한 사람에 4 개씩만 해도 열 명은 40 개, 100 명은 400 개가 필요하다. 이것만이 문제가 아니다.

변수들끼리 전혀 관계가 없다. Yujeong과 Lee는 전혀 관계가 없는데, 변수의 이름이 userFirstName이고, LastName이기 때문에 '같은 사람인가 보다' 하면서 추측하는 것이다.

이런 문제는 어떻게 개선할까.

변수를 그룹에 담는 배열을 써 보자.

let user = [ 'Daniel' , 'Kang' , 'danik@kakao.com', 'Busan' ];

얼핏 보면 그럴 듯해 보인다. 한 사람에 대한 정보라는 것을 알 수 있어서 관계성은 있어 보인다. 하지만 이것에 대한 문제는 분명히 있다.

각 값이 하나의 변수로 묶여 있긴 하지만 각 인덱스가 어떠한 정보를 가지고 있는지 미리 알아야 된다.

1 번째 인덱스는 이름, 2 번째 인덱스는 성, 등. 인덱스로 접근할 경우엔 가독성도 떨어진다. 인덱스의 값이 어떠한 것인지 직접 하나씩 찍어 보아야 알 수 있고, 배열에 대한 구조를 아는 소수만이 쓸 수 있다.

이런 문제점들을 보완할 수 있는 게 바로 객체라는 것이다.

하나의 변수 안에 여러 가지의 정보가 담겨 있을 때 적합한 자료 구조, 객체

객체는 이런 식의 구조를 가지고 있다.

let user = {
  firstName: 'Daniel',
  lastName: 'Kang',
  email: 'danik@kakao.com',
  city: 'Busan'
};

키와 값의 쌍(key-value pair)으로 이루어져 있고, 순서가 없다. 인덱스 = 키로 생각하면 편하다.

firstName: 'Daniel';

키(key): firstName
키와 값 사이는 콜론:으로 구분한다.
값(value): 'Daniel'

값에는 String, Number, Object, Array가 중첩되어 들어갈 수 있다.

중괄호를 이용해서 객체를 만들고, 키-값 쌍은 쉼표로 구분한다.

let user = {
  firstName: 'Daniel',
  lastName: 'Kang',
  email: 'danik@kakao.com',
  city: 'Busan'
};

객체의 값을 사용하는 법에는 두 가지가 있다.

user.firstName; // 'Daniel'
user.city; // 'Busan'

변수.키;
객체의 속성을 가지고 오는 것이다.
보통 불변의 키 값을 가지고 있을 때 닷 노테이션을 쓴다.

user.isStudent = false;
user.tags ['#Produce101', '#WANNAONE']; //추가
delete user.tags;
delete user.isStudent; //삭제

user['firstName']; // 'Daniel'
user['city']; // 'Busan'

변수['키'];
객체의 속성을 가지고 오는 것이다.
대괄호 안에 따옴표를 찍어야 한다. (문자열로 들어갑니다.)
보통 변수의 키 값을 가지고 있을 때 브라켓 노테이션을 쓴다.

브라켓 노테이션을 이용할 때 흔히 하는 실수가 있다. 대괄호 안에 따옴표를 넣지 않는 실수인데, 변수를 넣을 땐 따옴표를 쓰면 안 되지만, user 안에 있는 키 값을 넣을 땐 꼭 따옴표를 써야 된다. 그렇지 않으면 에러가 뜬다. 정의된 적이 없기 때문이다.

변수로 정의를 하게 되면 쓰임이 가능하다.

tweet = { content: '프리 코스 재미있어요!' };
let keyname = 'content';
tweet[keyname];
//'프리 코스 재미있어요!'

user['isStudent'] = false;
user['tags'] ['#Produce101', '#WANNAONE']; //추가
delete user['tags'];
delete user['isStudent']; //삭제

in 연산자를 통해 해당하는 키가 있는지 확인할 수도 있다.

'tags' in user; //true
'isStudent' in user //false

(따옴표 안의 키 값) in (객체 이름);

커신이 고칼로리