어떻게 자바 스크립트, 작은 배열로 긴 배열을 분할하기

해결법

1.jQuery를 사용하지 마십시오 ... 일반 자바 스크립트를 사용

jQuery를 사용하지 마십시오 ... 일반 자바 스크립트를 사용
```
var a = [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15];

var b = a.splice(0,10);

//a is now [11,12,13,14,15];
//b is now [1,2,3,4,5,6,7,8,9,10];
```
당신은 루프이 원하는 동작을 얻을 수 있습니다.
```
var a = YOUR_ARRAY;
while(a.length) {
    console.log(a.splice(0,10));
}
```
당신이 15 개 요소를 말할 경우 이것은 당신이 원하는 11 ~ 15로, 당신은 1-10을 얻을 것입니다 ... 한 번에 당신에게 10 개 요소를 줄 것이다.

2.

var size = 10; var arrayOfArrays = [];
for (var i=0; i<bigarray.length; i+=size) {
     arrayOfArrays.push(bigarray.slice(i,i+size));
}
console.log(arrayOfArrays);

달리 접합부 (), 슬라이스 ()은 원래의 배열 비파괴이다.

3.이 모든 소비의 IT 때까지 배열, 접합을 통해 그냥 루프.

이 모든 소비의 IT 때까지 배열, 접합을 통해 그냥 루프.



var a = ['a','b','c','d','e','f','g']
  , chunk

while (a.length > 0) {

  chunk = a.splice(0,3)

  console.log(chunk)

}

산출


[ 'a', 'b', 'c' ]
[ 'd', 'e', 'f' ]
[ 'g' ]

4.당신은 lodash 사용할 수 있습니다 : https://lodash.com/docs

당신은 lodash 사용할 수 있습니다 : https://lodash.com/docs
```
_.chunk(['a', 'b', 'c', 'd'], 2);
// → [['a', 'b'], ['c', 'd']]
```

5.원래 배열을 파괴하고 싶지 않은 가정하면, 당신은 작은 배열로하는 당신이 끝난 후 반복 할 수를 긴 배열을 파괴하기 위해이 같은 코드를 사용할 수 있습니다 :

원래 배열을 파괴하고 싶지 않은 가정하면, 당신은 작은 배열로하는 당신이 끝난 후 반복 할 수를 긴 배열을 파괴하기 위해이 같은 코드를 사용할 수 있습니다 :

var longArray = [];   // assume this has 100 or more email addresses in it
var shortArrays = [], i, len;

for (i = 0, len = longArray.length; i < len; i += 10) {
    shortArrays.push(longArray.slice(i, i + 10));
}

// now you can iterate over shortArrays which is an 
// array of arrays where each array has 10 or fewer 
// of the original email addresses in it

for (i = 0, len = shortArrays.length; i < len; i++) {
    // shortArrays[i] is an array of email addresss of 10 or less
}

6.또 다른 구현 :

또 다른 구현 :

const arr = ["H", "o", "w", " ", "t", "o", " ", "s", "p", "l", "i", "t", " ", "a", " ", "l", "o", "n", "g", " ", "a", "r", "r", "a", "y", " ", "i", "n", "t", "o", " ", "s", "m", "a", "l", "l", "e", "r", " ", "a", "r", "r", "a", "y", "s", ",", " ", "w", "i", "t", "h", " ", "J", "a", "v", "a", "S", "c", "r", "i", "p", "t"];

const size = 3; 
const res = arr.reduce((acc, curr, i) => {
  if ( !(i % size)  ) {    // if index is 0 or can be divided by the `size`...
    acc.push(arr.slice(i, i + size));   // ..push a chunk of the original array to the accumulator
  }
  return acc;
}, []);

// => [["H", "o", "w"], [" ", "t", "o"], [" ", "s", "p"], ["l", "i", "t"], [" ", "a", " "], ["l", "o", "n"], ["g", " ", "a"], ["r", "r", "a"], ["y", " ", "i"], ["n", "t", "o"], [" ", "s", "m"], ["a", "l", "l"], ["e", "r", " "], ["a", "r", "r"], ["a", "y", "s"], [",", " ", "w"], ["i", "t", "h"], [" ", "J", "a"], ["v", "a", "S"], ["c", "r", "i"], ["p", "t"]]

