TIL_36_with Wecode 026 javascript about object

객체의 키를 변수로 접근

const information = {
  name: '김개발'
}

키 하나를 생성하고, 그 키에 값을 할당해주려고 할 때,
키와 값을 변수를 통해 받아오려면?

const verb = 'developes'
const project = 'facebook'

verb 의 값을 키로 사용해야 하고, project의 값을 그 키의 값으로 사용한다고 할 때,

information[verb] = project

위와 같이 할당이 가능하다.

information 객체 안에 developes: 'facebook' 이 할당되었음을 확인할 수 있다.

객체 순회하기
객체도 배열처럼 순회가 가능하나, 정해진 순서가 없다. 그래서 객체의 순회는
'순서가 보장되지 않은 순회' 라고 부른다.
우리는 배열을 순회하기 위해서 for문을 통한 반복문으로 접근했었다.

const arr = ['coconut', 'banana', 'pepper', 'coriander']
for (let i = 0; i < arr.length; i++) {
  console.log(arr[i])
}

이런 식으로.
그러나, 객체는 length 키가 따로 주어져있지 않고, 인덱스도 없어서 위와 같은 반복문은 불가능하다.

1. Object.keys()
   Object.keys 메소드는 어떤 객체가 갖고있는 키들의 목록을 배열로 반환해주는 메소드이다.

const obj = {
  name: 'melon',
  weight: 4350,
  price: 16500,
  isFresh: true
}
Object.keys(obj) // ['name', 'weight', 'price', 'isFresh']

배열로 반환해줬음을 확인할 수 있다. 이제 위의 배열을 통하여 반복문을 사용할 수 있게 되었다.

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)
}

Object.keys 메소드 외에도 Object생성자의 메소드인 Object.values, Object.entries 가 있다.
Object.values는 객체의 키가 아닌 값으로 이루어진 배열을 반환한다.
Object.entries는 객체의 키와 값의 쌍으로 이루어진 길이 2짜리 배열로 이루어진 배열을 반환한ㄷ ㅏ... (무슨 말이지? 싶을 때는 콘솔로 찍어보자.)

values; 는 값만 반환되었음을 알 수 있다. entries; 는 하나의 배열마다 길이가 2 짜리로 이름과 값이 나왔음을 알 수 있다.

for-in
객체를 순회하는 두번째 방법.
반복문인 for문과 같은 종류의 문법이나, 객체와 배열을 위해 ES6에서 추가된 문법이다.

const arr = ['coconut', 'banana', 'pepper', 'coriander']
for (let i = 0; i < arr.length; i++) {
  console.log(i)
  console.log(arr[i])
}

(let i = 0; i < arr.length; i ++) 이런 문법이 자주 사용되는데, 이걸 간단하게 축약한 문법이 for-in 문법이다.

for (let i in arr) {
  console.log(i)
  console.log(arr[i])
}

결과가 같다.
i를 0으로 초기화하고, 배열의 길이와 비교하고, i를 1씩 증가시키는 등의 코드를 생략할 수 있게 만든 문법이다.
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문의 인덱스에 해당하는 변수가 숫자가 아닌 객체의 각각의 키에 해당하는 문자열을 할당받게 된다.

Assignment
getExamResult 함수를 구현해주세요.
인자 scores 는 다음과 같은 객체입니다.
객체의 요소의 갯수 및 키의 이름들은 달라질 수 있습니다.
객체의 값은 다음 9가지 문자열 중에서 하나를 가지고 있습니다.
('A+', 'A', 'B+', 'B', 'C+', 'C', 'D+', 'D', 'F')

{
  '생활속의회계': 'C',
  '논리적글쓰기': 'B',
  '독일문화의이해': 'B+',
  '기초수학': 'D+',
  '영어회화': 'C+',
  '인지발달심리학': 'A+',
}

인자 requiredClasses 는 다음과 같이 문자열로 된 배열입니다.

['영어회화', '기초수학', '공학수학', '컴퓨터과학개론']

다음 조건을 만족하는 객체를 리턴하도록 함수를 구현해주세요
1. scores 객체가 가지고 있는 키들은 새로운 객체에 포함되어야 합니다.
단, 그 값들은 다음 원리에 따라 숫자로 바뀌어 할당되어야 합니다.
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,
}

let scores = {
'생활속의회계':'C',
'논리적글쓰기':'B',
'독일문화의이해':'B+',
'기초수학':'D+',
'영어회화':'C+',
'인지발달심리학':'A+'
}
let requiredClasses = ['영어회화', '기초수학', '공학수학', '컴퓨터과학개론']
const getExamResult = (scores, requiredClasses) => {
  const result = {};
  let obj = {
    'A+' : 4.5,
    'A' : 4,
    'B+' : 3.5,
    'B' : 3,
    'C+' : 2.5,
    'C' : 2,
    'D+': 1.5,
    'D': 1,
    'F': 0
  };
  for (let i = 0; i < requiredClasses.length; i++) {
    let key = requiredClasses[i];
    result[key] = 0;
  }
  for (let j in scores) {
    let grade = scores[j];
    result[j] = obj[grade];
  }
  return result;
}
getExamResult(scores, requiredClasses);