program tip

Javascript / jQuery에서 두 숫자를 포함하여 모든 정수의 배열을 만듭니다.

radiobox 2020. 7. 24. 20:23
반응형

Javascript / jQuery에서 두 숫자를 포함하여 모든 정수의 배열을 만듭니다.


다음 확인란이 있다고 가정 해보십시오.

<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]

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

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 에서 사용 합니다. 심지어 뒤로 단계를 지원하므로 멋지다.


밑줄 또는 lo- 대시 라이브러리를 강력히 권장합니다.

http://underscorejs.org/#range

(거의 완전히 호환 가능하고 lodash는 더 빨리 실행되지만 밑줄은 doco IMHO가 더 우수합니다)

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

두 라이브러리에는 매우 유용한 유틸리티가 많이 있습니다.


루프 내 버전;)

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

사용 사례

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;
};

피들 :

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


ES6 :

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


가장 빠른 방법

  1. 반면에 대부분의 브라우저에서 더 빠릅니다.
  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

파이어 폭스에서 3 배 더 빠름

aipad air에서만 for 루프가 조금 더 빠릅니다.

win8, osx10.8, ubuntu14.04, ipad, ipad air, ipod에서 테스트되었습니다.

크롬, ff, 즉, 사파리, 모바일 사파리.

for 루프가 최적화되지 않은 오래된 브라우저, 즉 브라우저에서 성능을보고 싶습니다!


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 생성자에 전달합니다. Array 생성자는 모든 요소에 정의되지 않은 값이있는 (실제) 길이 targetLength의 밀도가 높은 행렬을 생성합니다. 첫 번째 인수는 배열 생성자 함수 실행 컨텍스트의 'this'값이며 여기서 아무런 역할을하지 않으므로 null입니다.

그래서 지금,

 console.log(b);

수확량

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

드디어

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

makes use of the fact that the Array.map function passes: 1. the value of the current element and 2. the index of the current element, to the map delegate/callback. The first argument is discarded, while the second can then be used to set the correct sequence value, after adjusting for the start offset.

So then

console.log(c);

yields

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

If the start is always less than the end, we can do:

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]

If we want to be able to take a third argument to be able to modify the step used to build the array, and to make it work even though the start is greater than the end:

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]

This way the function accepts positive and negative steps and if no step is given, it defaults to 1.


var values = $(this).val().split('-'),
    i = +values[0],
    l = +values[1],
    range = [];

while (i < l) {
    range[range.length] = i;
    i += 1;
}

range[range.length] = l;

There's probably a DRYer way to do the loop, but that's the basic idea.


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

You can design a range method that increments a 'from' number by a desired amount until it reaches a 'to' number. This example will 'count' up or down, depending on whether from is larger or smaller than to.

Array.range= function(from, to, step){
    if(typeof from== 'number'){
        var A= [from];
        step= typeof step== 'number'? Math.abs(step):1;
        if(from> to){
            while((from -= step)>= to) A.push(from);
        }
        else{
            while((from += step)<= to) A.push(from);
        }
        return A;
    }   
}

If you ever want to step by a decimal amount : Array.range(0,1,.01) you will need to truncate the values of any floating point imprecision. Otherwise you will return numbers like 0.060000000000000005 instead of .06.

This adds a little overhead to the other version, but works correctly for integer or decimal steps.

Array.range= function(from, to, step, prec){
    if(typeof from== 'number'){
        var A= [from];
        step= typeof step== 'number'? Math.abs(step):1;
        if(!prec){
            prec= (from+step)%1? String((from+step)%1).length+1:0;
        }
        if(from> to){
            while(+(from -= step).toFixed(prec)>= to) A.push(+from.toFixed(prec));
        }
        else{
            while(+(from += step).toFixed(prec)<= to) A.push(+from.toFixed(prec));
        }
        return A;
    }   
}

My five cents:

Both direction array of integers function.

When range(0, 5) become [0, 1, 2, 3, 4, 5].

And range(5, 0) become [5, 4, 3, 2, 1, 0].

Based on this answer.

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;
}

P.S. For use in real life you should also check args for isFinite() and isNaN().


Adding http://minifiedjs.com/ to the list of answers :)

Code is similar to underscore and others:

var l123 = _.range(1, 4);      // same as _(1, 2, 3)
var l0123 = _.range(3);        // same as _(0, 1, 2)
var neg123 = _.range(-3, 0);   // same as _(-3, -2, -1)
var empty = _.range(2,1);      // same as _()

Docs here: http://minifiedjs.com/api/range.html

I use minified.js because it solves all my problems with low footprint and easy to understand syntax. For me, it is a replacement for jQuery, MustacheJS and Underscore/SugarJS in one framework.

Of course, it is not that popular as underscore. This might be a concern for some.

Minified was made available by Tim Jansen using the CC-0 (public domain) license.


        function getRange(a,b)
        {
            ar = new Array();
            var y = a - b > 0 ? a - b : b - a;
            for (i=1;i<y;i++)
            {
                ar.push(i+b);
            }
            return ar;
        }


Solving in underscore

data = [];
_.times( highEnd, function( n ){ data.push( lowEnd ++ ) } );

참고URL : https://stackoverflow.com/questions/8069315/create-array-of-all-integers-between-two-numbers-inclusive-in-javascript-jquer

반응형