JavaScript/배열(Array)

[JavaScript] 배열 특정 값으로 채우기 - fill()

효니님 2023. 9. 12. 12:13
728x90

 

 

 

배열 특정 값으로 채우기

배열을 특정 값으로 채우는 fill() 메서드에 대해 알아보겠습니다.

 

 

 

fill()

fill(value)
fill(value, start)
fill(value, start, end)

 

fill() 메서드는 배열의 시작 index부터 종료 index 전까지(end index 미포함) value값으로 채웁니다.

 

value

배열을 채울 값입니다.

 

 

start

배열을 채울 시작 index

start가 생략된 경우 기본값은 0입니다.

 

 

end

value값을 채울 배열의 종료 index입니다.

end가 생략되면 기본값은 배열의 길이(array.length)입니다.

 

 

반환값

value로 채워진 변경된 배열을 반환합니다.

 

 

예제 1)

const arr1 = [1, 2, 3, 4];
arr1.fill('A');
console.log(arr1);// ['A', 'A', 'A', 'A']

const arr2 = [1, 2, 3, 4];
arr2.fill('A', 1); 
console.log(arr2);// [1, 'A', 'A', 'A']

const arr3 = [1, 2, 3, 4];
arr3.fill('A', 1, 3); 
console.log(arr3);// [1, 'A', 'A', 4]

 

arr1.fill('A')

arr1.fill('A')

arr1 배열의 전체를 'A'로 채웁니다.

 

 

 

 

 

arr2.fill('A', 1)

arr2.fill('A', 1)

arr2 배열의 arr2[1]부터 끝까지 'A'로 채웁니다.

 

 

 

 

 

arr3.fill('A', 1, 3)

arr3.fill('A', 1, 3)

arr3 배열의 arr3[1] ~ arr3[2]까지(end index 미포함)를 'A'로 채웁니다.

 

 

 

 

예제 2)

const array = [1, 2, 3, 4];
array.fill('A', -2, -1); 
console.log(array);// [1, 2, 'A', 4]

 

array.fill('A', -2, -1)

array.fill('A', -2, -1)

start나 end가 음수로 지정이 되면

배열의 마지막 요소의 index가 -1이 됩니다.

 

array[-2] 자리만 'A'로 채웁니다.(end index 미포함)

 

 

 

fill() 메서드를 사용하여 빈 배열 채우기

const arr1 =  Array(9);
console.log(arr1); // (9) [empty × 9]

const arr2 = Array(9).fill();
console.log(arr2); // (9) [undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined]

const arr3 = Array(9).fill(0);
console.log(arr3); // (9) [0, 0, 0, 0, 0, 0, 0, 0, 0]

 Array(9)

new Array(9) 구문 or Array(9) 구문을 사용하여 배열을 생성하면

길이가 9인 배열이 생성됩니다.

이 배열은 값이 담겨있지 않기 때문에 비어있는 배열입니다.

 

 

Array(9).fill()

길이가 9인 빈 배열에 fill() 메서드를 호출했지만 아무런 값도 채워지지 않았기 때문에 

9개의 요소는 undefined로 채워집니다.

배열을 초기화 하는데 사용하면 유용합니다.

 

 

Array(9).fill(0)

길이가 9인 빈 배열에 fill() 메서드를 사용해 0을 채워 넣은 배열이 반환됩니다.

 

 

 

배열을 원하는 특정한 값으로 인덱스에 채우기 위한

fill() 메서드에 대해 알아보았습니다.

728x90