자바스크립트 기초 - 배열2(reduce, reduceRight, Spread, shuffle)

배열 요소  하나로 정리 - reduce, reduceRight

- 배열의 요소를 계산하여 하나의 값으로 만들고 싶을 때

메소드	의미	반환
배열.reduce(콜백 함수, [초기화])	요소(좌 -> 우)를 처리하여 하나의 값 생성	임의 지정값
배열.reduceRight(콜백 함수, [초기화])	끝에서부터 요소 위치 검색	임의 지정값

콜백 함수

구문	의미
((이전요소, 현재요소, 인덱스, 기존배열) => { /*처리 내용 */ }	임의의 처리

const priceList = [200, 1000, 1300];
const sum = priceList.reduce((pre, cur) =>{
    console.log(`pre : ${pre}, cur : ${cur}`);
    return pre + cur;
});
console.log(sum);

2차원 배열을 1차 배열로 만드는 플래트닝에도 사용가능하다.

const array = [['호랑이', '강아지', '토끼'], ['딸기', '바나나']];
const flattendArray = array.reduce((pre, cur) => {
    return pre.concat(cur);
});
console.log(flattendArray);

---

reduce()는 요소의 처리 작업이 좌에서 우, reduceRight()는 우에서 좌로 이루어진다.

const array = ['호랑이', '강아지', '토끼'];
const member1 = array.reduce((pre, cur) => {
    return `${pre}와 ${cur}`;
});
console.log(member1);

const member2 = array.reduceRight((pre, cur) => {
    return `${pre}와 ${cur}`;
});
console.log(member2);

---

유사 배열 객체를 배열로 변환 - ... (스프레드 연산자)

- 문자열과 유사 배열을 배열로 변환하고 싶을 때

- 반복 가능한 객체를 배열로 변환하고 싶을 때

구문	의미
[...변환대상]	배열로 변환

유사 배열의 특징

- length 속성으로 크기를 확인할 수 있다.

- 인덱스가 부여된 요소를 가진다.

 

Arrat.from()도 스프레드 연산자(...)과 같이 유사 배열로 변환가능함.

const text = "안녕하세요~~~!!";
const spreadText = [...text];
console.log(spreadText);

const arrayFrom = Array.from(text);
console.log(arrayFrom);

---

요소의 개별 변수에 분할 대입

-배열 요소를 변경하고 싶을 때

구문	의미
[변수1, 변수2, 변수3] = [값1, 값2, 값3]	각 변수에 값을 대입

let a;
let b;
let c;
[a, b, c] = [1, 2, 3];
console.log(a, b, c);

const array = ['사자', '호랑이'];
[array[0], array[1]] = [array[1], array[0]];
console.log(array);

---

배열 섞기 (셔플)

-요소의 값을 섞을 때

배열을 빠르게 섞기 위해서 피셔 예이츠 알고리즘이 사용

const array = [1, 2, 3, 4, 5];
const arrLen = array.length;

for(let i = arrLen - 1; i >= 0; i--){
    const rnd = Math.floor(Math.random() * (i + 1));
    [array[i], array[rnd]] = [array[rnd], array[i]];
}
console.log(array);

---

const array1 = [1, 2, 3, 4, 5];
const shuffle1 = shuffleArray(array1);
console.log(shuffle1);

const array2 = ['사과', '사자', '과일', '수박', '동물'];
const shuffle2 = shuffleArray(array2);
console.log(shuffle2);

function shuffleArray(arr){
    //기존 배열 복제
    const array = arr.concat(); 

    const arrLen = array.length;

    for(let i = arrLen - 1; i >= 0; i--){
        const rnd = Math.floor(Math.random() * (i + 1));
        [array[i], array[rnd]] = [array[rnd], array[i]];
    }
    return array;
}

suffleArray 함수를 만들어서 사용하면 숫자든 문자열 배열이든 적용해서 사용하기 용이 하다.