객체의 특정 키의 값을 가져오는것도 가능하지만, 반대로 객체에 특정 키를 만들고 값을 할당하는것도 가능하다.
information이라는 객체를 먼저 하나 만들고,
const information = {
name: '김개발'
}
여기에 키와 값을 만들어주고,
const verb = 'developes' //키
const project = 'facebook' //값
verb의 값을 키로, project의 값을 그 키의 값으로 할당해준다.
[A],[B]방법 모두 할당이 가능하다.
[A]의 경우 verb와 project가 어떤 값을 가지냐에 따라 다른 키와 값을 가지게되지만, [B]의 경우는 키와 값이 항상 정해져 있게 된다.
information[verb] = project // [A]
information.developes = 'facebook' // [B]
객체도 배열과 같이 순회가 가능하다. 그러나, 배열과는 다르게 명확한 순서가 없기 때문에, 어떤 순서로 객체의 키 값에 접근하게되는지는 알 수 없다. 따라서, 객체의 순회는 "순서가 보장되지 않은 순회"
라고 부른다.
배열 순회시에는 for문
을 이용했으나, 객체는 length 키가 따로 주어져있지 않고, 인덱스도 없기 때문에 for문을 이용한 순회는 불가능하다. 대신, 다음의 2가지 방법으로 객체를 순회할 수 있다.
Object.keys 메소드는 어떤 객체가 가지고 있는 키들의 목록을 배열로 리턴하는 메소드이다. 더불어, 객체의 내장 메소드가 아니라 객체 생성자인 Object가 직접 가지고 있는 메소드다.
object.keys()
의 사용방법을 보자.
const obj = {
name: 'melon',
weight: 4350,
price: 16500,
isFresh: true
}
Object.keys(obj) // ['name', 'weight', 'price', 'isFresh']
Object.keys()
는 배열을 리턴하기 때문에, 이제 반복문을 사용할 수 있게된다!
const keys = Object.keys(obj) // ['name', 'weight', 'price', 'isFresh']
for (let i = 0; i < keys.length; i++) {
const key = keys[i] // 각각의 키
const value = obj[key] // 각각의 키에 해당하는 각각의 값
console.log(value)
}
새로운 ES6 문법에서 Object생성자의 메소드인 Object.values
, Object.entries
와 같은 자매품들이 추가되었다.
Object.values
는 객체의 키가 아닌 값으로 이루어진 배열을 리턴한다.
const values = Object.values(obj)
// values === ['melon', 4350, 16500, true]
Object.entries
는 객체의 키와 값의 쌍으로 이루어진 길이 2짜리 배열로 이루어진, 배열을 리턴한다. 각 배열에서 인덱스 [0]의 값은 각각의 키를, 인덱스 [1]의 값은 해당 키에 해당하는 값을 가지게 된다.
const entries = Object.entries(obj)
/*
entries === [
['name', 'melon'],
['weight', 4350],
['price', 16500],
['isFresh', true]
]
*/
for-in 문
은 반복문인 for문과 같은 종류의 문법이며, 객체와 배열에서 모두 사용가능하다.
//for 문을 사용한 반복문
const arr = ['coconut', 'banana', 'pepper', 'coriander']
for (let i = 0; i < arr.length; i ++) {
console.log(i)
console.log(arr[i])
}
// for-in 문을 사용한 반복문
const arr = ['coconut', 'banana', 'pepper', 'coriander']
for (let i in arr) {
console.log(i)
console.log(arr[i])
}
i를 0으로 초기화하고, 배열의 길이와 비교하고, i를 1씩 증가시키는 등의 코드를 생략할수 있게 만든 ES6 문법으로, for-in 문
은 인덱스의 값으로 무엇을 할당하고, 반복문이 몇번 돌아야 할 지를 자바스크립트 엔진 내부에서 자동 결정한다.
//for-in문을 사용한 객체 순회
const obj = {
name: 'melon',
weight: 4350,
price: 16500,
isFresh: true
}
for (let key in obj) {
const value = obj[key]
console.log(key)
console.log(value)
}
이렇게 객체를 가지고 for-in 문을 사용하면, for-in 문의 인덱스에 해당하는 변수가, 숫자가 아닌 객체의 각각의 키에 해당하는 문자열을 할당받게 됩니다.??
getExamResult 함수를 구현해주세요.
인자 scores 는 다음과 같은 객체입니다.객체의 요소의 갯수 및 키의 이름들은 달라질 수 있습니다.객체의 값은 다음 9가지 문자열 중에서 하나를 가지고 있습니다.
('A+', 'A', 'B+', 'B', 'C+', 'C', 'D+', 'D', 'F')
{
'생활속의회계': 'C',
'논리적글쓰기': 'B',
'독일문화의이해': 'B+',
'기초수학': 'D+',
'영어회화': 'C+',
'인지발달심리학': 'A+',
}
인자 requiredClasses 는 다음과 같이 문자열로 된 배열입니다.
['영어회화', '기초수학', '공학수학', '컴퓨터과학개론']
다음 조건을 만족하는 객체를 리턴하도록 함수를 구현해주세요
A+ => 4.5
A => 4
B+ => 3.5
B => 3
C+ => 2.5
C => 2
D+ => 1.5
D => 1
F => 0
2.requiredClass 배열의 요소로는 존재하지만, scores의 키로는 존재하지 않는 항목이 있다면,해당 요소는 새로운 객체의 키가 되고, 값으로 0을 가져야 합니다.위에서 예시로 묘사된 객체와 배열이 인자로 들어왔다면,
다음과 같은 객체과 리턴됩니다.
{
'생활속의회계': 2,
'논리적글쓰기': 3,
'독일문화의이해': 3.5,
'기초수학': 1.5,
'영어회화': 2.5,
'인지발달심리학': 4.5,
'공학수학': 0,
'컴퓨터과학개론': 0,
}
최종 결과값을 넣어줄 빈 객체result
를 만들고,
A,B,C..학점을 키값으로, 1,2,3..학점을 벨류값으로하는 객체를 만든다.
먼저, requiredClasses
을 for in으로 반복문을 돌려 key값을 얻고, value 값은 0으로 만들어 아까 만들어둔 result
객체에 넣는다.
여기까지하면,
result = {
영어회화 : 0,
기초수학 : 0,
공학수학 : 0,
컴퓨터학개론 : 0
}
이다.
-scores를 for in 반복문을 돌려 반환될 키값을 obj
라는 변수에 담아준다.
- (가장 중요한 부분!!!)
score의 값은,
'생활속의회계'
'논리적글쓰기'
'독일문화의이해'
'기초수학'
'영어회화'
'인지발달심리학'
이다.
result
객체 안에 score
값을 키값으로 넣어주면, 일단, result
의 키값과 score
의 값이 겹치는 경우 그 값의 키값은 undifined가 될것이고, 겹치지 않는 경우 score
의 값이 result
에 새로 추가될 것이다. -그렇게 만들어진 result[score]
는 numToString[obj]
로 할당이 되는데, numToString[obj]
는 munToString
의 키값과 obj의 값이 겹칠 경우, munToString
의 value값인 숫자를 얻게된다.
result[score]
가 키값으로 numToString[obj]
를 갖게된다!!const scores = {
'생활속의회계': 'C',
'논리적글쓰기': 'B',
'독일문화의이해': 'B+',
'기초수학': 'D+',
'영어회화': 'C+',
'인지발달심리학': 'A+',
};
const requiredClasses = ['영어회화', '기초수학', '공학수학', '컴퓨터과학개론'];
const getExamResult = (scores, requiredClasses) => {
const result = {}
const numToString = {
'A+':4.5,
'A':4,
'B+':3.5,
'B':3,
'C+':2.5,
'C':2,
'D+':1.5,
'D':1,
'F':0
}
for (let requiredClass in requiredClasses) {
const key = requiredClasses[requiredClass];
result[key] = 0;
}
for (let score in scores){
const obj = scores[score];
result[score] = numToString[obj];
}
return result
}
getExamResult(scores, requiredClasses)
/*
{
'영어회화': 2.5,
'기초수학': 1.5,
'공학수학': 0,
'컴퓨터과학개론': 0,
'생활속의회계': 2,
'논리적글쓰기': 3,
'독일문화의이해': 3.5,
'인지발달심리학': 4.5
}*/
두번째 for in문의 result[score] = numToString[obj];
부분을 이해하지 못했었다. 할당이라는 개념을 이해하는데 혼동이 있었던 것같다. 할당이라는 개념으로 이 한줄을 해결하고나니 속이 엄청나게 시원했다 ㅠㅠㅠㅠ행복쓰 😭