[JS] 자바스크립트 특정 값으로 배열의 값 채우기(Arr.fill( ))

 

 

 

 

 

🌈 자바스크립트 특정한 값으로 배열을 채우는 방법

자바스크립트의 배열을 특정 값으로 채우는 방법은 배열의 기본 메서드인 fill( ) 을 사용하는 것이다.

또한, fill 메서드를 통해 특정 인덱스를 지정하여 해당하는 인덱스에 값을 할당할 수도 있다.

 

 

 

 

👨‍💻 기본 구문

arr.fill(value[, start[, end]])

 

◾ 매개변수

   ◽ value : 배열을 채울 값

   ◽ start : 시작 지점의 인덱스, 기본 값은 0이며 생략할 수 있다.

   ◽ end : 끝나는  지점의 인덱스, 기본 값은 배열의 길이(this.length)이며 생략할 수 있다.

 

const array1 = [1, 2, 3, 4];

/* 값 0을 2번째 인덱스부터 4번째 인덱스까지 채운다 */
console.log(array1.fill(0, 2, 4));
// Expected output: Array [1, 2, 0, 0]

/* 값 5를 1번째 인덱스부터 마지막 인덱스까지 채운다 */
console.log(array1.fill(5, 1));
// Expected output: Array [1, 5, 5, 5]

/* 값 0을 모든 인덱스에 채운다 */
console.log(array1.fill(6));
// Expected output: Array [6, 6, 6, 6]

 

 

 

 

🙋‍♂️ 예제로 알아보기

start가 음수일 때 시작 인덱스는 length+start이며, end가 음수이면 끝 인덱스는 length+end이다.

또한, fill 메서드는 this 객체를 변형한 배열을 반환한다는 점에서 주의하여야 한다.

[1, 2, 3].fill(4);               // [4, 4, 4]
[1, 2, 3].fill(4, 1);            // [1, 4, 4]
[1, 2, 3].fill(4, 1, 2);         // [1, 4, 3]
[1, 2, 3].fill(4, 1, 1);         // [1, 2, 3]
[1, 2, 3].fill(4, 3, 3);         // [1, 2, 3]
[1, 2, 3].fill(4, -3, -2);       // [4, 2, 3]
[1, 2, 3].fill(4, NaN, NaN);   // [1, 2, 3]
[1, 2, 3].fill(4, 3, 5);         // [1, 2, 3]
Array(3).fill(4);                // [4, 4, 4]
[].fill.call({ length: 3 }, 4);  // {0: 4, 1: 4, 2: 4, length: 3}

let arr = Array(3).fill({}); // [{}, {}, {}]
arr[0].hi = "hi"; // [{ hi: "hi" }, { hi: "hi" }, { hi: "hi" }]

 

 

 

 

 

 

 

 

📌 참고사이트

MDN :: Array.prototype.fill()