자바스크립트 - 2차원 배열 빈 행 / 열 추가, 삭제하기

자바스크립트 전체 링크

 

다음과 같은 배열에 빈 행/열을 추가하거나 삭제해보자.

주어지는 배열의 모든 행의 길이는 같다고 가정한다.

const myArray = [
  [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, 26, 27, 28],
  [29, 30, 31, 32, 33, 34, 35],
];

---

행 추가

 

table의 rowIndex 부터 amount 만큼 행을 추가하는 메서드는 다음과 같다.

emptyArray로 table row의 length만큼 빈 문자열로 이루어진 배열을 만들어서 추가하였다.

const insertRows = (table, rowIndex, amount) => {
  const afterIndex = table.slice(rowIndex);
  const emptyArray = Array.from({ length: table[0].length }, () => "");
  const newRows = Array.from({ length: amount }, () => emptyArray);  
  const newArray = table.slice(0, rowIndex).concat(newRows, afterIndex);

  return newArray;
};

 

2행(rowIndex = 1)에서 3개의 빈 행을 추가해보자.

{ 
  let rowIndex = 1;
  let amount = 3;
  let newArray = insertRows(myArray, rowIndex, amount);

  console.log(newArray);
}

 

출력 결과는 다음과 같다.

[
  [
    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, 26, 27, 28
  ],
  [
    29, 30, 31, 32, 33, 34, 35
  ]
]

---

행 삭제

 

삭제는 splice를 이용하면 간단하다.

const deleteRows = (table, rowIndex, amount) => {
  const newTable = [...table]; 

  newTable.splice(rowIndex, amount);

  return newTable;
};

 

2행(rowIndex = 1)부터 2개의 행을 지워보자.

{
  let rowIndex = 1;
  let amount = 2;
  let newArray = deleteRows(myArray, rowIndex, amount);
  
  console.log(newArray);
}

 

출력 결과는 다음과 같다.

[
  [
    1, 2, 3, 4, 5, 6, 7
  ],
  [
    22, 23, 24, 25, 26, 27, 28
  ],
  [
    29, 30, 31, 32, 33, 34, 35
  ]
]

---

열 추가

 

빈 열을 추가할 때는, 각 행에 대해 빈 문자를 추가해야 한다.

const insertColumns = (table, colIndex, amount) => {
  const newMatrix = [];

  for (let i = 0; i < table.length; i++) {
    const newRow = [...table[i]]; 

    for (let k = 0; k < amount; k++) {
      newRow.splice(colIndex + k, 0, "");
    }

    newMatrix.push(newRow); 
  }

  return newMatrix;
};

 

3열(colIndex = 2)부터 3개의 빈 열을 추가해 보자.

{
  let colIndex = 2;
  let amount = 3;
  let newArray = insertColumns(myArray, colIndex, amount);
  
  console.log(newArray);
}

 

출력 결과는 다음과 같다.

[
  [
    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, 26, 27, 28
  ],
  [
    29, 30, '', '', '', 31, 32, 33, 34, 35
  ]
]

---

열 삭제

 

열 삭제도 마찬가지로 각 행에 대해 처리하면 된다.

const deleteColumns = (table, colIndex, amount) => {
  const newTable = [];
  for (let i = 0; i < table.length; i++) {
    const newRow = [...table[i]]; 
    newRow.splice(colIndex, amount); 
    newTable.push(newRow); 
  }

  return newTable;
};

 

4열(colIndex = 3)부터 2개의 열을 삭제해 보자.

{
  let colIndex = 3;
  let amount = 2;
  let newArray = deleteColumns(myArray, colIndex, amount);
  
  console.log(newArray);
}

 

출력 결과는 다음과 같다.

[
  [ 1, 2, 3, 6, 7 ],
  [ 8, 9, 10, 13, 14 ],
  [ 15, 16, 17, 20, 21 ],
  [ 22, 23, 24, 27, 28 ],
  [ 29, 30, 31, 34, 35 ]
]

---

전체 코드는 다음과 같다.

const insertRows = (table, rowIndex, amount) => {
  const afterIndex = table.slice(rowIndex);
  const emptyArray = Array.from({ length: table[0].length }, () => "");
  const newRows = Array.from({ length: amount }, () => emptyArray);  
  const newArray = table.slice(0, rowIndex).concat(newRows, afterIndex);

  return newArray;
};

const deleteRows = (table, rowIndex, amount) => {
  const newTable = [...table]; 

  newTable.splice(rowIndex, amount);

  return newTable;
};

const insertColumns = (table, colIndex, amount) => {
  const newMatrix = [];

  for (let i = 0; i < table.length; i++) {
    const newRow = [...table[i]]; 

    for (let k = 0; k < amount; k++) {
      newRow.splice(colIndex + k, 0, "");
    }

    newMatrix.push(newRow); 
  }

  return newMatrix;
};

const deleteColumns = (table, colIndex, amount) => {
  const newTable = [];
  for (let i = 0; i < table.length; i++) {
    const newRow = [...table[i]]; 
    newRow.splice(colIndex, amount); 
    newTable.push(newRow); 
  }

  return newTable;
};

const myArray = [
  [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, 26, 27, 28],
  [29, 30, 31, 32, 33, 34, 35],
];

{ 
  let rowIndex = 1;
  let amount = 3;
  let newArray = insertRows(myArray, rowIndex, amount);

  console.log(newArray);
}

{
  let rowIndex = 1;
  let amount = 2;
  let newArray = deleteRows(myArray, rowIndex, amount);
  
  console.log(newArray);
}

{
  let colIndex = 2;
  let amount = 3;
  let newArray = insertColumns(myArray, colIndex, amount);
  
  console.log(newArray);
}

{
  let colIndex = 3;
  let amount = 2;
  let newArray = deleteColumns(myArray, colIndex, amount);
  
  console.log(newArray);
}