ES6

1. map()

map() 메서드는 배열 내의 모든 요소마다 콜백함수를 거치게 만든 후, 도출된 그 결과값들을 모아 새로운 배열을 반환합니다.

✔ 문법

배열명.map(callback(element[, index[, array]])[, thisArg])

(1) callback 함수

• element : 처리할 배열 내의 현재 요소
• index : element의 인덱스 (생략 가능)
• array : map()을 호출한 배열 (생략 가능)

(2) thisArg : callback 함수 실행시, this로 사용되는 값 (생략 가능)

✔ 예제

const arr = [1,2,3,4,5];

const newArr = arr.map(x => x*2); 

console.log(newArr); // [2,4,6,8,10]

const arr = [10, 50, 100];

const newArr = arr.map(x=> {
	if(x > 30){ return '큼';} 
    });

console.log(newArr); // [undefined, '큼', '큼']

2. filter()

filter() 메서드는 배열 내의 모든 요소마다 콜백함수를 거치게 만든 후, 그 중 true를 리턴한 요소만 모아 새로운 배열로 반환합니다.

✔ 문법

배열명.filter(callback(element[, index[, array]])[, thisArg])

(1) callback 함수

• element : 처리할 배열 내의 현재 요소
• index : element의 인덱스 (생략 가능)
• array : filter()을 호출한 배열 (생략 가능)

(2) thisArg : callback 함수 실행시, this로 사용되는 값 (생략 가능)

✔ 예제

const fruits = ['banana','pineapple','mango','apple'];

const result = fruits.filter(fruit => fruit.length > 5); 

console.log(result); // ['banana','pineapple']

3. find()

find() 메서드는 주어진 판별 함수를 만족하는 첫 번째 요소의 값을 반환합니다. 그런 요소가 없다면 undefined를 반환합니다.

✔ 문법

배열명.find(callback[, thisArg])

(1) callback 함수

• element : 처리할 배열 내의 현재 요소
• index : element의 인덱스 (생략 가능)
• array : find()을 호출한 배열 (생략 가능)

(2) thisArg : callback 함수 실행시, this로 사용되는 값 (생략 가능)

✔ 예제

const arr = [1,2,3,4,5];

const result = arr.find(x => x > 3); 

console.log(result); // 4

const ourClass = [
	{name: 'Jay', age: 11}, 
	{name: 'Sarah', age: 12},
    	{name: 'Tom', age: 9}
    ];

const student = ourClass.find(x => x.name === "Jay"); 

console.log(student); // {name:'Jay', age: 11}

4. findIndex()

findIndex() 메서드는 주어진 판별 함수를 만족하는 배열의 첫 번째 요소에 대한 인덱스를 반환합니다. 만족하는 요소가 없으면 -1을 반환합니다.

✔ 문법

배열명.findIndex(callback(element[, index[, array]])[, thisArg])

(1) callback 함수

• element : 처리할 배열 내의 현재 요소
• index : element의 인덱스 (생략 가능)
• array : find()을 호출한 배열 (생략 가능)

(2) thisArg : callback 함수 실행시, this로 사용되는 값 (생략 가능)

✔ 예제

const arr = [1,2,6,7,8];

const result = arr.findIndex(x => x > 3); 
const result2 = arr.findIndex(x => x > 10);

console.log(result); // 2
console.log(result2); // -1

ES5

1. every()

every() 메서드는 배열 내의 모든 요소가 주어진 판별 함수를 통과하는지 테스트하고, 그에 대한 결과로서 boolean 값을 반환합니다.

✔ 문법

배열명.every(callback(element[, index[, array]])[, thisArg])

(1) callback 함수

• element : 처리할 배열 내의 현재 요소
• index : element의 인덱스 (생략 가능)
• array : every()을 호출한 배열 (생략 가능)

(2) thisArg : callback 함수 실행시, this로 사용되는 값 (생략 가능)

✔ 예제

const arr = ['candy', 'candy', 'chocolate'];

const newArr = arr.every(x => x === 'candy'); 

console.log(newArr); // false

2. some()

some() 메서드는 배열 내의 어느 요소라도 주어진 판별 함수를 통과하는지 테스트하고, 그에 대한 결과로서 boolean 값을 반환합니다. 빈 배열일 때는 무조건 false를 반환.

✔ 문법

배열명.some(callback(element[, index[, array]])[, thisArg])

(1) callback 함수

• element : 처리할 배열 내의 현재 요소
• index : element의 인덱스 (생략 가능)
• array : some()을 호출한 배열 (생략 가능)

(2) thisArg : callback 함수 실행시, this로 사용되는 값 (생략 가능)

✔ 예제

const arr = ['candy', 'candy', 'chocolate'];

const newArr = arr.some(x => x === 'candy'); 

console.log(newArr); // true

3. reduce()

reduce() 메서드는 배열 내의 각 요소마다 주어진 리듀서(reducer)함수를 실행하고, 하나의 결과값을 반홥합니다.

배열명.reduce(callback[, initialValue])

(1) callback 함수

• accumulator : 콜백의 반환값이 누적되는 곳. initialValue가 제공되는 경우, 콜백 함수가 처음 호출될 때의 accumulator는 initialValue가 된다. initialValue가 없다면, 배열의 첫 번째 요소가 사용된다.
• currentValue : 처리할 현재 요소
• currentIndex : 처리할 현재 요소의 인덱스 (생략 가능)
• array : reduce()를 호출한 배열

(2) initialValue : callback의 최초 호출에서 첫 번째 인수에 제공하는 값(생략 가능)

✔ 예제

const heroes = [{name:'capt', age:100},{name:'thor', age:1000}];

const totalAge = heroes.reduce((total, currentItem)=>{
	total = total + currentItem.age;
    return total;
}, 0)

console.log(totalAge); // 1100