我正在寻找以下方法的任何替代方法,以创建包含1到N的JavaScript数组,其中N仅在运行时已知。

var foo = [];

for (var i = 1; i <= N; i++) {
   foo.push(i);
}

对我来说,我觉得应该有一种不用循环的方法。


当前回答

您可以这样做:

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)中不起作用。

其他回答

使用递归的ES6解决方案。不同于所有其他解决方案

const range = (n, A = []) => (n === 1) ? [n, ...A] : range(n - 1, [n, ...A]);


console.log(range(5));

嗯,简单但重要的问题。Functional JS在Array对象下肯定缺少一个通用的展开方法,因为我们可能需要创建一个数字项数组,不仅是简单的[1,2,3,…,111],而且是一个函数产生的序列,可能是x=>x*2而不是x=>x

目前,要执行这项工作,我们必须依赖Array.prototype.map()方法。然而,为了使用Array.prototype.map(),我们需要提前知道数组的大小。还是。。如果我们不知道大小,那么我们可以使用Array.prototype.reduce(),但Array.protocol.reduce)用于缩小(折叠)而不是展开正确。。?

显然,我们需要函数JS中的Array.unfold()工具。这是我们可以简单地自己实现的;

Array.unfold = function(p,f,t,s){
  var res = [],
   runner = v =>  p(v,res.length-1,res) ? [] : (res.push(f(v)),runner(t(v)), res);
  return runner(s);
};

数组展开(p,f,t,v)采用4个参数。

p这是一个定义停止位置的函数。与许多数组函子一样,p函数接受3个参数。值、索引和当前生成的数组。它应返回布尔值。当它返回true时,递归迭代停止。f这是一个返回下一项函数值的函数。t这是一个函数,用于返回下一个参数,以便在下一个回合中提供给f。s是种子值,用于通过f计算索引0的舒适座椅。

因此,如果我们打算创建一个数组,其中包含一个像1,4,9,16,25…n^2这样的序列,我们可以简单地这样做。

Array.unfold=函数(p,f,t,s){var res=[],转轮=v=>p(v,res.length-1,res)?[]:(res.push(f(v)),runner(t(v),res);回流流道;};var myArr=数组展开((_,i)=>i>=9,x=>Math.pow(x,2),x=>x+1,1);console.log(myArr);

使用ES6标准中的新Array方法和=>函数语法(编写时仅限Firefox)。

通过用未定义的:

Array(N).fill().map((_, i) => i + 1);

Array.from将“孔”转换为未定义,因此Array.map按预期工作:

Array.from(Array(5)).map((_, i) => i + 1)

试试看:

var foo = [1, 2, 3, 4, 5];

如果您正在使用CoffeeScript,可以通过执行以下操作创建范围:

var foo = [1..5]; 

否则,如果您使用的是普通JavaScript,那么如果要将数组初始化为可变长度,则必须使用循环。

尝试在Number的原型中添加迭代器。

Number.prototype[Symbol.iterator] = function *(){
  let i = 0;
  while(i < this) yield i++;
  return;
}

现在数字是可迭代的,只需将一个数字传递给Array.from

Array.from(10);//[0, 1, 2, 3, 4, 5, 6, 7, 8, 9]

或者任何其他需要迭代的地方,比如。。。循环。

for(const number of 10) console.log(number);//logs 0 through 9 sequentially

这有点复杂,但也很酷。