☭DEVELOPER/#4 자바스크립트

자바스크립트 | 레츠기릿 자바스크립트 15 객체 리터럴

조반짝 2024. 4. 30. 11:31
728x90
반응형

객체리터럴


객체는 여러개의 변수를 하나의 변수로 묶을 때 사용한다.

 

아래 코드는 문제가 없는 것 같지만, 다른사람의 정보를 추가로 표현하고 싶을 때는 문제가 된다.

이미 name, year... 변수를 선언했으므로 다른사람을 표현할 때는 이 변수들을 재사용할 수 없다.

const name = '조현영';
const year = 1994;
const month = 8;
const date = 12;
const gender = 'M';

 

이럴 때 객체를 사용하면 여러개의 변수를 하나로 묶을 수 있다.

객체 내부에 사용되는 naem, year... 같은 정보들을 속성(property)라고 한다.

속성은 속성이름 속성 값으로 구분된다.

name: '조현영' 이란 속성에서는 name이 속성이름이고 '조현영'은 속성값이 된다.

이처럼  { }를 사용해 객체를 표현하는 것을 객체 리터럴이라고 한다.

const zerocho = {
  name: '조현영'
  year: 1994,
  month: 8,
  date: 12,
  gender: 'M',
};

 

객체리터럴 형식

const 객체 = {
  속성 1 이름: 속성 1 값,
  속성 2 이름: 속성 2 값,
  속성 3 이름: 속성 3 값,
}

 

 

객체의 비교


객체를 다룰 때 가장 많이 실수하는 상황이 있다. 바로 객체 간에 비교 연산을 할 때이다.

 

객체가 아닌 숫자, 문자열, 불 값, null, undefined 는 모두 true를 반환한다. 

{} === {}

//실행결과
false

 

객체는 모양이 같아도 생성할 때마다 새로운 객체가 생성된다.

따라서 같은 객체인지 비교하고 싶다면 기존 객체를 변수에 저장해 두어야한다.

const a = {name: 'cho' };
const array = {1, 2, a};
console.log(a === array[2]);

//실행결과
true

 

 

옵셔널 체이닝


cho.unknown.first()


cho.unknown?.first()

// 옵셔널 체이닝 + 배열
cho.unknown?.[0]
728x90
반응형