TIL: 16일차 "Object"

mr.ginger·2021년 4월 20일
0

Object란?

자바스크립트는 object기반으로 만들어진 언어이며, 자바스크립트를 이루는 거의 모든것이 object라고 해도 과언이 아니다.
object는 key와 value로 이루어진 데이터(property)집합이며, 자바스크립트의 모든 요소를 이 데이터의 값으로 사용할 수 있다.

말이 어렵기에 쉽게 예를 들어보자

const person = {
  name : Gin,
  age : 29,
  gender : male
};

등과 같이, person을 이루고 있는 속성을 대괄호({})로 묶어둔것이 바로 object인것이다.

그럼 object가 무엇인지는 알게 되었다. 그렇다면 이걸 어디에다 사용 할 수 있을까?
우리는 이 person을 이루고 있는 속성을 하나씩 가져 올 수 있다.

위의 코드를 다시 보자.
person의 이름을 가져오려 할때는 person.name으로, 즉 object의 key를 사용하는것으로 그 값(value)을 가져 올 수 있는것이다.
아까 우리는 자바스크립트의 대부분이 object로 이루어진것을 알았다.
그럼 아까와 같은 방법으로 자바스크립트의 대부분의 데이터(property)를 조회하고, 그 값을 읽을 수 있는것이다.

한번 우리가 선언한 object는 키를 이용해서 그 값을 갱신 할 수 있고, 새로운 값을 추가하거나 삭제하는것도 물론 가능하다.
object안에 들어갈 수 있는 데이터의 종류는 우리가 알고 있는 데이터 타입은 모두 넣을 수 있다.
string, number, boolean, array, object 모두 object에 넣을 수 있는 데이터 타입이다.

object안에 들어가는 key와 value가 같을 경우엔

const keys = {
  apple = apple,
  banana = banana
};

즉 이런 경우를 위해서 특별한 기능이 있는데,

const keys = {
  apple,
  banana
};

과 같이 단축하는것이 가능하다.

안에 있는 key와 value를 찾고 싶은 경우엔 in을 사용해서 object 안에 해당 key와 value가 존재하는지 찾을 수 있다.
in을 반복문과 조합해서 사용하면 해당 object안에 존재하는 모든 key 혹은 value를 출력 할 수 있다.

또한 이 object를 통해 html,css,혹은 browser도 자바스크립트로 움직일 수 있는데, 이것이 바로 DOM(Document-Object-Model)과
BOM(Browser-object-Model)이다.
대부분이 object로 이루어져 있기에, object를 이용한 조작이 가능한것이다.

이 DOM과 BOM으로 구체적으로 어떤것을 할 수 있는지는 추후에 다루겠지만,
다음엔 데이터를 정리하는 또다른 방법인 배열에 대해 먼저 알아보도록 하겠다.

0개의 댓글