📖 Review (21.04.01)
배열 내장 메소드
slice,forEach,map,filter,reduce...
배열을 다룰 때 유용한 내장 메소드
Slice
slice() 메서드는 어떤 배열의 begin부터 end까지(end 미포함)에 대한 얕은 복사본을 새로운 배열 객체로 반환합니다. 원본 배열은 바뀌지 않습니다.
arr.slice(begin, end) //shallow copyex)
const animals = ['ant', 'bison', 'camel', 'duck', 'elephant'];
console.log(animals.slice(2));
// expected output: Array ["camel", "duck", "elephant"]
console.log(animals.slice(2, 4));
// expected output: Array ["camel", "duck"]
console.log(animals.slice(1, 5));
// expected output: Array ["bison", "camel", "duck", "elephant"][begin]
- 0을 시작으로 하는 추출 시작점에 대한 인덱스를 의미합니다.
- 음수 인덱스는 배열의 끝에서부터의 길이를 나타냅니다. slice(-2) 는 배열에서 마지막 두 개의 엘리먼트를 추출합니다.
- begin이 undefined인 경우에는, 0번 인덱스부터 slice 합니다.
- begin이 배열의 길이보다 큰 경우에는, 빈 배열을 반환합니다.
[end]
- 추출을 종료 할 0 기준 인덱스입니다. slice 는 end 인덱스를 제외하고 추출합니다.
예를 들어, slice(1,4)는 두번째 요소부터 네번째 요소까지 (1, 2 및 3을 인덱스로 하는 요소) 추출합니다. - 음수 인덱스는 배열의 끝에서부터의 길이를 나타냅니다. 예를들어 slice(2,-1) 는 세번째부터 끝에서 두번째 요소까지 추출합니다.
- end가 생략되면 slice()는 배열의 끝까지(arr.length) 추출합니다.
만약 end 값이 배열의 길이보다 크다면, silce()는 배열의 끝까지(arr.length) 추출합니다.
forEach
forEach 메서드는 배열을 반복하는 메서드이다. 일반적으로 무언가를 반복하고자 할때는 for문을 사용한다.
const a = [1,2,3,4,5];
for(let i=0;i<a.length;i++) {
console.log(a[i]); // 출력 : 1,2,3,4,5
}위와 같이 배열 a의 길이를 이용하여 for 문 안에서 인덱스 i 값을 원소로 하여 반복하는 방식을 사용한다. 하지만 forEach 메서드를 사용하면 보다 쉽게 구현할 수 있다.
const a = [1,2,3,4,5];
a.forEach(function(s) {
console.log(s); // 출력 : 1,2,3,4,5
})배열 a는 각 1,2,3,4,5의 요소를 가지고 있다. 3열에서 배열 a의 메서드 forEach를 호출 하는데 인자로 함수를 전달하고 함수의 매개변수는 배열 a의 요소가 된다. 첫번째 배열 인덱스부터 마지막 배열 인덱스까지 반복한다.
Map
map() 메서드는 배열 내의 모든 요소 각각에 대하여 주어진 함수를 호출한 결과를 모아 새로운 배열을 반환한다.
arr.map(callback(currentValue[, index[, array]])[, thisArg])ex)
var numbers = [1, 4, 9];
var doubles = numbers.map(function(num) {
return num * 2;
});
// doubles는 이제 [2, 8, 18]
// numbers는 그대로 [1, 4, 9]인자인 배열과 안의 요소들은 map을 통해 순회하면서 원본 배열로 부터 자동으로 할당됩니다.
filter
filter() 메서드는 주어진 함수의 테스트를 통과하는 모든 요소를 모아 새로운 배열로 반환합니다.
arr.filter(callback(element[, index[, array]])[, thisArg])ex)
function isBigEnough(value) {
return value >= 10;
}
let filtered = [12, 5, 8, 130, 44].filter(isBigEnough);
// filtered 는 [12, 130, 44]Reduce
reduce() 메서드는 배열의 각 요소에 대해 주어진 리듀서(reducer) 함수를 실행하고, 하나의 결과값을 반환합니다.
arr.reduce(callback[, initialValue])- 배열의 각 요소를
- 특정 응축 방법(함수)에 따라
- 원하는 하나의 형태로
- 응축한다(reduction).
ex)
let arr = [1, 2, 3];
let result = arr.reduce(function(acc,cur,idx){
acc = acc + cur;
return acc;
});
result//6 callback
: 배열의 각 요소에 대해 실행할 함수. 다음 네 가지 인수를 받습니다.
accumulator
: 누산기accmulator는 콜백의 반환값을 누적합니다. 콜백의 이전 반환값 또는, 콜백의 첫 번째 호출이면서 initialValue를 제공한 경우에는 initialValue의 값입니다.
currentValue
: 처리할 현재 요소.
currentIndex Optional
: 처리할 현재 요소의 인덱스. initialValue를 제공한 경우 0, 아니면 1부터 시작합니다.
array Optional
: reduce()를 호출한 배열.
initialValue Optional
: callback의 최초 호출에서 첫 번째 인수에 제공하는 값. 초기값을 제공하지 않으면 배열의 첫 번째 요소를 사용합니다. 빈 배열에서 초기값 없이 reduce()를 호출하면 오류가 발생합니다.
