最近写项目过程中总是想写出漂亮的代码，一行代码搞定绝不用两行，也是踩了fill这个坑了
例如一个数组中想填充一些指定的数据
|
1
|
Array(10).fill(1) |
那么结果就会出现[1, 1, 1, 1, 1, 1, 1, 1, 1, 1] 十对应的1个
如果呢fill 这个方法接受的值是一个引用数据类型，那么他们会指向同一个地址。
|
1
2
|
let arr = Array(5).fill({}).map(it=>({})) arr[0].a = 1 |
输出结果：[{a:1}, {a:1}, {a:1}, {a:1}, {a:1}]
解决方案：使用map返回出不同的引用的地址，fill参数可随意填写（不为空），主要是map函数中返回的数据。
类型为数组：
|
1
|
let arr = Array(5).fill([]).map(it=>[]) |
类型为对象：
|
1
|
Array(5).fill({}).map(it=>({})) |
注意：对象要用 小括号包裹 否则函数会以为是函数体，默认不写return 返回undefined 。
补充：JS中用Array.fill() 初始化 二维数组 避坑
现在有个需求，创建一个 m*n 的二维数组 先填充为false
|
1
2
3
4
5
6
7
8
9
|
1.const P = new Array(3).fill(new Array(3).fill(false)); /* [ [false, false, false], [false, false, false], [false, false, false]]*/ |
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
|
2. const P = new Array(3) const obj = {name: 'qqq'} P.fill(obj) /*[ [false, false, false], [false, false, false], [false, false, false]]*/ |
1和2当我改变一个值:
|
1
|
P[0][0] = true; |
结果都是
|
1
2
3
4
5
6
7
|
/* [ [true, false, false], [true, false, false], [true, false, false]]*/ |
坑点：
如果value值为一个引用数据类型，则fill之后，数组里面的值指向的是同一个地址。如果改变了其中一个，则其它的都会改变。
解决：
1.利用双重for循环创建二维数组
|
1
2
3
4
5
6
|
for(var i = 0; i < 3; i++) { arr[i] = new Array(); for(var j = 0; j < 3; j++) { arr[i][j] = 0; }} |
2.先用空数组填充，然后再 map 遍历空数组，添加元素。
|
1
|
const P = new Array(3).fill([]).map(() => new Array(3).fill(false)); |
原文链接：https://blog.csdn.net/m0_46846526/article/details/129180864
© 版权声明
文章版权归作者所有，未经允许请勿转载。
THE END
暂无评论内容