避坑-js正确地使用fill()初始化二维数组_Coding101的博客-程序员宝宝_fill初始化

技术标签: 二维数组  前端  fill  javascript  

先介绍一下坑

fill()方法都知道,填充数组

比如:

let a = new Array(5).fill(0);
console.log(a); // 输出结果为[0, 0, 0, 0, 0]

当我们想使用fill创建一个二维数组时

let arr=new Array(5).fill(new Array(5).fill(0))
console.log(arr)

输出

 看似没有什么问题,当我给某个元素重新赋值

arr[1][1]=1
console.log(arr)

输出

 我只想给arr[1][1]赋值,但是每一个第一维数组的下标为1的元素的值全部改变了,这不是我们想要的。

原因

fill()的参数不是基本类型时,比如数组、对象,并不是将它的值填充到数组,而是将它的地址填充到数组,所以填充后数组的每一项都指向的是同一个对象,就会出现"牵一发而动全身"的现象。

解决方法

1.老老实实的遍历,不聊

2.使用map()给每个第一维的数组分别赋值,不懂map()点这里

let arr=new Array(5).fill(0).map(item=>new Array(5).fill(0))
arr[1][1]=1
console.log(arr)

输出

这样就只有arr[1][1]发生改变了,完美解决。

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/double_sweet1/article/details/122271796

智能推荐

FFmpeg —— AVPacket_信必诺的博客-程序员宝宝

AVPacket      简介:          *是FFmpeg中很重要的一个数据结构,它保存了解复用之后,解码之前的数据(仍然是压缩后的数据)和关于这些数据的一些附加信息,如显示时间戳(pts)、解码时间戳(dts)、数据时长,所在媒体流的索引等。          存储压缩数据(视频对应H.264等码流数据,音频对应AAC/MP3等码流数据),简单来说就是携带一个NAL视频单元,或者多个NAL音频单元。 AVPacket保存一个NAL单元的解码前数据,该结构本身不直接包含数据,其有一个指向

vue组件之Prop属性_悦.L的博客-程序员宝宝

一般页面元素是有属性的,如a标签有href等属性,同样Vue中组件也是有属性的。在Vue组件中想要使用属性,首先需要在组件内部定义一些属性,这些属性在Vue中被为prop,在组件中通过props选项中定义。...

NIO 中 阻塞和非阻塞式IO。NIO完成网络通信_诗水人间的博客-程序员宝宝

阻塞与非阻塞传统的 IO 流都是阻塞式的。也就是说,当一个线程调用 read() 或 write()时,该线程被阻塞,直到有一些数据被读取或写入,该线程在此期间不能执行其他任务。因此,在完成网络通信进行 IO 操作时,由于线程会阻塞,所以服务器端必须为每个客户端都提供一个独立的线程进行处理,当服务器端需要处理大量客户端时,性能急剧下降。Java NIO 是非阻塞模式的。当线程从...

out of memmory 解决之道_avibird的博客-程序员宝宝

1. 原因“堆” (heap)是一块连续的虚拟地址空间(Virtual Address Space)。用户常用malloc 和 free来申请和释放所需要的空间。 堆经过malloc,free等操作后,堆内产生了很多碎片。碎片的大小一般是物理页的整数倍。通常,用户可使用的地址空间为2到3G,空间包括了代码段、数据段、堆栈、和共享库所需的空间,其中堆占用的空间最大。但是随着碎片数量逐步增加,

关于IIS的IWAM_和IUSR_用户的密码(转载)_jason0898的博客-程序员宝宝

前两天服务器一直中毒,而且被黑客上传了一些文件在C盘上,好像是什么 抓鸡的 程序。同时一发现都是上传在guest 和 iis_net 用户下。为了安全请见,在不太清楚的情况下把guest用户禁了,同时也修改了IUSR用户的密码,这下惨了,勤助首页的网页访问都需要验证。把我急死了。后来找文章终于知道是因为密码修改的问题。现在吧找到的两天文章放上来,希望有兴趣的同学看看。前几天到一...

[2022 ACTF]web题目复现_Snakin_ya的博客-程序员宝宝

查看dockerfile发现题目使用环境为goahead5.1.4,联想到p神对于该漏洞的复现记录,我们有两种方法解题:GoAhead环境变量注入复现踩坑记hack.c编译exp.pyexp.py简单看一下代码逻辑:server.js整个题目通过websockets通信,当api为getflag时传入flagbot这里发现admin登录没有任何限制,那么我们登录admin再传入getflag即可原型链污染:xss:ToLeSion考点:TLS-Poison一篇文章带你读懂 TLS

随便推点

SonarQube中配置c语言/c++语言代码规则插件_gblfy的博客-程序员宝宝_sonar-c-plugin

文章目录一、下载+安装+重新启动1. 下载文件2.安装3. 重新启动SonarQube4. SonarQube管控台验证二、SonarQube管控台配置2.1. 创建配置模板2.2. 添加规则2.3. 查看配置模板规则列表2.4. 修改默认语言规则应用2.5. C++配置流程同上我是java出身,因为特殊需要,要用sonarqube做一套c代码静态检查工具,一脸迷茫…在sonarqube中...

下拉刷新_iykzhang的博客-程序员宝宝_下拉刷新内容【 i 二首

import android.content.Contextimport android.util.AttributeSetimport android.view.Gravityimport android.view.MotionEventimport android.view.Viewimport android.widget.FrameLayoutimport android.widget.L

关于ArraysList,LinkedList,HashSet,LinkedHashSet,TreeSet的总结_jin6872115的博客-程序员宝宝

关于ArraysList,LinkedList,HashSet,LinkedHashSet,TreeSet的总结ArraysList:底层是数组,有序结构,按照进栈先后分配索引,查找方便,属于先进后出,如果从后面取元素,效率快在指定位置添加元素时,(System.arraycopy(elementData, index, elementData, index + 1, size - i

IC卡(智能卡)基础知识简介_挨踢小诸葛的博客-程序员宝宝

1、何为IC卡(智能卡)  IC卡是从磁条卡发展而来,它是将一个集成电路芯片封装在一个卡片中。与磁条卡相比,IC卡可靠性好,存储容量大,而且具有一定的“智能”。IC卡大致分为存储器卡与“智能”卡两个最常用的大类,存储器卡是将一个EEPROM存储器芯片封装在卡片中,使卡片具有“记忆”功能。信息可以“写入(存)”卡内或从卡内“读出(取)”,原则上存取过程是不受限制的,整个存储空间也是开

我使用过的Linux命令之make - 强大的编译工具_jiafu1115的博客-程序员宝宝

我使用过的Linux命令之make - 强大的编译工具本文链接:http://codingstandards.iteye.com/blog/969924   (转载请注明出处) 用途说明make命令是一个常用的编译命令,尤其是在开发C/C++程序时,它通过Makefile文件中描述的源程序之间的依赖关系来自动进行编译。Makefile文件是按照规定的格式编写的,文件中需要说明如

PTA--基础编程题目集(7-8 超速判断) Python版_Dersun的博客-程序员宝宝

强者救赎自己,圣人普度他人。题目描述: 模拟交通警察的雷达测速仪。输入汽车速度,如果速度超出60 mph,则显示“Speeding”,否则显示“OK”。输入格式:输入在一行中给出1个不超过500的非负整数,即雷达测到的车速。输出格式:在一行中输出测速仪显示结果,格式为:Speed: V - S,其中V是车速,S或者是Speeding、或者是OK。输入样例1:40结尾无空行输出样例1:Speed: 40 - OK结尾无空行输入样例2:75输出样例2:Speed: 75 - S.

推荐文章

热门文章

相关标签