Javascript 二维数据Array类型与Object类型的优劣

Javascript Array Object 二维数组发布于 2021-08-14

在表格编辑数据时，需要对二维数据进行添加、修改和删除等系列操作，Javascript 可储存二维数据有两种类型：Array类型与Ojbect类型。说到二维数据，潜意识首先想到二维数组Array类型。一顿操作后，接近收尾工作时，猛然发现二维数组隐藏的坑。

二维数组添加数据：

JSvar arr = [];
arr[10] = [1,2,3];

console.log(arr,arr.length);

//输出的结果
(11) [empty × 10, Array(3)] 11

二维数组添加下标为10的数据，内存开劈了10个空数据，导致length长度为11，与想要的数组长度相差甚远，理论应该是1。

二维对象添加数据：

JSvar object = {};
object[10] = [1,2,3];

console.log(object,object.length);

//输出的结果
{10: Array(3)} undefined

Object的存储二维数据，最理想，但lenght长度为undefined。不管Array类型或Object类型，想通过lenght获取真实数据长度是不可能的。Javascript由于是弱类型，语法规范并不严谨，利用这点，可以使用for循环获取二维数据的真实长度。

获取二维数据真实长度函数：

JS/**
 * 获取二维数据真实长度函数
 * @method getDataLength
 * @param {Array/Object} data 二维数据
 */
var getDataLength = function (data) {
    var len = 0;
    for(var i in data){
        len++;
    }
    return len;
}

console.log(getDataLength(arr)) //结果：1
console.log(getDataLength(object)) //结果：1

Array类型与Object类型，除了最初声名外，语法与使用基本差不多。在编辑二维数据的情况下，推荐使用Objcet类型，Array类型适合展示已知的数据。