배열 메소드

선정·2022년 5월 24일
0
post-custom-banner

Method

메소드는 객체에 종속된 특성으로 함수에 포함되는 개념이다. 메소드 이름 앞에 점(.)을 찍어서 사용한다. (ex. [1, 2, 3].indexOf(3), hello.toUpperCase() 등)
이것들은 메소드이지만 함수이기도 하다. 모든 메소드는 함수이지만 모든 함수가 메소드인 건 아니다.

const myMath = {
  PI: 3.14159,
  squre: function(num) {
    return num * num;
  },
  cube: function(num) {
    return num ** 3;
  }
}

배열 메소드


1. find()

주어진 판별 함수를 만족하는 첫 번째 요소의 값을 반환한다. 그런 요소가 없다면 undefined를 반환한다.

// 1️⃣ find 메서드에 콜백함수 전달하기
function findHamster(currentAnimal) {
  return currentAnimal === "🐹";
}

const animals = ["🐶", "🐷", "🐹", "🐱", "🐹"];
const hamster = animals.find(findHamster);
console.log(hamster); // "🐹"

// 2️⃣ find 메서드에 직접 함수 작성하기
const animals = ["🐶", "🐷", "🐹", "🐱", "🐹"];
const hamster = animals.find((currentAnimal) => currentAnimal === "🐹")
console.log(hamster); // "🐹"

find() 메서드가 하는 작업 (실제 작동하는 코드 ❌)

function findHamster(currentAnimal) {
  return currentAnimal === "🐹";
}

const animals = ["🐶", "🐷", "🐹", "🐱", "🐹"];
const hamster = animals.find(
  findHamster("🐶") // false
  findHamster("🐷") // false
  findHamster("🐹") // true
);
console.log(hamster); // "🐹"

2. filter

filter() 메서드는 주어진 함수의 테스트를 통과하는 모든 요소를 모아 새로운 배열로 반환한다.

const animals = ["🐶", "🐷", "🐹", "🐱", "🐹"];
const hamster = animals.filter((currentAnimal) => currentAnimal === "🐹")
console.log(hamster); // ["🐹", "🐹"]

3. map()

map() 메서드는 배열 내의 모든 요소 각각에 대하여 주어진 함수를 호출한 결과를 모아 새로운 배열을 반환한다.

function double(currentNumber) {
  return currentNumber * 2;
}

const source = [2, 4, 6, 8, 10];
const transformed = source.map(double);
console.log(transformed) // [4, 8, 12, 16, 20]

find() 메서드가 하는 작업 (실제 작동하는 코드 ❌)

function double(currentNumber) {
  return currentNumber * 2;
}

const source = [2, 4, 6, 8, 10];
const transformed = source.map(
  double(2), // 4
  double(4), // 8
  double(6), // 12
  double(8), // 16
  double(10) // 20
);
profile
starter
post-custom-banner

0개의 댓글