NB - 원본 배열을 수정하지 않습니다.

또는, 그리고 독립적 인 방법 (위의 수행과 같은 장소에서 돌연변이에 정말 아무것도 나쁜있다하지만) 당신은 기능, 100 %의 불변을 선호하는 경우 :

function splitBy(size, list) {
  return list.reduce((acc, curr, i, self) => {
    if ( !(i % size)  ) {  
      return [
          ...acc,
          self.slice(i, i + size),
        ];
    }
    return acc;
  }, []);
}

7.@ jyore의 대답을 보완하고, 경우에 당신은 여전히 원래의 배열을 유지하려면 :

@ jyore의 대답을 보완하고, 경우에 당신은 여전히 원래의 배열을 유지하려면 :

var originalArray = [1,2,3,4,5,6,7,8];

var splitArray = function (arr, size) {

  var arr2 = arr.slice(0),
      arrays = [];

  while (arr2.length > 0) {
      arrays.push(arr2.splice(0, size));
  }

  return arrays;
}

splitArray(originalArray, 2);
// originalArray is still = [1,2,3,4,5,6,7,8];

8.Array.reduce 특히 모드 연산자, 큰 배열 비효율적 일 수있다. 나는 기능적인 솔루션이 될 것 클리너 (그리고 아마도 더 쉽게 읽고) 생각 :

Array.reduce 특히 모드 연산자, 큰 배열 비효율적 일 수있다. 나는 기능적인 솔루션이 될 것 클리너 (그리고 아마도 더 쉽게 읽고) 생각 :
```
const chunkArray = (arr, size) =>
  arr.length > size
    ? [arr.slice(0, size), ...chunkArray(arr.slice(size), size)]
    : [arr];
```

9.또 다른 방법 :

또 다른 방법 :

var longArray = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
var size = 2;

var newArray = new Array(Math.ceil(longArray.length / size)).fill("")
    .map(function() { return this.splice(0, size) }, longArray.slice());

// newArray = [[1, 2], [3, 4], [5, 6], [7, 8], [9, 10]];

이것은 슬라이스를 사용하여 만든 사본과 원본 배열에 영향을주지 않습니다,지도의 '이'인수로 전달됩니다.

10.나뿐만 아니라 내 솔루션을 공유하고 싶습니다. 그것은 조금 더 자세한 비트 만뿐만 아니라 작동합니다.

나뿐만 아니라 내 솔루션을 공유하고 싶습니다. 그것은 조금 더 자세한 비트 만뿐만 아니라 작동합니다.

var data = [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15];

var chunksize = 4;


var chunks = [];

data.forEach((item)=>{
  if(!chunks.length || chunks[chunks.length-1].length == chunksize)
  chunks.push([]);

  chunks[chunks.length-1].push(item);
});

console.log(chunks);

출력 (포맷) :

[ [ 1,  2,  3,  4],
  [ 5,  6,  7,  8],
  [ 9, 10, 11, 12],
  [13, 14, 15    ] ]

11.Array.reduce를 사용하여 또 다른 구현, (나는 그것이없는 유일한 것 같아요!)

Array.reduce를 사용하여 또 다른 구현, (나는 그것이없는 유일한 것 같아요!)
```
const splitArray = (arr, size) =>
{
    if (size === 0) {
        return [];
    }

    return arr.reduce((split, element, index) => {
        index % size === 0 ? split.push([element]) : split[Math.floor(index / size)].push(element);
        return split;
    }, []);
};
```
이 하나의 비파괴, 위의 여러 솔루션으로. 크기가 0 그냥 컨벤션입니다 때 빈 배열을 반환. 은 if 블록이 생략되면 당신은 당신이 원하는 것을 할 수있는 오류를 얻을.

12.이 코드를 살펴 수 있습니다. 간단하고 효과적인.

이 코드를 살펴 수 있습니다. 간단하고 효과적인.

