不变地调整二维数组的大小

时间:2019-02-16 17:52:49

标签: javascript arrays object immutability

演示:https://jsfiddle.net/yxm9d4L0/2/

给出2D 3x3阵列:

let arr = [
    [null, null, null],
    [null, {'hello': 'world'}, null],
    [null, null, null]
]

以及大于当前长度的新尺寸:

width = 10; height = 8;

或小于当前长度:

width = 1; height = 2;

,默认填充值为null

如何根据新的宽度或高度来调整数组immutably的大小?

function handleArrUpdate(h,w) {
  let currentArr = [
    [null, null, null],
    [null, {'hello': 'world'}, null],
    [null, null, null]
  ];
  let currentArrWidth = currentArr[0].length;
  let currentArrHeight = currentArr.length;
  let updatedArr = [...currentArr];

  if (h > currentArrHeight) {
    let arr = createArray(w, null);
    for (let i = 0; i <= h; i++) {
      updatedArr.concat(arr)
    }
  } else if (h < currentArrHeight) {
    let arr = createArray(w, null);
    for (let i = 0; i <= h; i++) {
      updatedArr.concat(arr)
    }
  }

  if (w > currentArrWidth) {
    let arr = createArray(w, null);
    for (let i = 0; i <= h; i++){
      updatedArr[i].concat(arr)
    }
  } else if (w < currentArrWidth) {
    let arr = createArray(w, null);
    for (let i = 0; i <= h; i++) {
      updatedArr[i].concat(arr)
    }
  }

  console.log('updated array', updatedArr);

  function createArray(size, defaultVal) {
    let arr = new Array(size);
    for (let i = 0; i < size; i++) {
      arr[i] = defaultVal;
    }
    return arr;
  }
}

handleArrUpdate(10,8);
handleArrUpdate(1,2);
handleArrUpdate(3,3);

当前,此代码仅适用于串联更高的值。我得到Cannot read property 'concat' of undefined

所需的输出:

//10x8
[
    [null, null, null, null, null, null, null, null, null, null],
    [null, { 'hello': 'world' }, null, null, null, null, null, null, null, null],
    [null, null, null, null, null, null, null, null, null, null],
    [null, null, null, null, null, null, null, null, null, null],
    [null, null, null, null, null, null, null, null, null, null],
    [null, null, null, null, null, null, null, null, null, null],
    [null, null, null, null, null, null, null, null, null, null],
    [null, null, null, null, null, null, null, null, null, null]
];

// 1x2
[
    [null, null]
]

// 3x3
[
    [null, null, null],
    [null, { 'hello': 'world' }, null],
    [null, null, null]
]
// 4x2
[
    [null, null],
    [null, { 'hello': 'world' }],
    [null, null],
    [null, null]
]

2 个答案:

答案 0 :(得分:0)

这是使用Array.from的一种方法。但是,它将复制现有内容,因此将复制对象引用,并且仍将指向相同的对象。

const arr = [
  [null, null, null],
  [null, {'hello': 'world'}, null],
  [null, null, null]
];

function resize(arr, width, height, val = null) {
  const newRow = row => Array.from({ length: width }, (_, i) => {
    return i < row.length ? row[i] : val
  });
  return Array.from({ length: height }, (_, i) => {
    return i < arr.length ? newRow(arr[i]) : Array.from({ length: width }, () => val);
  });
}

console.log(JSON.stringify(resize(arr, 5, 5, 0)));
console.log(JSON.stringify(resize(arr, 2, 4, null)));

答案 1 :(得分:0)

您可以使用过滤器并根据宽度和高度进行推送。

function handleArrUpdate(h,w) {
  let currentArr = [[null, null, null],[null, {'hello': 'world'}, null],[null, null, null]];
  let op = currentArr.map(e => {
   return  e.length > w ? e.filter( (_, index ) => index < w) : e.concat( new Array ( w - e.length ).fill( null ))
  })
  if(h > currentArr.length){
    let temp = h-currentArr.length
    while(temp--)op.push( new Array(w).fill(null) )
  } else {
    op = op.filter( ( _, index ) => index < h )
  }
  return op
}

//console.log(handleArrUpdate(10,8));
console.log(handleArrUpdate(1,2));
console.log(handleArrUpdate(3,3))