자주 사용하는 배열 메서드

자주 사용하는 배열 메서드

1. map

사용 사례: 데이터를 변환하여 새로운 배열을 생성할 때 주로 사용됩니다. 예를 들어, API에서 가져온 데이터를 변환하여 UI에 렌더링할 때 사용됩니다.

const users = [
    { id: 1, name: 'John' },
    { id: 2, name: 'Jane' },
    { id: 3, name: 'Jack' }
];
const userNames = users.map(user => user.name);
console.log(userNames); // ['John', 'Jane', 'Jack']

2. filter

사용 사례: 특정 조건을 만족하는 요소들로 새로운 배열을 만들 때 사용됩니다. 예를 들어, 완료된 작업만 필터링하여 보여줄 때 사용됩니다.

const tasks = [
    { id: 1, title: 'Task 1', completed: false },
    { id: 2, title: 'Task 2', completed: true },
    { id: 3, title: 'Task 3', completed: false }
];
const completedTasks = tasks.filter(task => task.completed);
console.log(completedTasks); // [{ id: 2, title: 'Task 2', completed: true }]

3. reduce

사용 사례: 배열을 단일 값으로 축약할 때 사용됩니다. 예를 들어, 주문 내역에서 총 금액을 계산할 때 사용됩니다.

const orders = [
    { id: 1, amount: 100 },
    { id: 2, amount: 200 },
    { id: 3, amount: 150 }
];
const totalAmount = orders.reduce((sum, order) => sum + order.amount, 0);
console.log(totalAmount); // 450

4. forEach

사용 사례: 배열의 각 요소에 대해 특정 작업을 수행할 때 사용됩니다. 예를 들어, 콘솔에 로그를 출력하거나 DOM을 조작할 때 사용됩니다.

const numbers = [1, 2, 3, 4, 5];
numbers.forEach(num => console.log(num * 2));
// 2, 4, 6, 8, 10 출력

5. find

사용 사례: 특정 조건을 만족하는 첫 번째 요소를 찾을 때 사용됩니다. 예를 들어, 특정 ID를 가진 사용자를 찾을 때 사용됩니다.

const users = [
    { id: 1, name: 'John' },
    { id: 2, name: 'Jane' },
    { id: 3, name: 'Jack' }
];
const user = users.find(user => user.id === 2);
console.log(user); // { id: 2, name: 'Jane' }

6. some

사용 사례: 배열의 일부 요소가 특정 조건을 만족하는지 확인할 때 사용됩니다. 예를 들어, 유효한 이메일이 있는지 확인할 때 사용됩니다.

const emails = ['test@example.com', 'invalid-email', 'user@example.com'];
const hasValidEmail = emails.some(email => email.includes('@'));
console.log(hasValidEmail); // true

7. every

사용 사례: 배열의 모든 요소가 특정 조건을 만족하는지 확인할 때 사용됩니다. 예를 들어, 모든 입력이 유효한지 확인할 때 사용됩니다.

const numbers = [2, 4, 6, 8];
const allEven = numbers.every(num => num % 2 === 0);
console.log(allEven); // true

8. sort

사용 사례: 배열을 특정 기준으로 정렬할 때 사용됩니다. 예를 들어, 사용자 리스트를 이름 순으로 정렬할 때 사용됩니다.

const users = [
    { id: 3, name: 'Jack' },
    { id: 1, name: 'John' },
    { id: 2, name: 'Jane' }
];
const sortedUsers = users.sort((a, b) => a.name.localeCompare(b.name));
console.log(sortedUsers);
// [{ id: 2, name: 'Jane' }, { id: 3, name: 'Jack' }, { id: 1, name: 'John' }]

9. slice

사용 사례: 배열의 일부를 추출하여 새로운 배열을 만들 때 사용됩니다. 예를 들어, 페이지네이션에서 일정 범위의 데이터를 가져올 때 사용됩니다.

const numbers = [1, 2, 3, 4, 5];
const firstTwoNumbers = numbers.slice(0, 2);
console.log(firstTwoNumbers); // [1, 2]