在Javascript/jQuery中创建两个数字之间所有整数的数组,包括在内

Question

说我有以下复选框:

<input type="checkbox" value="1-25" />

要获得定义我正在寻找的范围边界的两个数字,我使用以下jQuery:

var value = $(this).val();
var lowEnd = Number(value.split('-')[0]);
var highEnd = Number(value.split('-')[1]);

然后,我如何创建一个包含lowEnd和之间所有整数的数组highEnd,包括lowEnd和highEnd自己？对于这个具体的例子,显然,结果数组将是:

[1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25]

Answer 1

var list = [];
for (var i = lowEnd; i <= highEnd; i++) {
    list.push(i);
}

Answer 2

在JavaScript ES6中:

function range(start, end) {
  return Array(end - start + 1).fill().map((_, idx) => start + idx)
}
var result = range(9, 18); // [9, 10, 11, 12, 13, 14, 15, 16, 17, 18]
console.log(result);

为了完整性,这里有一个可选step参数.

function range(start, end, step = 1) {
  const len = Math.floor((end - start) / step) + 1
  return Array(len).fill().map((_, idx) => start + (idx * step))
}
var result = range(9, 18, 0.83);
console.log(result);

我会用range-inclusive从NPM在实际的项目.它甚至支持向后的步骤,所以这很酷.

Answer 3

我强烈推荐下划线或lo-dash库:

http://underscorejs.org/#range

(几乎完全兼容,显然lodash运行得更快,但下划线有更好的doco恕我直言)

_.range([start], stop, [step])

这两个库都有很多非常有用的实用程序.

Answer 4

用例

var genArr=(1)['..'](10)  //[1,2,3,4,5,6,7,8,9,10]

API;

Number.prototype['..']=function(to,step){
     var arr = [],from=this;
     while(from <= to){
        arr.push(from++);
     }
     return arr;
};

FIDDLE:

http://jsfiddle.net/abdennour/mcpnvsmm/

ES6:

console.log(
   Array.from({length:10},(v,k)=>k+1)
)

Answer 5

我的循环版本;)

var lowEnd = 1;
var highEnd = 25;
var arr = [];
while(lowEnd <= highEnd){
   arr.push(lowEnd++);
}

Answer 6

最快的方式

1. while--在大多数浏览器上更快
2. 直接设置变量比推动更快

功能:

var x=function(a,b,c,d){d=[];c=b-a+1;while(c--){d[c]=b--}return d},

theArray=x(lowEnd,highEnd);

要么

var arr=[],c=highEnd-lowEnd+1;
while(c--){arr[c]=highEnd--}

编辑

可读版本

var arr = [],
c = highEnd - lowEnd + 1;
while ( c-- ) {
 arr[c] = highEnd--
}

演示

http://jsfiddle.net/W3CUn/

对于下行者

性能

http://jsperf.com/for-push-while-set/2

在Firefox中速度更快,速度提高3倍

只有在aipad air上,for循环才会快一点.

在win8,osx10.8,ubuntu14.04,ipad,ipad air,ipod上测试;

与铬,ff,即野生动物园,移动野生动物园.

我想看看旧版ie浏览器的性能,其中for循环没有优化!

Answer 7

function range(j, k) { 
    return Array
        .apply(null, Array((k - j) + 1))
        .map(function(_, n){ return n + j; }); 
}

这大致相当于

function range(j, k) { 
    var targetLength = (k - j) + 1;
    var a = Array(targetLength);
    var b = Array.apply(null, a);
    var c = b.map(function(_, n){ return n + j; });
    return c;
}

打破它:

var targetLength = (k - j) + 1;

var a = Array(targetLength);

这将创建一个正确标称长度的稀疏矩阵.现在稀疏矩阵的问题是虽然它具有正确的标称长度,但它没有实际的元素,因此,对于

j = 7, k = 13

console.log(a);

给我们

Array [ <7 empty slots> ]

然后

var b = Array.apply(null, a);

将稀疏矩阵作为参数列表传递给Array构造函数,该构造函数生成(实际)长度targetLength的密集矩阵,其中所有元素都具有未定义的值.第一个参数是数组构造函数执行上下文的'this'值,并且在此处不起作用,因此为null.

所以现在,

 console.log(b);

产量

 Array [ undefined, undefined, undefined, undefined, undefined, undefined, undefined ]

最后

var c = b.map(function(_, n){ return n + j; });

利用Array.map函数传递的事实:1.当前元素的值和2.当前元素的索引,映射委托/回调.第一个参数被丢弃,而第二个参数可用于在调整起始偏移量后设置正确的序列值.

那么

console.log(c);

产量

 Array [ 7, 8, 9, 10, 11, 12, 13 ]

Answer 8

纯ES6的解决方案

\n

受到上面 m59 答案的启发，但不依赖于fill：

\n

const range = (start, stop) => Array.from({ length: stop - start + 1 }, (_, i) => start + i)\n

\n

所以你可以这样使用它：

\n

range(3,5)\n=>\xc2\xa0[3, 4, 5]\n

\n

Answer 9

function createNumberArray(lowEnd, highEnd) {
    var start = lowEnd;
    var array = [start];
    while (start < highEnd) {
        array.push(start);
        start++;
    }
} 

Answer 10

如果开始总是小于结束,我们可以这样做:

function range(start, end) {
  var myArray = [];
  for (var i = start; i <= end; i += 1) {
    myArray.push(i);
  }
  return myArray;
};
console.log(range(4, 12));                 // ? [4, 5, 6, 7, 8, 9, 10, 11, 12]

如果我们希望能够采用第三个参数来修改用于构建数组的步骤,并使其工作,即使start大于结束:

function otherRange(start, end, step) {
  otherArray = [];
  if (step == undefined) {
    step = 1;
  };
  if (step > 0) {
    for (var i = start; i <= end; i += step) {
      otherArray.push(i);
    }
  } else {
    for (var i = start; i >= end; i += step) {
      otherArray.push(i);
    }
  };
  return otherArray;
};
console.log(otherRange(10, 0, -2));        // ? [10, 8, 6, 4, 2, 0]
console.log(otherRange(10, 15));           // ? [10, 11, 12, 13, 14, 15]
console.log(otherRange(10, 20, 2));        // ? [10, 12, 14, 16, 18, 20]

这样,该函数接受正步和负步,如果没有给出步,则默认为1.

Answer 11

我的五分钱：

两个方向的整数数组函数。

当range(0, 5)变为[0, 1, 2, 3, 4, 5].

而range(5, 0)变为[5, 4, 3, 2, 1, 0].

基于这个答案。

function range(start, end) {
  const isReverse = (start > end);
  const targetLength = isReverse ? (start - end) + 1 : (end - start ) + 1;
  const arr = new Array(targetLength);
  const b = Array.apply(null, arr);
  const result = b.map((discard, n) => {
    return (isReverse) ? n + end : n + start;
  });

  return (isReverse) ? result.reverse() : result;
}

PS 要在现实生活中使用，您还应该检查isFinite()和 的参数isNaN()。