JS - Array.

어레이에 원소를 추가하는 펑션을 만들때 한가지 문제점이 있다.
새로운 어레이를 만드는 것이 아니라 기존의 것을 계속 참조한다.

// problem
const arr = [1, 2, 3, 4, 5];
const append = (array, element) => {
    array.push(element); 
    return array; // 새로운 어레이를 반환하는 것이 아니라 arr을 반환한다.
};

const newArr = append(arr, 6); // 새로운 어레이를 만들지 않고 arr을 참조한다.
append(arr, 6);
console.log(newArr);
console.log(arr);

이 문제를 해결 하기 위해 [...args] 스프레드 오퍼레이터를 사용한다.

// fix
const arr = [1, 2, 3, 4, 5];
const append = (array, element) => {
    return [...array, element]; // 스프레드 오퍼레이터는 새로운 어레이를 반환해준다.
};

const newArr = append(arr, 6); // 새로운 어레이를 만들지 않고 arr을 참조한다.

console.log(newArr);
console.log(append(arr, 6));

이 방법을 사용해 두개의 어레이를 쉽게 합칠 수 있다.

	// arr1이 같이 변경될수 밖에 없다.
const arr1 = [ 1 ];
const arr2 = [ 2, 3 ];
const mergeArrays =( arr1, arr2 ) => {
	arr1.push( ...arr2 );
  return arr1;
};

const result = mergeArrays( arr1, arr2 );
console.log( result, arr1, arr2 );

// 아래처럼 하면 원본 어레이가 보존된다.
const arr1 = [ 1 ];
const arr2 = [ 2, 3 ];
const mergeArrays =( arr1, arr2 ) => {
	
  return [ ...arr1, ...arr2 ]
};

const result = mergeArrays( arr1, arr2 );
console.log( result, arr1, arr2 );