Following up on this answer for creating an array of specified length, I executed the below to get a corresponding result but filled with random numbers, instead of zeros.
var randoms = Array(4).fill(Math.floor(Math.random() * 9));
Well, mathematically speaking it's random, all right. But I'd like the randomness to be visible within the array and not only between runs, of course. Stupid computer... Don't do what I say. Do what I want!
I can iterate and put it my random (and varying) values. But I wonder, of pure curiosity, if it's possible to get the right result with a one-liner, like above, MatLab-style. Do I need to call eval(function()...)? I've heard a lot of bad things about eval...
Note that the above produces code like this:
[7, 7, 7, 7]
[3, 3, 3, 3]
etc. while I want something like
[1, 2, 3, 4]
[4, 3, 8, 4]
What does Array#fill
do?
According to MDN
The fill()
method fills all the elements of an array from a start index to an end index with a static value.
You can use Function#apply
, Array#map
, Math.floor()
, Math.random()
.
In ES6, Array#from
and Arrow function can be used.
Array.from({length: 6}, () => Math.floor(Math.random() * 9));
Array.apply(null, Array(6)).map(() => Math.floor(Math.random() * 9));
var randomArr = Array.from({length: 6}, () => Math.floor(Math.random() * 9));
document.getElementById('result').innerHTML = JSON.stringify(randomArr, 0, 4); // For demo only
<pre id="result"></pre>
In ES5:
Array.apply(null, Array(6)).map(function(item, index){
return Math.floor(Math.random() * 9);
});
var randomArr = Array.apply(null, Array(6)).map(function(item, index){
return Math.floor(Math.random() * 9)
});
document.getElementById('result').innerHTML = JSON.stringify(randomArr, 0, 4);
<pre id="result"></pre>
What is Array.apply(null, Array(n))
? Can new Array(n)
used here?
Both the above code create new array of six elements, each element having value as undefined
. However, when used new
syntax, the created array is not iterable. To make the array iterable, Array.apply(null, Array(6))
syntax is used.
If you have lodash included on page, it's really easy.
_.times(6, _.random.bind(0, 100))
^ - Number of elements in array
^ - Random number range min
^^^ - Random number range max
Note: This answer is inspired from Colin Toh's blog
var randoms = Array(4).fill(Math.floor(Math.random() * 9));
This line of code will create a list of 4 of the same number because fill
takes a single value and repeats it for the length of the list. What you want to do is run the random number generator each time:
var makeARandomNumber = function(){
return Math.floor(Math.random() * 9);
}
var randoms = Array(5).fill(0).map(makeARandomNumber);
console.log(randoms)
// => [4, 4, 3, 2, 6]
https://jsfiddle.net/t4jtjcde/
Short and simple ES6 approach -
// randomly generated n = 4 length array 0 <= array[n] <= 9
var randoms = Array.from({length: 4}, () => Math.floor(Math.random() * 10));
Enjoy!
I wonder if it's possible to get the right result with a one-liner...
var randoms = [...Array(4)].map(虚 => Math.floor(Math.random() * 9));
document.body.innerText = randoms;
`const t = Array.from({length: n}, mapArrowFx);
1) const t10 = Array.from({length: 10}, (v, k) => k);
[0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
2) const tEven = Array.from({length: 10}, (v, k) => 2*k);
[0, 2, 4, 6, 8, 10, 12, 14, 16, 18]
........
3)
let n=100;
const tRandom= Array.from({length: n}, (v, k) => Math.floor(Math.random()*n));
...