윤쨩이의 개발 블로그

reduce(): 배열의 각 요소에 대해 주어진 리듀서(reducer) 함수를 실행하고, 하나의 결과값을 반환합니다. reducer함수는 네 개의 인자를 가진다. 누산기 (acc) 현재 값 (cur) 현재 인덱스 (idx) 원본 배열 (src) 리듀서 함수의 반환 값은 누산기에 할당되고, 누산기는 순회 중 유지되므로 결국 최종 결과는 하나의 값이 된다. 예제를 통해 알아보자. const arrNum1 = [100, 200, 300, 400, 500]; const result1 = arrNum1.reduce(element => element); console.log(result1);//100 const arrNum2 = [100, 200, 300, 400, 500]; const result2 = arrNu..

map() : 배열의 특정 요소를 추출하여 새로운 배열을 만든다. 예제를 통해 알아보자. const arr = [100,200,300,400,500]; console.log(arr.map(item => (item)));//[100, 200, 300, 400, 500] console.log(arr.map(item => (item + 100)));//[200, 300, 400, 500, 600] console.log(arr.map(item => (item * 2)));//[200, 400, 600, 800, 1000] console.log(arr.map(item => (item + "J")));// ['100J', '200J', '300J', '400J', '500J'] console.log(arr.map(..

filter() : 특정 요소를 탐색하며 , 주어진 함수의 테스트를 통과하는 모든 요소를 모아 새로운 배열로 반환합니다. 예제를 통해 알아보자. const arr = ["apple","watermelone","banana","orange","peach"]; console.log(arr.filter(fruit => (fruit == "apple")));//apple console.log(arr.filter(fruit => (fruit == "banana")));//banana console.log(arr.filter(fruit => (fruit.length >= 6)));// ['watermelone', 'banana', 'orange'] console.log(arr.filter(fruit => (frui..

find() : 배열에 특정 요소가 있는지 탐색한다. findIndex() : 배열에 특정 요소가 있는지 탐색하고 그 요소가 몇번째 인덱스에 있는 지 값을 출력한다. 01) find() 구문 arr.find(callback[, thisArg]) - callback : 배열의 각 값에 대해 실행할 함수 - thisArg : 선택 항목. 콜백이 호출될 때 this로 사용할 객체. 예제를 통해 알아보자. const arr = ["apple","watermelone","banana","orange","peach"]; console.log(arr.find(fruit => (fruit == "apple")));//apple console.log(arr.find(fruit => (fruit == "banana")))..

splice() : 배열의 기존 요소를 삭제 또는 교체하거나 새 요소를 추가하여 배열의 내용을 변경한다. 구문 array.splice(start[, deleteCount[, item1[, item2[, ...]]]]) - start : 배열의 변경을 시작할 인덱스 - deleteCount (Optional) : 배열에서 제거할 요소의 수 - item1, item2, ... (Optional) : 배열에 추가할 요소. 아무 요소도 지정하지 않으면 splice()는 요소를 제거하기만 한다. 예제를 통해 알아보자. const arr = ["apple","watermelone","banana","orange","peach"]; console.log(arr.splice(1,2));// ['watermelone',..

slice() : 배열에 요소를 정렬할 때 사용하는 메소드이다. : 어떤 배열의 begin부터 end까지(end 미포함)에 대한 얕은 복사본을 새로운 배열 객체로 반환한다. 원본 배열은 바뀌지 않는다. 구문 arr.slice([begin[, end]]) - begin : 0을 시작으로 하는 추출 시작점에 대한 인덱스를 의미한다. 음수 인덱스는 배열의 끝에서부터의 길이를 나타냅니다. slice(-2) 는 배열에서 마지막 두 개의 엘리먼트를 추출한다. - end : 추출을 종료 할 0 기준 인덱스이다. slice 는 end 인덱스를 제외하고 추출합니다. 예를 들어, slice(1,4)는 두번째 요소부터 네번째 요소까지 (1, 2 및 3을 인덱스로 하는 요소) 추출합니다. 예제를 통해 알아보자. const a..

reverse() / sort() : 배열에 요소를 정렬할 때 사용하는 메소드이다. - reverse(): 배열의 요소들의 순서가 반전으로 정렬된다. 반환 값은 배열이다. - sort() : 배열의 요소들을 순서대로 정렬한다. 반환 값은 배열이다. 예제를 통해 알아보자. sort() 메소드를 이용해서 배열을 정렬해보자. const numbers = [2,5,1,3,4]; console.log(numbers.sort());//[1, 2, 3, 4, 5] sort()는 순서대로 정렬하기 때문에 [1,2,3,4,5]를 반환한다. const numbers = [3,4,1,2,5]; console.log(numbers.sort(function(a,b) {return a-b})); 위와 같은 코드도 [1,2,3,4..

indexOf() / lastIndexOf() / includes() : 배열에 특정 요소를 탐색할 때 사용하는 메소드이다. - indexOf(): 호출한 string 객체에서 주어진 값과 일치하는 첫 번째 인덱스를 반환한다. 일치하는 값이 없으면 -1을 반환한다. - lastIndexOf() : 주어진 값과 일치하는 부분을 역순으로 탐색한다. 일치하는 값이 없으면 -1를 반환한다. -includes() : 배열요소에 포함되는 것을 탐색한다. 포함된다면 true를 없다면 false를 출력한다. 예제를 통해 알아보자. indexOf() 메소드를 이용해서 특정 요소를 탐색해 보자. const arr = ['a','b','c','d','e','a']; const search = 'a'; console.log(..