[JS] 유용한 10가지 배열 함수들

• (드림코딩 by 엘리) 자바스크립트 9. 강의를 보고 정리했습니다.

Q1. make a string out of an array

// 내 코드
const fruits = ['apple', 'banana', 'orange'];
console.log(fruits.toString()); // apple,banana,orange

// solution
const result = fruits.join();
console.log(result); // apple,banana,orange

• join()은 디폴트값으로 구분자 ,가 들어가고, 구분자 지정도 가능하다.

Q4. make new array without the first two elements

// 내 코드
const array = [1, 2, 3, 4, 5];
console.log(array.splice(2)); // [3, 4, 5]

// solution
const result = array.slice(2, 5);
console.log(result); // [3, 4, 5];

• splice() : 원래의 배열 자체를 수정
• slice() : 배열에서 원하는 부분만 return

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),
];

Q5. find a student with the score 90

const result = students.find((student) => student.score === 90;
console.log(result); // name "C" 인 Student object 출력

• find : 콜백함수를 받아 배열을 돌면서 가장 먼저 true가 나오면 return
• filter인지 map인지 고민했는데 둘 다 아니었다.

Q6. make an array of enrolled students

const result = students.filter((student) => student.enrolled);
console.log(result); // [Student, Student, Student] 배열에 A, C, E가 들어있음

• filter : 콜백함수를 받아 배열을 돌면서 true인 값들만 배열로 return

Q7. make an array containing only the students' scores

result should be: [45, 80, 90, 66, 88]

const result = students.map((student) => student.score);
console.log(result);

• map : 배열을 돌면서 각각의 원소에 콜백함수 실행, 리턴값들을 배열로 return

Q8. check if there is a student with the score lower than 50

const result = students.some((student) => student.score < 50);
console.log(result); // true

const result2 = students.every((student) => student.score < 50);
console.log(result); // false

• some : 콜백함수의 리턴값이 true인 것이 있는지 없는지 알려줌
• every : 콜백함수의 리턴값이 모두 true인지 아닌지 알려줌

Q9. compute students' average score

// 내 코드
const scores = students.map((Student) => Student.score);
console.log(scores);

let sum = 0;
for (let score of scores) {
  sum = sum + score;
}

const average = sum / scores.length;
console.log(average); // 73.8

// solution
const result = students.reduce((prev, curr) => prev + curr.score, 0); // 0은 맨 처음 (initial) 값 지정한 것
console.log(result); // 369
console.log(result / students.length); // 73.8

• reduce : 우리가 원하는 시작점부터 모든 배열을 돌면서 어떤 값을 누적할 때 쓴다.
  • The return value of the callback function is the accumulated result.
  • and is provided as an argument in the next call to the callback function.

Q10. make a string containing all the scores

`result should be: '45, 80, 90, 66, 88'``

const result = students
.map(student => student.score)
.filter((score) => score >= 50)
.join();
console.log(result); // 80,90,66,88

• 위와 같이 뒤에 덧붙여서도 사용 가능하다.
• filter를 빼면 문제에서 요구하는 답대로 나옴
• 이렇게 묶어서 하는 걸 함수형 프로그래밍이라고 한다.