[JS] 10가지 배열함수들, Array APIs 총정리

1. join : 배열에 있는 요소들을 ,로 연결해 string으로 만든다.

// Q1. make a string out of an array
{
    const fruits = ['apple', 'banana', 'orange'];
    const result = fruits.join(',');
    console.log(result);
  }

 

2. split : string을 구분자를 기준으로 분리한다.

 // Q2. make an array out of a string
  {
    const fruits = '🍎, 🥝, 🍌, 🍒';
    const result = fruits.split(',');
    console.log(result);
  }

 

3. reverse : 배열의 반대로 정렬

  // Q3. make this array look like this: [5, 4, 3, 2, 1]
  {
    const array = [1, 2, 3, 4, 5];
    const result = array.reverse();
    console.log(result);
    console.log(array);
  }

 

4. slice : start부터 end-1까지 return

// Q4. make new array without the first two elements
  {
    const array = [1, 2, 3, 4, 5];
    const result = array.slice(2, 5);
    console.log(result);
    console.log(array);
  }

 

5. find : 배열 안에서 true가 된 요소를 출력

 // Q5. find a student with the score 90
  
  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),
  ];


  {
    const result = students.find((student) => student.score === 90);
    console.log(result);
  }

 

6. filter : callback함수가 true인 것들을 가져와 배열로 생성한다.

// Q6. make an array of enrolled students
  {
    const result = students.filter((student) => student.enrolled);
    console.log(result);
  }

 

7. map : 배열안에 들어있는 요소 한가지씩를 가져와서 (callback함수에서 가공을 해)변환해서 배열로 만든다. 

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

 

8. some, every : (1) some : 하나라도 해당 조건을 만족하는 것이 있는지, (2) every : 배열의 모든 요소들이 해당 조건을 만족하는 지

  // Q8. check if there is a student with the score lower than 50
  {
    console.clear();
    const result = students.some((student) => student.score < 50);
    console.log(result);
  
    const result2 = !students.every((student) => student.score >= 50);
    console.log(result2);
  }
  console.clear();

 

9. reduce : 배열에 있는 모든 요소들의 값을 누적하는, 모아놓을 때 쓴다. 배열 하나하나씩 prev,curr로 연결된다.

// Q9. compute students' average score
  {
    const result = students.reduce((prev, curr) => prev.score + curr.score);
    console.log(result / students.length);
  }

 

10. map, filter, join :  (map)배열에 있는 값을 가져와 새로운 배열로 만든다 -> (filter)해당 조건을 만족하는 것을 가져온다 -> (join)string으로 만든다.

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

 

 

11. map, sort, join : (map)배열에 있는 값을 가져와 새로운 배열로 만든다 -> (sort) a-b해서 음수가 나오면 정렬된다.(API참고하기) -> (join)string으로 만든다.

  // Bonus! do Q10 sorted in ascending order
  // result should be: '45, 66, 80, 88, 90'
  {
    const result = students
      .map((student) => student.score)
      .sort((a, b) => a - b)
      .join();
    console.log(result);
  }

---

Thanks for 드림코딩

https://youtu.be/3CUjtKJ7PJg