[JS] Array api 총 정리

📍 split : String ➜ Array

{
  const fruits = '🍎, 🥝, 🍌, 🍒';
  console.log(fruits.split(','));
  console.log(fruits.split(',', 2)); // 리턴 받을 배열 수
}

 

 

📍 join : Array ➜ String

{
  const fruits = ['apple', 'banana', 'orange'];
  console.log(fruits.join());    // apple,banana,orange
  console.log(fruits.join('|')); // apple|banana|orange
}

 

📍 Reverse 

{
  const array = [1, 2, 3, 4, 5];
  console.log(array.reverse()); //본 배열도 정렬됨.
}

결과값: [5, 4, 3, 2, 1]

 

📍 Slice : 얕은 복사

- 지정한 범위를 새로운 배열객체로 return (원본 배열 수정X)

make new array without the first two elements

{
  const array = [1, 2, 3, 4, 5];
  console.log(array.slice(2, 5)); // 배열에서 원하는 부분만 return
}
// 결과값 [3, 4, 5]
// array = [1, 2, 3, 4, 5]

 

📍 Splice : 배열 기존 요소 수정

- 배열의 기존 요소를 삭제 또는 교체하거나 새 요소를 추가하여 배열의 내용을 변경

- 원본 배열 변경!

{
  const array = [1, 2, 3, 4, 5];
  console.log(array.splice(0, 2)); // 본 배열에서 1,2를 삭제
}
// 결과값 [1, 2]
// array = [3, 4, 5]

 

📍 find : 조건에 해당하는 첫번째 요소 반환

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

// find a student with the score 90
{
  students.find((student) => student.score === 90);
}

 

📍 filter : 조건이 true인 요소들을 모아서 새로운 배열로 리턴

- 새로운 배열객체로 return 

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

 

📍 map

- 배열의 모든 요소들을 처음부터 끝까지 하나씩 꺼내어 callback함수를 호출하고, callback함수에서 반환되어진 값들로 새로운 배열을 리턴

// make an array containing only the students' scores
// result should be: [45, 80, 90, 66, 88]
{
   console.log(students.map((student) => student.score));
}

 

📍 some & every

- some
  :배열의 요소 중에서 callback함수의 리턴 조건이 하나라도 true이면 ture를 반환 (OR)
  
- every
  :배열에 들어있는 모든 요소들이 리턴 조건을 충족하면 true, 아니면 false (AND)
  모든 배열의 조건이 만족되야할 때 쓸 것

// check if there is a student with the score lower than 50
{
  // some()
  const result = students.some((student) => student.score < 50);

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

 

📍 reduce : 배열 모든 요소를 돌면서 누적할 때 쓰는 API

// compute students' average score
{
  // my code
  let temp = 0;
  students.forEach((student) => (temp += student.score));
  console.log(temp / students.length);

  // answer
  const result = students.reduce(function (prev, curr) {
    return prev + curr.score;
  }, 0);
  console.log(result / students.length);
}

 

📝 함수형 프로그래밍 : map + filter + join

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

 

📝 Ascending order

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

참고

🌟드림코딩 엘리님의 youtube강의를 보고 공부한 내용을 정리한 포스팅입니다🌟

👉youtube강의 https://www.youtube.com/watch?v=3CUjtKJ7PJg&list=PLv2d7VI9OotTVOL4QmPfvJWPJvkmv6h-2&index=9