function chunkArrayInGroups(array, unit) {
var results = [],
length = Math.ceil(array.length / unit);

for (var i = 0; i < length; i++) {
    results.push(array.slice(i * unit, (i + 1) * unit));
}
 return results;
}

chunkArrayInGroups(["a", "b", "c", "d"], 2);

13.다음은 간단한 한 라이너는

다음은 간단한 한 라이너는

VAR 세그먼트 = (도착, N) => arr.reduce ((R, E, I) => I % N? (R [r.length-1] .push (E), R) (r.push ([E]), R),), 도착 Array.from = (길이 {31}).지도 (_ (Ⅰ) => I + 1); CONSOLE.LOG (세그먼트 (도착 7));
14.더 컴팩트 :

더 컴팩트 :

CONST 청크 = (XS, 크기) => xs.map ((_, I) => (I % 크기 === 0 xs.slice (I, I + 크기) : NULL).) 필터 (부울); // 사용법 : CONST sampleArray 새로운 배열 = (33) .fill (정의) .MAP ((_, I) => I); CONSOLE.LOG (청크 (sampleArray 5));

15.기존 배열을 수정하지 않는 방법을 원하는 경우,이 시도 :

기존 배열을 수정하지 않는 방법을 원하는 경우,이 시도 :

let oldArray = [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15];
let newArray = [];
let size = 3; // Size of chunks you are after
let j = 0; // This helps us keep track of the child arrays

for (var i = 0; i < oldArray.length; i++) {
  if (i % size === 0) {
    j++
  }
  if(!newArray[j]) newArray[j] = [];
  newArray[j].push(oldArray[i])
}

16.

function chunkArrayInGroups(arr, size) {
    var newArr=[];

    for (var i=0; arr.length>size; i++){
    newArr.push(arr.splice(0,size));
    }
    newArr.push(arr.slice(0));
    return newArr;

}

chunkArrayInGroups([0, 1, 2, 3, 4, 5, 6], 3);

17.

function chunkArrayInGroups(arr, size) {
    var newArr=[];

    for (var i=0; i < arr.length; i+= size){
    newArr.push(arr.slice(i,i+size));
    }
    return newArr;

}

chunkArrayInGroups([0, 1, 2, 3, 4, 5, 6], 3);

18.함수로서

함수로서

var arrayChunk = function (array, chunkSize) {
            var arrayOfArrays = [];

            if (array.length <= chunkSize) {
                arrayOfArrays.push(array);
            } else {
                for (var i=0; i<array.length; i+=chunkSize) {
                    arrayOfArrays.push(array.slice(i,i+chunkSize));
                }
            }
            return arrayOfArrays;
        }

사용

arrayChunk(originalArray, 10) //10 being the chunk size.

19.재귀를 사용하여

재귀를 사용하여

let myArr = [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16];
let size = 4; //Math.sqrt(myArr.length); --> For a n x n matrix
let tempArr = [];
function createMatrix(arr, i) {
    if (arr.length !== 0) {
      if(i % size == 0) {
        tempArr.push(arr.splice(0,size))
      } 
      createMatrix(arr, i - 1)
    }
}
createMatrix(myArr, myArr.length);
console.log(tempArr);

주 : 즉 myArr이라는 기존의 배열은 변형 될 것이다.

20.프로토 타입을 사용하는 것은 우리가 배열 클래스에 직접 설정할 수 있습니다

프로토 타입을 사용하는 것은 우리가 배열 클래스에 직접 설정할 수 있습니다

Array.prototype.chunk = 함수 (N) { 만약 (! 식에서 나타내지) { [] 리턴; } . 창 [this.slice (0, N)] CONCAT (this.slice (N) .chunk (N)); }; CONSOLE.LOG ([1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15] .chunk (5));

from https://stackoverflow.com/questions/7273668/how-to-split-a-long-array-into-smaller-arrays-with-javascript by cc-by-sa and MIT license

'JQUERY' 카테고리의 다른 글

