[JS] Array

pop
배열의 마지막 값을 삭제
arr.pop()는 삭제한 값을 반환
원본 배열 변경

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

push
배열의 마지막에 값을 삽입
arr.push()는 삽입한 값을 반환
원본 배열 변경

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

unshift
배열의 맨 앞에 값을 삽입
arr.unshift()는 삽입 후 배열의 길이 반환
원본 배열 변경

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

shift
배열의 맨 앞에 값을 삭제
arr.shift()는 삭제한 값을 반환
원본 배열 변경

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

splice
배열의 특정위치에 요소를 추가하거나 삭제
splice( index, 제거할 요소 개수, 배열에 추가될 요소 )
arr.splice()는 삭제 된 요소를 반환
추가 된 값은 반환하지 않음
원본 배열 변경

let arr = [ 1, 2, 3, 4, 5, 6, 7 ];
console.log(arr.splice( 3, 2 )); // [ 4, 5 ]
console.log( arr ); // [ 1, 2, 3, 6, 7 ]   3번째 인덱스에서부터 2개 제거

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

slice( startIndex, endIndex)
배열의 시작 index부터 끝 index까지(끝 index는 불포함)에 대한 얕은 복사로 새로운 배열 객체로 반환
arr.slice()는 얕은 복사로 복사된 값 배열 형태로 반환
원본 배열 변경하지 않음

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

concat
arr.concat()은 다수의 배열을 합치고 병합된 배열의 사본을 반환
원본 배열 변경하지 않음

let arr1 = [1, 2, 3];
let arr2 = [4, 5, 6];
let arr3 = arr2.concat(arr1);
console.log(arr2.concat(arr1)); // [ 4, 5, 6, 1, 2, 3 ]
console.log(arr1); // [ 1, 2, 3 ]
console.log(arr2); // [ 4, 5, 6 ]
console.log(arr3); // [ 4, 5, 6, 1, 2, 3 ]

every
배열의 모든 요소가 제공한 함수로 구현된 테스트를 통과하는지를 테스트
arr.every(함수명)의 모든 요소가 true이면 true를 반환, 그렇지 않으면 false를 반환

let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

// 2의 배수 판단
let isEven = function (value) {
    return value % 2 === 0;
};
console.log(arr.every(isEven));
console.log(arr); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

some
arr.some(함수명)의 결과가 true가 나올 때까지 배열의 각 원소를 반복
만족하는 값이 없으면 false 반환
원본 배열 변경하지 않음

let arr1 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let arr2 = [1, 3, 5, 7, 9];

// 2의 배수 판단
let isEven = function (value) {
    return value % 2 === 0;
};
console.log(arr1.some(isEven)); // true
console.log(arr2.some(isEven)); // false
console.log(arr1); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
console.log(arr2); // [1, 3, 5, 7, 9]

forEach
각 배열 요소에 대해 제공된 함수를 한 번씩 실행한다.

let arr = [1, 2, 3];
arr.forEach(function (value) {
    console.log(value); // 1 2 3
});
// arr.forEach(arr => console.log(arr));  // 익명 함수로 변경
console.log(arr); // [1, 2, 3]

map
배열의 각 원소별로 지정된 함수를 실행한 결과로 구성된 새로운 배열을 반환한다.
원본 배열 변경하지 않음

let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let isEven = function (value) {
    return value % 2 === 0;
};
let newArr = arr.map(isEven);
// let newArr = arr.map((arr) => isEven(arr)); // 화살표 함수로 변경
console.log(newArr); // [ false, true, false, true, false, true, false, true, false, true ]
console.log(arr); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

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

let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let isEven = function (value) {
    return value % 2 === 0;
};
let newArr = arr.filter(isEven);
// let newArr = arr.filter((arr) => isEven(arr)); // 화살표 함수로 변경
console.log(newArr); // [ 2, 4, 6, 8, 10 ]

reduce
누산기(accumulator) 및 배열의 각 값(좌에서 우로)에 대해 (누산된) 한 값으로 줄도록 함수를 적용
이전값에 최근값을 누산하여 사용

let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let value = arr.reduce(function (previousValue, currentValue) {
    return previousValue + currentValue;
});
console.log(value); // 55

reverse
배열의 원소 순서를 거꾸로 바꾼다.
원본 배열 변경

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

sort
배열의 원소를 알파벳순으로, 또는 지정된 함수에 따른 순서로 정렬한다. 모든 원소를 문자열로 취급해 사전적으로 정렬
원본 배열 변경

let arr1 = [13, 12, 11, 10, 5, 3, 2, 1];
console.log(arr1.sort()); // [ 1, 10, 11, 12, 13, 2, 3, 5 ]
console.log(arr1); // [ 1, 10, 11, 12, 13, 2, 3, 5 ] // 문자열로 취급하여 사전순 정렬


// sort에 함수로 정렬
let arr2 = [13, 12, 11, 10, 5, 3, 2, 1];
arr2.sort(function (a, b) {
    return a - b;
})
// b가 더 클 때만 a - b의 결과로 음수가 나오며
// 앞선 수가 더 클 때 변경이 일어나 오름차순 정렬이 됨

// arr2.sort((a, b) => a - b); // 화살표 함수로 변경
console.log(arr2); // [ 1, 2, 3, 5, 10, 11, 12, 13 ] // 원본 배열 변경

toString
배열을 문자열로 바꾸어 반환한다

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

valueOf
toString과 비슷하나, 반환값을 배열로 반환

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

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

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