본문 바로가기

JavaScript

JavaScript - 객체의 프로퍼티

객체의 프로퍼티 모던하게 작성하기

const name = ‘콩이’;
const birth = 2015;
const type = ‘cat’;

const kong = {
	name,
	birth,
	type,
}

위와같이, 변수명과 프로퍼티네임이 같으면 하나만 작성해도 된다.

변수 뿐아니라, 함수도 아래와같이 한 줄만 써도 된다.

function sleepOnDesk() {
	return `${name}(가) 책상에서 자고있다.`;
}

const kong = {
	name,
	birth,
	type,
	sleepOnDesk,
}

위의 sleepOnDesk함수를 객체 내부에서 직접 작성할때에는 아래과 같이 작성할 수 있다.

const kong = {
	name,
	birth,
	type,
	sleepOnDesk() {
		return `${name}(가) 책상에서 자고있다.`;
	}
}

계산된 속성명(computed property name)

const user = {
	[표현식] : 값,
};

표현식을 대괄호로 감싸면, 표현식의 값을 property  name으로 쓸 수 있다.

 

const user = {
	[표현식] : 값,
};

표현식을 대괄호로 감싸면, 연산의 결과 또는 함수의 리턴 값 등을 property name으로 사용 가능하다.

optional chaining

console.log(user.cat?.name);

user라는 객체에 cat이라는 프로퍼티가 없는 경우, opritonal chaining을 사용하지 않는다면 에러가 발생한다.

하지만 위와같이 cat? 을 사용하므로 콘솔에는 에러가 아닌 undefined가 찍히게 된다.

왼편의 프로퍼티값이 undefined 또는 null이 아니라면, 그 다음 프로퍼티 값을 리턴하고, 그렇지 않은경우에는 undefined를 반환하는 문법이다.

'JavaScript' 카테고리의 다른 글

JavaScript - 에러와 에러객체  (1) 2023.10.11
JavaScript - 구조분해  (0) 2023.10.11
JavaScript - Spread  (0) 2023.10.11
JavaScript - 문장과 표현식  (0) 2023.10.11
JavaScript - 함수 다루기  (0) 2023.10.11