Dot vs Bracket

Dot notation 과 Bracket notation의 차이를 알아보자

const bobo ={
	firstName = 'Bobo',
	lastName = 'Kim',
	age = 2021-1998,
	job = 'student',
	family = ['father', 'mother', 'sister'],
}

위 와 같은 오브젝트가 있다.

이 때 김보보의 나이를 알고 싶으면 어떻게 하면 될까?

console.log(bobo.age) // Dot notation
console.log(bobo['age']) // Bracket notation

위와 같이 Dot을 사용하면 오브젝트의 이름 뒤에 . 과 key를 적으면 되고

Bracket을 사용하면 오브젝트의 이름 뒤에 [ ] 와 그 사이에 key를 문자열로 전달하면 된다.

그런데 Bracket notation을 사용하는 방법이자 장점은 한가지가 더 있다.

바로 [ ] 사이에 expression을 작성할 수 있다.

const bobo ={
	firstName = 'Bobo',
	lastName = 'Kim',
	age = 2021-1998,
	job = 'student',
	family = ['father', 'mother', 'sister'],
}

const name = 'Name';
cosole.log(bobo['first' + name])
console.log(bobo['last' + name])

이와 같이 expression을 [ ]사이에 작성할 수 있다.

물론 Dot notation이 깔끔하고 보기 좋기만 Bracket notation도 상황에 따라 필요할 때가 있으므로 기억해두자!