<JavaScript> Object 객체(2)

🐥자바스크립트 기초 문제 풀이

객체에서 이미 존재하는 key에 값을 다시 한 번 할당하면 변경되고,
이전에 없던 key로 접근하면 새로운 프로퍼티가 추가 된다.

⬇️다양한 방법으로 key에 접근하고 값을 재할당, 추가하는 모습⬇️

let difficult = {
  name : 'n',
  color : 'c'
}
console.log(difficult['name']);
//n이 출력됨
difficult['name'] = '값 바꾼다';
console.log(difficult['name']);
//재할당했으니 n이 아니라 '값 바꾼다'가 출력됨

difficult.color = '색깔';
console.log(difficult.color);
//재할당했으니 c가 아니라 '색깔'이 출력됨

console.log('생성전: ' + difficult.new);
//값이 할당된 적 없으므로 undefined 출력!
difficult.new = '새로 추가된 프로퍼티';
console.log('생성후: ' + difficult.new);
//값을 추가했으니 '새로 추가된 프로퍼티'가 출력됨

중첩된 객체 (Nested Object)

다음과 같이 중첩된 객체에서 'simple'을 출력하려면 어떻게 접근해야할까?

let nestedObj = {
	type: {
		year: '2019',
		'comment-type': [{
			name: 'simple'
		}]
	}
}

console.log(nestedObj.type.['comment-type'][0].name)
라고 적어야 접근이 가능하다!

풀어보면,
nestedObj라는 객체 속의
type이라는 객체 속의
'comment-type'라는 key값 속의
0번째 배열 속의
name이라는 key값!

에 접근 한 것이기때문에
'simple'이라는 value를 출력할 수 있다.

Assignment

getAnswer 함수를 구현해 주세요.
getAnswer 함수는 아래의 객체에서 '샐러드' 라는 값을 출력합니다.
let myProfile = {
name: '김개발',
address: {
email: '[email protected]',
home: '위워크'
},
'my favorite': {
food: [{
name: '샐러드',
price: 3500
}, {
name: '삼겹살',
price: 15000
}],
hobby: ['축구']
}
}

나의 답안

function getAnswer() {
  let result = myProfile['my favorite'].food[0].name
  return result;
}

myProfile이라는 객체 속의
'my favorite'이라는 key값 속의
food라는 객체 속의
0번째 배열 속의
name이라는 key값
에 접근한 결과를 return했다!

보다보니 같은 대괄호 안에서도 그냥 대괄호 안에 덜렁 쓰여진 key와 따옴표로 써진 key의 차이에 대해서 혼동이왔어서.. 다시 정리해봐야겠담

♥︎ 대괄호 안에 덜렁 있는 key는 이전에 설명한 바와 같이 변수이름을 적을 때만! 그렇게 쓰는거다.
ex. 객체이름[변수이름]

♥︎ 대괄호 안에 따옴표 속에 쓰여진 key는 띄어쓰기를 포함한 string형의 key인 것이다.
ex. 객체이름['문자열이름']

♥︎ 온점으로 접근하는 방식은 정말 딱 해당 key의 이름과 정확히 일치하는 이름을 적을 때 사용하는것이다! 띄어쓰기는 포함될 수 없다.
ex. 객체이름.정확한key이름!

아주 기초적인 내용이지만
자꾸만 헷갈리는걸~~
못살아