今天在用js写一些小demo时,碰到了一些坑的地方,记录一下这些小坑点,并随时扩充
push方法有点坑
const map = new Map(); map.set('name',['cwl']); map.set('name',map.get('name').push('xm')) console.log(map)
我写了一个很简短的代码,就是先设置map中key为‘name’, value值是一个数组,然后向数组里面添加一个元素。我们期望得到的结果应该是name:['cwl', 'xm']。但是实际却完全不同
我们得到的是一个key为‘name’, value 为2的map对象,值是数组的长度。这是为什么呢?
我们来看一下push方法,发现push是有返回值的,返回值是新的数组长度,所以我们最终set进去的value值是新数组的长度
改进
const arr = map.get('name') arr.push('xm') map.set('name',arr)
fill也挺坑
当我们使用fill创建二维数组的时候
const arr2 = new Array(3).fill(new Array(3).fill(-1)); console.log(arr2);
得到了一个二维数组,这是毋庸置疑的
当我们改变数组时
arr2[1][1] = 2; arr2[2][2] = 3;
我们期望的结果
但是实际我们得到的结果却是
怎么会这样呢?其实很简单,fill
方法所填充的如果是对象的话,那么每一个填充的元素都是这个对象的浅拷贝,也就是同一个内存地址的对象。 所以就出现了这种情况。因此,在使用 fill
时,一旦填充的是对象,就要格外小心了。
画个图简单理解一下
那么我们应该怎么避免呢?独家(bushi)创建二维数组的方法
const arr3 = new Array(3).fill(-1).map(() => new Array(3).fill(-1)); console.log(arr3);
未完待续......