[JavaScript] Array(배열) JS 함수 정리(2)

배열(Array) 이란?

배열은 연관된 데이터를 모아서 관리하기 위해서 사용되는 데이터 타입.

변수가 하나의 데이터를 저장하기 위한 것이라면 배열은 여러 개의 데이터를 저장하기 위한 것이라고 할 수 있다.

• 배열은 순서가 있는 값들을 의미 한다.
• 배열의 값은 요소(element) 이다.
• 배열의 순서는 인덱스(index) 이다.
• 배열의 순서는 0부터 시작한다.
• 배열의 정의는 대괄호 [] 로 한다.
• 배열 안에 요소는 쉼표로 구분한다.

배열에 접근하는 방법

배열을 조회 하려면 index 를 이용한다.

// 두번째 인덱스 번호 값을 가지고 온다.
let array = [1,2,3,4,5];
console.log(array[2]) // 3

// 세번째 인덱스 번호 값을 변경
array[3] = 200
console.log(array)
 // [1,2,3,200,5]

---

[Array Method 정리]

array.prototype.pop()

배열의 마지막에 값을 삭제

let arr = [1,2,3,4];
arr.pop();
console.log(arr); // [ 1, 2, 3 ]

array.prototype.push()

배열 마지막에 값을 추가

let arr = [1,2,3,4]
arr.push(5)
console.log(arr) // [1,2,3,4,5]

array.prototype.shift()

배열 처음에 값을 삭제

let arr = [1,2,3,4];
arr.shift()
console.log(arr) // [2,3,4]

array.prototype.unshift()

배열 처음에 값을 추가

let arr = [1,2,3,4];
arr.unshift(0);
console.log(arr) // [0,1,2,3,4]

array.prototype.splice()

배열의 특정 위치에 요소를 추가하거나 삭제

splice( index , 제거 할 요소 개수 , 추가 할 요소)

let arr = [1,2,3,4,5,6,7];
arr.splice(3,2); // (3번째 인덱스부터 2개 제거)
console.log(arr); // [1,2,3,6,7] -> index 3번째 요소  4 부터 2개 5 , 6 까지 제거

let arr2 = [1,2,3,4,5,6,7];
arr.splice(3,1,"a","b"); // 3번째 인덱스부터 1개 제거 후 그 자리에 a,b 추가
console.log(arr2) // [1,2,3,'a','b',5,6,7]

array.prototype.slice( 시작 index, 끝 index )

선택한 index시작 부분부터 끝 부분 전 까지 요소를 복사 후 새로운 배열로 반환

let arr = [1,2,3,4,5,6,7];
let newArr = arr.slice(1,3);
console.log(newArr) // [1,2,3]

array.prototype.concat()

다수의 배열을 합쳐 새로운 배열로 반환

let a = [1,2,3];
let b = [4,5,6];
let c = a.concat(b);
console.log(c) // [1,2,3,4,5,6]

array.prototype.every()

배열 안의 모든 요소가 주어진 판별 함수를 통과하는지 테스트하고, Boolean 값을 반환

let arr =  1, 2, 3, 4, 5, 6, 7, 8, 9, 10 ];
// 2의 배수일 경우 true
const even = (element) => element % 2 === 0;

arr.every(even);
// false  모든 요소가 true이면 true를 return 하고 그렇지 않으면 false

array.prototype.some()

배열 안의 어떤 요소라도 주어진 판별 함수를 통과하는지 테스트하고, Boolean 값을 반환

빈 배열일 경우 false리턴

const array = [1, 2, 3, 4, 5];
const even = (element) => element % 2 === 0;

console.log(array.some(even)); // true 가 하나라도 있으면 true

array.prototype.forEach()

주어진 함수를 배열 요소 각각에 대해 실행

const arr = ['a','b','c']
arr.forEach((element,index) => console.log(element,index))

// a 0
// b 1
// c 2

array.prototype.map()

배열의 각 원소 별로 지정된 함수를 실행한 결과로 구성된 새로운 배열을 반환

let arr =[ 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 ];
const even = (element) => element % 2 === 0;
let newArr = arr.map(even);
console.log(newArr);
// [ false, true, false, true, false, true, false, true, false, true ]

array.prototype.filter()

지정된 함수의 결과 값을 true 로 만드는 원소들로만 구성된 별도의 배열을 반환

let arr =[ 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 ];
const even = (element) => element % 2 === 0;
let newArr = arr.filter( even );
console.log( newArr ); // [ 2, 4, 6, 8, 10 ]

array.prototype.sort()

배열의 원소를 알파벳순으로, 또는 지정된 함수에 따른 순서로 정렬한다.

모든 원소를 문자열로 취급해 사전적으로 정렬

let arr = [ 13, 12, 11, 10, 5, 3, 2, 1 ];
arr.sort();
console.log( arr ); // [ 1, 10, 11, 12, 13, 2, 3, 5 ];

// sort에 함수로 정렬
let arr2 = [ 13, 12, 11, 10, 5, 3, 2, 1 ];
arr.sort(function( a, b ) {return a - b})
console.log( arr ); // [ 1, 2, 3, 5, 10, 11, 12, 13 ]

array.prototype.reverse()

배열의 순서를 거꾸로 바꾼다.

let arr = [1,2,3,4]
arr.reverse();
console.log(arr) // [4,3,2,1]

array.prototype.join()

배열 원소 전부를 하나의 문자열로 합친다.

let arr =[ 1, 2, 3, 4 ];
console.log( arr.join() );      // 1,2,3,4
console.log( arr.join( '-' ) ); // 1-2-3-4

Array.prototype.reduce()

배열의 요소들을 하나의 결과 값을 반환합니다.

let arr =[ 1, 2, 3, 4 ];
console.log( arr.reduce((a,b) => a + b) );      // 10
console.log( arr.reduce((a,b) => a - b) ); // -8

Array.prototype.fill()

배열의 시작 인덱스부터 끝 인덱스의 이전까지 정적인 값 하나로 채웁니다.

let arr = [1,2,3,4]
// 0 을 2번째 index 자리 부터 4번째 index 자리까지 채운다.
console.log(arr.fill(0,2,4)) // [1,2,0,0]
// 0 을 1번째 위치부터 끝까지 채운다
console.log(arr.fill(0,1)) // [1,0,0,0]
// 모든 값을 바꾼다
console.log(arr.fill(0)) // [0,0,0,0]