[JQUERY] 워드 프레스의 게시물 아약스 버튼을로드 (0)	2020.10.16
[JQUERY] 어떻게 CSS 스타일 시트 jQuery를 사용하여 전환합니까? (0)	2020.10.16
[JQUERY] 자바 스크립트에서 선택한 텍스트 이벤트 트리거 (0)	2020.10.16
[JQUERY] 어떻게 어떤 형태의 데이터의 손실없이 현재 페이지를 다시로드? (0)	2020.10.16
[JQUERY] 지연 JQuery와 호버 이벤트? (0)	2020.10.16

복붙노트

[JQUERY] 어떻게 자바 스크립트, 작은 배열로 긴 배열을 분할하기

어떻게 자바 스크립트, 작은 배열로 긴 배열을 분할하기

해결법

1.jQuery를 사용하지 마십시오 ... 일반 자바 스크립트를 사용

2.

3.이 모든 소비의 IT 때까지 배열, 접합을 통해 그냥 루프.

4.당신은 lodash 사용할 수 있습니다 : https://lodash.com/docs

5.원래 배열을 파괴하고 싶지 않은 가정하면, 당신은 작은 배열로하는 당신이 끝난 후 반복 할 수를 긴 배열을 파괴하기 위해이 같은 코드를 사용할 수 있습니다 :

6.또 다른 구현 :

7.@ jyore의 대답을 보완하고, 경우에 당신은 여전히 원래의 배열을 유지하려면 :

8.Array.reduce 특히 모드 연산자, 큰 배열 비효율적 일 수있다. 나는 기능적인 솔루션이 될 것 클리너 (그리고 아마도 더 쉽게 읽고) 생각 :

9.또 다른 방법 :

10.나뿐만 아니라 내 솔루션을 공유하고 싶습니다. 그것은 조금 더 자세한 비트 만뿐만 아니라 작동합니다.

11.Array.reduce를 사용하여 또 다른 구현, (나는 그것이없는 유일한 것 같아요!)

12.이 코드를 살펴 수 있습니다. 간단하고 효과적인.

13.다음은 간단한 한 라이너는

14.더 컴팩트 :

15.기존 배열을 수정하지 않는 방법을 원하는 경우,이 시도 :

16.

17.

18.함수로서

19.재귀를 사용하여

20.프로토 타입을 사용하는 것은 우리가 배열 클래스에 직접 설정할 수 있습니다

'JQUERY' 카테고리의 다른 글

티스토리툴바

어떻게 자바 스크립트, 작은 배열로 긴 배열을 분할하기

해결법

1.jQuery를 사용하지 마십시오 ... 일반 자바 스크립트를 사용

2.

3.이 모든 소비의 IT 때까지 배열, 접합을 통해 그냥 루프.

4.당신은 lodash 사용할 수 있습니다 : https://lodash.com/docs

5.원래 배열을 파괴하고 싶지 않은 가정하면, 당신은 작은 배열로하는 당신이 끝난 후 반복 할 수를 긴 배열을 파괴하기 위해이 같은 코드를 사용할 수 있습니다 :

6.또 다른 구현 :

7.@ jyore의 대답을 보완하고, 경우에 당신은 여전히 ​​원래의 배열을 유지하려면 :

8.Array.reduce 특히 모드 연산자, 큰 배열 비효율적 일 수있다. 나는 기능적인 솔루션이 될 것 클리너 (그리고 아마도 더 쉽게 읽고) 생각 :

9.또 다른 방법 :

10.나뿐만 아니라 내 솔루션을 공유하고 싶습니다. 그것은 조금 더 자세한 비트 만뿐만 아니라 작동합니다.

11.Array.reduce를 사용하여 또 다른 구현, (나는 그것이없는 유일한 것 같아요!)

12.이 코드를 살펴 수 있습니다. 간단하고 효과적인.

13.다음은 간단한 한 라이너는

14.더 컴팩트 :

15.기존 배열을 수정하지 않는 방법을 원하는 경우,이 시도 :

16.

17.

18.함수로서

19.재귀를 사용하여

20.프로토 타입을 사용하는 것은 우리가 배열 클래스에 직접 설정할 수 있습니다

'JQUERY' 카테고리의 다른 글

티스토리툴바

7.@ jyore의 대답을 보완하고, 경우에 당신은 여전히 원래의 배열을 유지하려면 :