본문 바로가기

프로그램/코딩

[javascript]배열 나누기

728x90
반응형

배열의 갯수가 너무 많을 경우 원하는 수만큼 쪼개서 보려고 만든 함수이다

배열 나누기

  let p_ex = document.getElementById("p_ex"); //출력할 곳
  let ex_ex = ['안녕','하세요','한궈','라오꽁','입니다','배열','쪼개기','합니다'];
  let ex_ex_arr = '';
  let input = '';
  function chunk(arr, size) {
    let i, j, temparray = [], chunk = size;
    for (i = 0, j = arr.length; i < j; i += chunk) {
        temparray.push(arr.slice(i, i + chunk));
    }
    return temparray
  }
  function f_select(){
    //입력값을 받아오는 요소들
    input = Number(document.getElementById('count_input').value);//밑의 설명 참고
    if (input <= 0){
      input = 1;
    }
    
    //여기부터 출력하기위한 요소들
    ex_ex_arr = chunk(ex_ex, input); //chunk함수에 값을 받아오기
    let i=0; //그냥 while문으로 해봄
    while( i < ex_ex_arr.length){
      p_ex.innerHTML += '<tr><td>' + ex_ex_arr[i] + '</td></tr>';//출력하는곳 그냥 보기쉬우라고 테이블로 해봄
      i += 1;
    }
  }

select라는 함수명을 사용 못해서 앞에 f_select라는 실행을 받아서 출력하는 함수를 만들었다

input이라는 변수에 document.getElementById('count_input').value를 넣었는데 이때 number로 변환해주지 않으면 input의 개수씩 나오는게 아니라 input의 개수와 나머지가 나오게 된다(밑의 예제에서 number를 지워서 해보시길)

만약 input 이 0일경우 무한반복으로 오류가 뜨기때문에 if문을 만들어 주었다

ex_ex_arr에 chunk함수의 값을 넣어준다

table로 출력해서 보여준다

chunk라는 배열을 직접적으로 쪼개는 함수를 만들고

arr이라는 배열(변수 : ex_ex)을 받아와서 

size라는 input 입력값을 넣어준다

slice이라는 함수로 원본 배열을 바꾸지 않고 배열을 나눠 저장한다

See the Pen Untitled by korearaogong (@korearaogong) on CodePen.

728x90
반응형