[멋쟁이 사자처럼 프론트엔드 스쿨] 35일차 TIL - 배열, 큐, 스택, 배열 메서드

🍰 큰일 큰일. 약간 넋 놓고 들은 파트가 있어서 얼른 따라잡아야 한다.

🍴 배열

• []를 사용해 선언, 초기값 설정 가능
• 인덱스를 사용해 배열 요소에 접근/수정 가능
• push, pop, shift, unshift 메서드를 사용해 배열에 요소를 추가/제거
• 배열은 객체임, 키가 숫자인 특수한 형태로 동작
• for, for...of, forEach 등을 통해 배열 순회

🍴 큐(Queue)

• 먼저 들어온 데이터가 먼저 나가는 FIFO(First In, First Out) 구조
• 데이터가 한쪽 끝에서 들어가고 다른 쪽 끝에서 나옴
• 주로 enqueue로 추가, dequeue로 제거

🍴 스택(Stack)

• 나중에 들어온 데이터가 먼저 나가는 LIFO(Last In, First Out) 구조
• 데이터가 한쪽 끝에서만 들어가고 나옴
• 주로 push로 추가, pop으로 제거

🍴 배열 메서드

map

• 목적: 배열의 각 요소를 변환하여 새로운 배열을 생성
• 원형: array.map(callback(element[, index[, array]])[, thisArg])
• 반환값: 변환된 요소들로 구성된 새로운 배열

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

reduce

• 목적: 배열의 각 요소를 누적하여 단일 값으로 반환
• 원형: array.reduce(callback(accumulator, currentValue[, index[, array]])[, initialValue])
• 반환값: 누적된 단일 값

const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce((total, number) => total + number, 0);
console.log(sum); // 출력: 15

filter

• 목적: 배열의 각 요소를 조건에 따라 걸러내어 새로운 배열을 생성
• 원형: array.filter(callback(element[, index[, array]])[, thisArg])
• 반환값: 조건을 만족하는 요소들로 구성된 새로운 배열

const numbers = [1, 2, 3, 4, 5];
const evenNumbers = numbers.filter(number => number % 2 === 0);
console.log(evenNumbers); // 출력: [2, 4]

forEach

• 목적: 배열의 각 요소에 대해 주어진 함수를 실행 (반환값 없음)
• 원형: array.forEach(callback(element[, index[, array]])[, thisArg])
• 반환값: 없음 (undefined)

const numbers = [1, 2, 3, 4, 5];
numbers.forEach(number => {
  console.log(number * 2);
});
// 출력: 2, 4, 6, 8, 10 (각 요소를 두 배로 만들어 출력)

비교

메서드	목적	반환값	원형
map	각 요소를 변환하여 새로운 배열 생성	변환된 요소들로 구성된 새로운 배열	array.map(callback(element[, index[, array]])[, thisArg])
reduce	각 요소를 누적하여 단일 값 반환	누적된 단일 값	array.reduce(callback(accumulator, currentValue[, index[, array]])[, initialValue])
filter	조건에 따라 요소들을 걸러내어 새로운 배열 생성	조건을 만족하는 요소들로 구성된 새로운 배열	array.filter(callback(element[, index[, array]])[, thisArg])
forEach	각 요소에 대해 주어진 함수 실행	없음	array.forEach(callback(element[, index[, array]])[, thisArg])