Using JavaScript, how can I create an array with a specific width (number of columns)?-CodePudding

I have an array of columns that represents a row of data in a grid.

It looks something like the following:

let row = [rowId,'string value', 'string value 2', 'string value 3'];

I need to generate a dynamic row of data depending upon a variable number of columns the row will have. In other words, I need the array to be initialized so it contains the id and then X number of columns (depending upon the variable number of columns the grid will have).

[id, 'col-1', 'col-2', ...]

I currently have a ridiculous method which works and looks like the following:

getNewRow(maxKey: number, rowWidth: number){
    switch (rowWidth){
      case 1:{
        return [maxKey, 'col 1'];
        break;  
      }
      case 2:{
        return [maxKey, 'column 1', 'col 2'];
        break;  
      }
      case 3:{
        return [maxKey, 'column 1', 'col 2', 'col 3'];
        break;  
      }
      case 4:{
        return [maxKey, 'column 1', 'col 2', 'col 3', 'col 4'];
        break;  
      }
      case 5:{
        return [maxKey, 'column 1', 'col 2', 'col 3', 'col 4', 'col 5'];
        break;  
      }
      case 6:{
        return [maxKey, 'column 1', 'col 2', 'col 3', 'col 4', 'col 5', 'col 6'];
        break;  
      }
      case 7:{
        return [maxKey, 'column 1', 'col 2', 'col 3', 'col 4', 'col 5', 'col 6', 'col 7'];
        break;  
      }
      case 8:{
        return [maxKey, 'column 1', 'col 2', 'col 3', 'col 4', 'col 5', 'col 6', 'col 7', 'col 8'];
        break;  
      }
      case 9:{
        return [maxKey, 'column 1', 'col 2', 'col 3', 'col 4', 'col 5', 'col 6', 'col 7', 'col 8', 'col 9'];
        break;  
      }
      case 10:{
        return [maxKey, 'column 1', 'col 2', 'col 3', 'col 4', 'col 5', 'col 6', 'col 7', 'col 8', 'col 9', 'col 10'];
        break;  
      }
    }

maxKey is just a simple way of insuring that the id column gets set to a new unique value.

My Questions

Is it possible to generate a row of data like this dynamically?
Is there some way to create a an array on the fly that has a dynamic width (based on the number of columns)?

CodePudding user response：

Create an array of all the cols with their changing index string with Array.from, and then yu can spread that into the returned array.

const getNewRow = (maxKey: number, rowWidth: number) => [
  maxKey,
  ...Array.from(
    { length: rowWidth },
    (_, i) => 'col '   (i   1)
  )
];

CodePudding user response：

Yes, it is possible to generate a row of data like this dynamically in JavaScript. You can use the Array.prototype.fill() method to create an array with a fixed number of elements, and then use the Array.prototype.map() method to map each element to a specific value.

For example, if you want to create a row with a variable number of columns, you can do it like this:

let numColumns = 5; // the number of columns in the row

let row = Array(numColumns)
  .fill(0) // create an array with numColumns elements
  .map((val, index) => `col-${index 1}`); // map each element to a specific value

row.unshift(rowId); // add the row ID to the beginning of the array

console.log(row); // [123, "col-1", "col-2", "col-3", "col-4", "col-5"]

In this example, the row array will be initialized with a number of elements equal to the value of numColumns, and each element will be mapped to a string that represents the corresponding column in the row.

You can then use the Array.prototype.unshift() method to add the row ID to the beginning of the array.