[ Javascript ] Array.prototype.fill()

fill() 메서드

fill() 메서드는 배열의 시작 index부터 끝 index의 이전까지 정적인 값 하나로 채웁니다.

 

구문

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

 

매개변수

• value: 배열을 채울 값
• start: 시작 index, 기본 값 = 0
• end: 끝 index, 기본 값은 this.length

 

반환 값

변형한 배열

 

예제

const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 0];

console.log(arr.fill(9)); // [9, 9, 9, 9, 9, 9, 9, 9, 9, 9];

arr의 모든 value를 9로 채워줍니다.

console.log(arr.fill(9, 1)); // [1, 9, 9, 9, 9, 9, 9, 9, 9, 9]

두번째 value부터 마지막 value까지 9로 채워줍니다.

console.log(arr.fill(0, 2, 4)); // [1, 2, 0, 0, 5, 6, 7, 8, 9, 0]

세번째 value부터 다섯번째 이전 value까지 0으로 채워줍니다.

console.log(arr.fill(9, 1, 2)); // [1, 9, 3, 4, 5, 6, 7, 8, 9, 0]

두번째 value부터 세번째 이전까지 9로 채워줍니다.

console.log(arr.fill(9, 3, 5)); // [1, 2, 3, 9, 9, 6, 7, 8, 9, 0]

네번째 value부터 여섯번째 이전까지 9로 채워줍니다.

console.log(arr.fill(9, -4, -3)); // [1, 2, 3, 4, 5, 6, 9, 8, 9, 0]

start와 end에 음수가 들어가면 뒤에서부터 계산됩니다.

뒤에서 네번째 value부터 뒤에서 3번째 이전까지 9로 채워줍니다.

console.log(Array(5).fill(4)); // [4, 4, 4, 4, 4]

 

const arr1 = Array(3).fill({}); // [{}, {}, {}]

3개의 객체를 생성합니다.

 

객체 참조

    const arr1 = Array(3).fill({});
    console.log(arr1); // [{hello: '안녕하세요.'}, {hello: '안녕하세요.'}, {hello: '안녕하세요.'}]
    console.log(arr1[0].hello = "안녕하세요."); // 안녕하세요.

    const arr1 = Array(3).fill({});
    console.log(arr1); // [{hello: '안녕하세요.', new: '바이바이.'}, {hello: '안녕하세요.', new: '바이바이.'}, {hello: '안녕하세요.', new: '바이바이.'}]
    console.log(arr1[0].hello = "안녕하세요."); // 안녕하세요.
    console.log(arr1[1].new = "바이바이."); // 바이바이.