我正在寻找以下方法的任何替代方法,以创建包含1到N的JavaScript数组,其中N仅在运行时已知。
var foo = [];
for (var i = 1; i <= N; i++) {
foo.push(i);
}
对我来说,我觉得应该有一种不用循环的方法。
我正在寻找以下方法的任何替代方法,以创建包含1到N的JavaScript数组,其中N仅在运行时已知。
var foo = [];
for (var i = 1; i <= N; i++) {
foo.push(i);
}
对我来说,我觉得应该有一种不用循环的方法。
当前回答
使用ES6标准中的新Array方法和=>函数语法(编写时仅限Firefox)。
通过用未定义的:
Array(N).fill().map((_, i) => i + 1);
Array.from将“孔”转换为未定义,因此Array.map按预期工作:
Array.from(Array(5)).map((_, i) => i + 1)
其他回答
你可以这样做:
var arr=数组.from(数组(10).keys())arr.shift()控制台日志(arr)
我发现了这条旧线索,因为我自己也在想同样的问题,但我想这里没有一个答案比Kokodoko评论的原始示例更容易,哈哈!
我最终自己使用了这个方法:
var foo = [];
while (foo.length < N)
foo.push( foo.length + 1 );
这至少比常规的for循环稍微快一点,而且希望不容易出错(尽管在计算上可能更昂贵)。
甚至可以做以下事情:
var foo= [];
while (foo.length < N)
foo.push( foo.length%4 + 1 );
以按顺序将阵列填充1-4次。或者使用此方法用单个项填充数组,尽管我想在这种情况下,只使用array(N).fill(x)可能会更快。
您可以这样做:
var N = 10;
Array.apply(null, {length: N}).map(Number.call, Number)
结果:[0,1,2,3,4,5,6,7,8,9]
或具有随机值:
Array.apply(null, {length: N}).map(Function.call, Math.random)
结果:[0.782694901619107,0.9572225909214467,0.8586748542729765,0.8653848143294454, 0.008339877473190427, 0.9911756622605026, 0.8133423360995948, 0.8377588465809822, 0.5577575915958732, 0.16363654541783035]
解释
首先,注意Number.call(undefined,N)等同于Number(N),它只返回N。我们稍后将使用这个事实。
Array.apply(null,[undefined,undefineed,undefinded])等同于Array(undefine,undefine,undefide),它生成一个三元素数组,并为每个元素分配undefine。
如何将其推广到N个元素?考虑一下Array()的工作原理,大致如下:
function Array() {
if ( arguments.length == 1 &&
'number' === typeof arguments[0] &&
arguments[0] >= 0 && arguments &&
arguments[0] < 1 << 32 ) {
return [ … ]; // array of length arguments[0], generated by native code
}
var a = [];
for (var i = 0; i < arguments.length; i++) {
a.push(arguments[i]);
}
return a;
}
自ECMAScript 5以来,Function.pr原型.apply(thisArg,argsArray)也接受鸭子类型的类似数组的对象作为其第二个参数。如果我们调用Array.apply(null,{length:N}),那么它将执行
function Array() {
var a = [];
for (var i = 0; i < /* arguments.length = */ N; i++) {
a.push(/* arguments[i] = */ undefined);
}
return a;
}
现在我们有一个N元素数组,每个元素都设置为undefined。当我们对其调用.map(callback,thisArg)时,每个元素都将被设置为callback.call(thisArg,element,index,array)的结果。因此,[未定义,未定义,…,未定义].map(Number.call,Number)会将每个元素映射到(Number.call).call(Number,undefined,index,array),这与Number.ccall(undefineed,index,array)相同,正如我们之前所观察到的,它的计算结果为index。这就完成了元素与其索引相同的数组。
为什么要解决Array.apply(null,{length:N})而不是Array(N)的问题?毕竟,这两个表达式都会产生一个未定义元素的N元素数组。不同之处在于,在前一个表达式中,每个元素都被显式设置为undefined,而在后一个表达式,每个元素从未被设置。根据.map()的文档:
回调仅对已赋值数组的索引调用;对于已删除或从未赋值的索引,不会调用它。
因此,Array(N)不足;数组(N).map(Number.call,Number)将导致长度为N的未初始化数组。
兼容性
由于该技术依赖于ECMAScript 5中指定的Function.protype.apply()的行为,因此它在之前的ECMAScript5浏览器(如Chrome 14和Internet Explorer 9)中不起作用。
您可以使用此选项:
new Array(/*any number which you want*/)
.join().split(',')
.map(function(item, index){ return ++index;})
例如
new Array(10)
.join().split(',')
.map(function(item, index){ return ++index;})
将创建以下数组:
[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
传统浏览器友好数组构造函数
如果您想要跨浏览器友好的解决方案,您仍然无法击败for循环。这一行仍然适用于20多年的浏览器,包括Internet Explorer 5-11(1998年至今)。
for(var arr=[],i=0;i<10;i++){arr[i]=i+1};
alert(arr);// <<< [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
否则,这在现代HTML5浏览器中有效。。。
const arr = Array(10).fill().map((v,i)=>++i)
alert(arr);// <<< [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]