레플릿 문제 복습 두번째..! 레플릿을 풀다보면 걸리는 문제들이 하나 둘씩 나왔는데 그 중 강력한 하나가 바로 30번 문제였다...🤬 동기들한테 몇번 풀고 계시냐고 물어보면 30번에서 막혀서 괴로워하시는 분들이 많았는데 나도 그 중 하나였다...
다 풀고나니 막상 코드가 복잡하진 않은데 메서드나 문법을 활용하는 부분에 있어서 머리속으로 어떤 값이 뽑아져 나올지 상상(?)하고 그리면서 푸는 부분이 익숙하지 않아 어려웠던 것 같다(나는 그랬다...)
쨋든 그래서 문제의 30번을 다시 한번 보면서 사용된 개념들을 정리해보고자 한다.
객체 접근
변수로 접근하기
const userInfo = {
name: '홍길동',
age: 27
}
위와 같은 객체에 키를 생성하고 그 키에 값을 할당해준다고 했을 때, 그 키와 값을 변수를 통해 받아 올 수 있다.
const phone = 'iphone'
const number = '01012345678'
userInfo[phone] = number // '01012345678'
console.log(userInfo) // { name: '홍길동', age: 27, iphone: '01012345678' }
phone이 key가 된 것이고, number의 값이 phonekey의 값이 된 것이다. 이렇게 변수로 선언하는 경우 변수phone과 number가 가지는 값에 따라 다른 키와 값을 가지는게 가능하게 된다.
Object.keys()
이 메소드는 어떤 객체가 가지고 있는 키를 배열로 리턴한다.
const menu = {
name : 'pizza',
price : 20000,
size : 'large'
}
Object.keys(menu) // [ 'name', 'price', 'size' ]
Object.values()
객체의 키가 아닌 키 값들을 배열로 리턴한다.
const menu = {
name : 'pizza',
price : 20000,
size : 'large'
}
Object.values(menu) // [ 'pizza', 20000, 'large' ]
Object.entries()
객체의 키와 값을 짝지어 배열로 리턴한다. 각 배열의 인덱스[0]은 키를 나타내고 인덱스[1]은 값을 나타내게 된다.
const menu = {
name : 'pizza',
price : 20000,
size : 'large'
}
Object.entries(menu) // [[ 'name', 'pizza' ],[ 'price', 20000 ],[ 'size', 'large' ]]
객체 순회
배열에서 순회를 할 때는 반복문 for문을 사용했지만, 객체는 배열과 다르게 정해진 순서가 없기 때문에 for문을 이용해 객체의 키에 접근 할 수가 없다.
(배열에서는 배열의 length를 통해서 요소에 접근 할 수 있었지만 객체에는 length를 통해서 접근할 수 없기 때문이다.)
따라서, 객체에서는 for-in문을 통해 순회할 수 있다.
const menu = {
name : 'pizza',
price : 20000,
size : 'large'
}
for(let key in menu){
const value = menu[key];
console.log(key) // 'name' 'price' 'size'
console.log(value) // 'pizza' 20000 'large'
}
인덱스에 해당하는 변수key가 객체의 각각의 키에 해당하는 문자열을 할당 받게 된다. 그리고 위에서 말했던 변수로 접근하여 그에 해당하는 키 값에 접근 할 수 있게 되는 것이다.
Assignmemt
1. scores 객체가 가지고 있는 키들은 새로운 객체에 포함되어야 합니다. 단, 그 값들은 다음 원리에 따라 숫자로 바뀌어 할당되어야 합니다.
2. requiredClasses 배열의 요소로는 존재하지만, scores의 키로는 존재하지 않는 항목이 있다면, 해당 요소는 새로운 객체의 키가 되고, 값으로 0을 가져야 합니다. 처음에 문제를 받았을 때, 문제 자체가 잘 이해가 가지 않아서 어려움이 있었다. 문제의 의도를 간단히 요약하자면 주어진 객체의 키 값을 새로운 객체의 키 값으로 바꾸어 그 객체를 반환하라는 뜻이 었다.
먼저 문제에서 주어진 객체와 배열 및 새로운 조건은 다음과 같다.
const scores = {
'생활속의회계': 'C',
'논리적글쓰기': 'B',
'독일문화의이해': 'B+',
'기초수학': 'D+',
'영어회화': 'C+',
'인지발달심리학': 'A+',
}
const requiredClasses = ['영어회화', '기초수학', '공학수학', '컴퓨터과학개론']
A+ => 4.5
A => 4
B+ => 3.5
B => 3
C+ => 2.5
C => 2
D+ => 1.5
D => 1
F => 0
문제에 조건에 맞는 새로운 객체를 반환하기 위해서는 먼저 빈 객체를 선언해준 뒤 그 객체에 내가 필요한 key와 값들을 넣어 주어야 한다.
const result = {};
const numericScores = {
'A+': 4.5,
'A': 4,
'B+': 3.5,
'B': 3,
'C+': 2.5,
'C': 2,
'D+': 1.5,
'D': 1,
'F': 0
}
for (let key in scores) {
result[key] = numericScores[scores[key]] // 객체 result의 key값으로 학점을 넣는 것을 의미
}
학점을 나타내는 객체인 numericScores을 조건에 맞게 만들어 주었고, for in 을 사용해 객체를 순회 하도록 한다.
이때, 변수로 객체에 접근 하는데, scores[key]는 'C', 'B', 'B+', 'D+', 'C+', 'A+' 이고, 이 값이 numericScores[] 에 순차적으로 들어가고, key에 맞는 값들 (2, 3, 3.5, 1.5, 2.5, 4.5)을 얻게 되고 이 값이 result[key] = result 객체의 키 값으로 들어가게 되는 것이다.
문제에서 존재하지 않은 과목의 키 값은 0으로 해야한다고 했으니, 풀이는 다음 처럼 될 수 있다.
...
const name = Object.keys(scores); // scores의 key를 배열로 뽑아냄 ['생활속의회계', '논리적글쓰기', '독일문화의이해', '기초수학', '영어회화', '인지발달심리학']
for (let i in requiredClasses) {
if (!name.includes(requiredClasses[i])) {
result[requiredClasses[i]] = 0;
}
}
마무리✨
변수로 객체에 접근하는 법을 이번에 처음 알게돼서 조금 낯설어서 초반에 문제를 푸는데 어려움이 있었던 것 같다.
무작정 문제를 푸는데 집중하는 것 보다 문법의 원리를 잘 생각하고 머리 속으로 그려보면서 순차적으로 하나하나 해결해 나가는것 (1.빈 객체 생성 -> 2.key 값 구해오기 -> 3. 어디서 key값을 가져올지 생각하기 (이때 사용할 문법은?) 등등...) 이런 식으로 자신만의 로직을 만들어가는 것이 중요한 것 같다...!!
