Unit.8 [JS 배열과 객체]

2023. 1. 2. 09:57코드스테이츠/코드스테이츠 : 위클리 회고

성취도 

 

이해도 자가 점검 리스트

Chapter1. 배열

  • 배열에서 특정 인덱스(index)의 요소(element)를 조회하거나, 변경할 수 있다.
  • length 속성을 이용하여 배열의 길이를 조회할 수 있다.
  • 배열의 요소가 배열인 이중 배열을 이해하고, 이중 배열의 요소를 조회하거나 변경할 수 있다.
  • 배열의 각 요소에 대하여, 반복하는 코드를 실행시킬 수 있다.
  • 배열에서 사용되는 다양한 메서드를 알고 사용할 수 있다.
    • split(), join(), slice(), splice(), Array.isArray(), push(), unshift(), pop(), shift(), indexOf(), includes()

Chapter2. 객체

  • 배열과 객체의 특징을 구분하고, 배열과 객체의 특징에 따라 웹 애플리케이션 개발 시 어떻게 사용되는지 이해한다.
  • 객체 속성(property)의 추가, 조회, 변경, 삭제를 자유자재로 할 수 있다.
  • 객체 속성 조회법 두 가지, dot notation과 bracket notation의 차이를 이해한다.
  • 배열과 객체에 반복문을 응용하여 능숙하게 대량의 정보를 다룰 수 있다.

 

 

Unit8 소감

배열과 객체는 다양한 메서드의 활용방법에 대해 알고, 이를 적재적소에 잘 활용하는것이 핵심이라고 느꼈다.

메서드들만 잘 조합해서 사용 할 수만 있어도 기본적인 배열,객체 알고리즘은 간결하게 풀이가 가능했던 것 같다.

 

활용예시

배열을 모두 돌며 전달한 콜백함수의 해당하는 요소들을 새로운 배열로 리턴해주는 .map

그 새로운 배열을 돌면서 전달한 콜백함수에 조건에 부합하는 요소들을 모아 새로운 배열을 만들어주는 .fliter

배열을 문자열로 만들어주는 .join

배열을 오름차순 내림차순으로 정렬해주는 .sort 등 4개의 메소드만 사용해도 이러한 간단한 알고리즘을 풀어 낼 수 있다.

class Student {
  constructor(name, age, enrolled, score) {
    this.name = name;
    this.age = age;
    this.enrolled = enrolled;
    this.score = score;
  }
}
const students = [
  new Student('A', 29, true, 45),
  new Student('B', 28, false, 80),
  new Student('C', 30, true, 90),
  new Student('D', 40, false, 66),
  new Student('E', 18, true, 88),
];


50점 이상인 점수들로 이루어진 배열을 문자열로 바꾸어라
const res2 = students
    .map((student) => student.score) //학생들의 점수로 배열을 만들고
    .filter((score) => score >= 50) // 점수배열에서 50점 이상인 학생들을찾아서,
    .join(); // 문자열로 만들어라.

console.log(res2);
// "80,90,66,88"

학생들의 점수를 오름차순으로 정렬하고 문장열로 바꾸어라.
const res = students
    .map((student) => student.score) //학생들의 점수로 배열을 만들고
    .sort() //오름차운으로 정렬해서
    .join(); // 문자열로 만들어라.

console.log(res);
// '45,66,80,88,90'