Array 함수 #6. 기타

1. toString

let input = [1,2,3,4];
let output = input.toString();  // output = '1,2,3,4'

일반적으로 toString은 숫자 하나와 같은 객체 하나를 문자열로 변환할 때도 쓸 수 있지만

 

배열에 사용했을 때는 배열의 원소들을 연결해서 하나의 문자열로 반환한다.

 

만약 number 타입이 아닌 string 타입의 배열 ['1', '2', '3', '4']를 만들려면

 

 

let input = [1,2,3,4];
let output = input.map(String);  // output = ['1','2','3','4']

map 함수를 써서 변환하려는 타입을 전달하면 된다.

 

 

 

2. join

let input = [1,2,3,4];
let output = input.join();  // output = '1,2,3,4'

let input = [1,2,3,4];
let output = input.join('-');  // output = '1-2-3-4'

join 함수도 toString처럼 배열의 원소들을 연결해서 하나의 값으로 반환한다.

 

매개변수 separator(분리 기호)에 문자열을 넣어주면 원소들 사이사이에 그 문자열이 들어간다.

 

생략하면 콤마(,)가 분리 기호로 들어간다.

 

 

 

3. copyWithin

 

배열의 일부분을 복사하고, 동일한 배열 내에서 특정 위치에 붙여 넣는 함수다.

 

주의해야 할 특징들이 있다.

• 기존 원소들을 복사한 원소들로 덮어쓴다.
• 복사한 원소들은 원래 배열에 있던 원소들이기 때문에, 기존 배열에 없던 원소가 추가되는 게 아니다.
• 원래 배열을 수정하고, 함수의 리턴 값은 수정된 후의 배열이다.
• 수정된 배열의 길이가 원래 길이보다 길어지면 뒤의 원소들을 잘라내서 배열의 길이를 유지한다.

이러한 특징들로 보았을 때, copyWithin 함수는 정렬 함수 카테고리에 가깝다고 볼 수 있다.

 

하지만 정렬 함수로 부를 수는 없는 게, 특정 원소가 배열에서 사라지거나 특정 원소의 개수가 늘어날 수 있다.

 

 

함수는 3개의 매개변수를 가진다.

• target : 복사한 원소들을 붙여 넣을 위치 인덱스
• start : 복사를 시작할 위치 인덱스
• end : 복사를 끝낼 위치 인덱스 (생략 시 배열의 길이)

end 인덱스에 위치한 원소는 복사할 영역에 포함되지 않는다. (직전 원소까지 포함)

 

그리고 start, end에는 음수나 배열의 길이를 초과하는 숫자가 들어갈 수 있으며

 

이에 대한 처리는 https://growy.tistory.com/28 에서 썼던 slice, splice의 특징을 동일하게 따른다.

 

 

let input = [1,2,3,4,5];
let output = input.copyWithin(1, 0, 2);     // input = output = [1,1,2,4,5]

start(인덱스 0)부터 end(인덱스 2) 까지의 원소들을 복사한다.

 

end는 포함하지 않으니 인덱스 0,1의 [1,2]를 의미한다. 그리고 [1,2]를 인덱스 1 위치에 붙여 넣는다.

 

 

let input = [1,2,3,4,5];
let output = input.copyWithin(3, 1, -1);     // input = output = [1,2,3,2,3]

end로 입력한 -1은 뒤에서부터 한 칸을 센다는 의미로 해석할 수 있고 인덱스 4와 같다.

 

start(인덱스 1)부터 end(인덱스 4)까지의 원소들 [2,3,4]를 복사해서 인덱스 3 위치에 붙여 넣는다.

 

그럼 [1,2,3,2,3,4]가 되는데, 원래 배열의 크기에 맞추기 위해 마지막 4를 삭제한다.

 

 

이 함수를 활용할 수 있는 상황은 극히 드물 것 같다.

 

하지만 새로운 배열을 생성하지 않으며, 원소의 이동/추가/삭제를 하나의 함수로 처리할 수 있다는 장점이 있다.

 

 

 

4. fill

fill 함수는 배열의 일부분을 하나의 값으로 대체하는 함수다.  함수 형태도 copyWithin과 비슷하다.

 

원본 배열을 수정하고 수정된 배열의 반환한다는 점, 수정 후 배열의 길이가 유지된다는 점들도 동일하다.

 

• value : 대체할 값
• start : 대체를 시작할 위치 인덱스 (생략 시 0)
• end : 대체를 끝낼 위치 인덱스 (생략시 배열의 길이)

 

let input = [1,2,3,4,5];
let output = input.fill(0, 1, 4);   // input = output = [1,0,0,0,5]

start(인덱스 1)부터 end(인덱스 4) 까지의 원소들 [2,3,4]를 value(0)으로 대체한다.

 

 

// initialization
let array = new Array(10).fill(true);
        
// some works...
array[4] = false;
array[8] = false;

// reset
array.fill(true);

start와 end를 생략하면 배열 전체를 value 값으로 덮어 씌운다.

 

위 코드처럼 어떤 배열을 초기화할 때, 그리고 그 배열을 다시 리셋시키고 재사용할 때 사용할 수 있을 것 같다.

 

 

let array = new Array(3).fill({price: 0}); // array = [0,0,0]
array[0].price = 10;                       // array = [10,10,10]

중요한 점은 fill로 채우는 값은, Value Copy가 아닌 Reference Copy라는 것이다.

 

위의 코드를 통해 하나의 원소를 수정하면 모든 원소가 수정된다는 것을 확인할 수 있다.