Manufacturing an array - why is it different?

Question

consider I declare two variables like this (done within REPL, with node v7.7.2), which I expect to be arrays:

var x = Array(4)
var y = Array.from({length: 4})

then the following should work identically, but it doesn't:

x.map(Math.random)
[ , , ,  ]
y.map(Math.random)
[ 0.46597917021676816,
  0.3348459056304458,
  0.2913995519428412,
  0.8683430009997699 ]

in looking, it seems x and y are both identical:

> typeof x
'object'
> typeof y
'object'
> Array.isArray(x)
true
> Array.isArray(y)
true
> x.length
4
> y.length
4
> typeof x[0]
'undefined'
> typeof y[0]
'undefined'

so why the difference?

`Object.keys(x)` vs `Object.keys(y)` is definitely the reason. — Kevin B, Mar 29 '17 at 20:47
it would have never occurred to me to look for keys in an array (given as how isArray() returns true)! — ekkis, Mar 30 '17 at 23:48

Diego ZoracKy · Answer 1 · 2017-03-29T20:56:04.917

Actually, it should not have the same results fot both cases. See the manual here about Array:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array

If the only argument passed to the Array constructor is an integer between 0 and 232-1 (inclusive), this returns a new JavaScript array with its length property set to that number (Note: this implies an array of arrayLength empty slots, not slots with actual undefined values). If the argument is any other number, a RangeError exception is thrown.

And here about the Array.from() method

https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/from

Check the following example on the page linked above:

// Generate a sequence of numbers
// Since the array is initialized with `undefined` on each position,
// the value of `v` below will be `undefined`
Array.from({length: 5}, (v, i) => i);
// [0, 1, 2, 3, 4]

so there's a difference between an "empty" slot and a slot that contains *undefined*? the last stanza in my code indicates that `typeof x[0] == typeof y[0]` is true. so how can I get the difference? — ekkis, Mar 30 '17 at 23:45

Nina Scholz · Accepted Answer · 2017-03-29T20:56:02.327

For the first three outputs, Array#map works.

It is not called for missing elements of the array (that is, indexes that have never been set, which have been deleted or which have never been assigned a value).

The ECMA 262 standard to Array.from describes a construction with length for a new array (point 7 ff).

var x = Array(4),
    y = Array.from({ length: 4 }),
    arrayX = x.map(Math.random),
    arrayY = y.map(Math.random),
    z = Array.from({ length: 4 }, Math.random);

console.log(x);
console.log(y);
console.log(arrayX);
console.log(arrayY);
console.log(z);

score 1 · Answer 3 · edited May 23 '17 at 11:46

1

The Array created with Array(4) is not iterated over with .map(), whereas the Array.from({ length: 4 }) is iterated over. A fuller explanation can be found at JavaScript "new Array(n)" and "Array.prototype.map" weirdness, you can test this with..

x.map((f,i) => console.log(i)) vs. y.map((f,i) => console.log(i))

edited May 23 '17 at 11:46

Community

1
1

answered Mar 29 '17 at 20:44

user3094755

1,561
16
20

in other words, this is an exact duplicate? – Kevin B Mar 29 '17 at 20:45
Not an exact duplicate, but the cause of the issue was the same. – user3094755 Mar 29 '17 at 20:49

Manufacturing an array - why is it different?

3 Answers3