In this article, you will learn about the javascript Array built-in method Array.prototype.fill(). How does this method work in javascript?
This Array.prototype.fill() method is used to change all the elements in an array with a specified static value from a starting index(Default 0) to an end index(default array.length). This method returns a modified array.
array.fill(value [, fill_start [, fill_end]] );This method takes 3 parameter
Value: The value to use when filling each element of the array.
fill_start(Optional): The index position where the fill of the elements in an array will start. If fill_start is negative, the index position will be applied (in reverse) starting from the end of the array. If this parameter is not supplied, then the default is 0.
fill_end(optional): The index position where the fill of the elements in an array will end, but does not include the ending element itself. If fill_end is negative, the index position will be applied (in reverse) starting from the end of the array. If this parameter is not supplied, then the default is array.length.
Array.prototype.fill() on an empty array would not modify it as the array has nothing to be modified. To use Array.prototype.fill() when declaring an array, make sure to assign slots to the array. Here are some examples of Array.prototype.fill() method:
/*
When we pass only value, it will replace
all the elements from start to end
*/
console.log([1, 2, 3].fill(5));
//output => [5, 5, 5]
/*
When we pass only value and start index value,
it will replace all the elements from start to end
*/
console.log([1, 2, 3].fill(5, 1));
//output => [1, 5, 5]
/*
When we pass only static value, start index, and end index,
it will replace all the elements from start to end
*/
console.log([1, 2, 3].fill(5, 1, 2));
//output => [1, 5, 3]
/*
When we pass only static value, the start index and end index both have the same value,
it will not replace the element
*/
console.log([1, 2, 3].fill(5, 1, 1));
//output => [1, 2, 3]
/*
When we pass only static value and start index and end index
has greater value than an array.length, then it will not replace the element
*/
console.log([1, 2, 3].fill(5, 3, 3));
// [1, 2, 3]
/*
When we pass only static value, and start index and end index
has negative, then it will start filling the element from end.
*/
console.log([1, 2, 3].fill(5, -3, -2));
//output => [5, 2, 3]
/*
When we pass only static value and start index and end index
has NaN, then it will not modify the array.
*/
console.log([1, 2, 3].fill(5, NaN, NaN));
//output => [1, 2, 3]
/*
When we pass only static value and start index and end index
has greater value than an array.length, then it will modify the array
*/
console.log([1, 2, 3].fill(5, 3, 5));
//output => [1, 2, 3]
/*
When we pass only static value, and we have an empty array with a specific length,
then it will fill the array with the element we passed as a static value
*/
console.log(Array(3).fill(5));
//outut => [5, 5, 5]
console.log([].fill.call({ length: 3 }, 5));
//output => {0: 4, 1: 4, 2: 4, length: 3}
I hope this article will help you to understand the javascript Array built-in method Array.prototype.fill().
Share your valuable feedback, please post your comment at the bottom of this article. Thank you!
Comments