JavaScript如何生成二维数组
更新时间：2023年03月24日 10:20:28 作者：shangdong2023
这篇文章主要介绍了JavaScript如何生成二维数组问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
JavaScript生成二维数组
方法一
new Array(x).fill(new Array(y).fill(0))
但注意，当一个对象被传递给fill方法时，填充数组的是这个对象的引用。
即二维数组的第一个维度中的每一个数组都指向同一个引用，如果向第一个维度中的任一元素执行push，则每一个二维中都会多一个元素。
方法二
new Array(x).fill().map(() => new Array(y).fill(0))
方法三
Array.from(new Array(x), () => new Array(y).fill(0))
测试代码：
const arr1 = new Array(2).fill(new Array(3).fill(0))
// arr1: [ [ 0, 0, 0 ], [ 0, 0, 0 ] ]
arr1[0].push(9)
// arr1: [ [ 0, 0, 0, 9 ], [ 0, 0, 0, 9 ] ]
const arr2 = new Array(2).fill().map(() => new Array(3).fill(0))
// arr2: [ [ 0, 0, 0 ], [ 0, 0, 0 ] ]
arr2[0].push(9)
// arr2: [ [ 0, 0, 0, 9 ], [ 0, 0, 0 ] ]
const arr3 = Array.from(new Array(2), () => new Array(3).fill(0))
// arr3: [ [ 0, 0, 0 ], [ 0, 0, 0 ] ]
arr3[0].push(9)
// arr3: [ [ 0, 0, 0, 9 ], [ 0, 0, 0 ] ] JS中创建二维数组的坑
JS中二维数组的创建
首先JavaScript只支持 一维数组 ，但我们可以通过一些方法实现矩阵以及多维数组
其中普通的创建方法并不会出现什么问题：
(1) 利用一维数组嵌套一维数组的方式创建二维数组：
let arr = [] ; a[0] = [1,2,3,4,5,6]; a[1] = [10,20,30,40,50,60]
然后使用一个 双层for循环 就可以迭代这个二维数组中的元素
所以用这种方法创建多维数组，不管有几个维度，都可以通过嵌套循环来遍历
遇到问题的方法：
let arr1= new Array(10).fill(new Array(10).fill(0))
控制台打印arr1：
这时候，若你想设置，arr[0][0] = 1，你会发现二维数组所有子数组的第一项都被改为1
原因
综上，还是选择老实一点的创建方法：
var a = new Array();
for(var i=0;i<5;i++){ //一维长度为5
a[i] = new Array();
for(var j=0;j<5;j++){ //二维长度为5
a[i][j] = 0;
}
}
总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
这篇文章主要为大家详细介绍了微信小程序实现图片压缩功能，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2018-01-01
JavaScript基于Dom操作实现查找、修改HTML元素的内容及属性的方法
这篇文章主要介绍了JavaScript基于Dom操作实现查找、修改HTML元素的内容及属性的方法,涉及javascript dom模型及事件响应相关操作技巧,需要的朋友可以参考下2017-01-01
这篇文章主要为大家详细介绍了ES6中如何使用Set和WeakSet的相关资料，感兴趣的小伙伴们可以参考一下2016-03-03
这篇文章主要介绍了微信小程序实现图片翻转效果的实例代码，代码简单易懂，非常不错，具有一定的参考借鉴价值,需要的朋友可以参考下2019-09-09
这篇文章主要给大家介绍了关于如何通过JavaScript读取元素的样式,文中通过实例代码以及图文介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下2022-01-01
这篇文章主要为大家介绍了使用cypress编写第一个测试用例，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2022-06-06
这篇文章主要为大家详细介绍了微信小程序实现手机获取验证码后倒计时60s，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-05-05
本文主要介绍了JavaScript树结构的相关知识。具有很好的参考价值，下面跟着小编一起来看下吧2017-01-01
今天把项目生成好后，发布到万维网上进行测试，发现table的隔行换色在IE8，chorem中不能正常显示。找了许多资料，CSS看样是不能解决，只能用JS来控制了2010-07-07
本文主要分享了原生js开发的日历插件的示例代码。具有很好的参考价值，下面跟着小编一起来看下吧2017-02-02
最新评论