我们先分析简单的场景,数组内只有基本类型,不含引用类型

首先举个栗子:

image.png

打印结果如下:

image.png

对于第一次接触这个场景的新手来说,其实这段代码很吓人。不要害怕,接下来我带你一步一步理解这段代码的含义。

我们要学会把复杂逻辑,分多步,简单化去实现一个功能。就好比这个数组,我们假设它只有三个number类型的内容。


image.png

1.首先定义一个函数,这个函数接受一个数组作为参数

image.png

2.先用for循环遍历拿到我们数组中的每一项元素,很简单的

image.png

这时候,一定要把这个问题简单话,不要去管后面的循环,你就只需要把i当成0就可以,那么你现在拿到了这个数组的第一个元素1,我们去重,那么肯定就需要拿到第二个元素对吧?那第二个元素我怎么拿呢?你第一层怎么拿,那就怎么拿呗。再来一个for不就行了吗?

image.png

ok,你现在有12了,接下来做比较不就行了吗?如果相同,我们把后面出现的元素,也就是j索引对应元素删除即可。

image.png

我认为复习一下splice这个方法是很有必要的

splice这个方法的使用知识.

  1. 这个函数是改变原数组的
  2. 这个函数可以接收三个参数,第一个参数为你要删除元素在数组中的索引值,第二个参数是从这个索引向后删除多少个元素,第三个参数就是在你这个索引后面增加多少个元素,这个参数是一个以逗号分隔的数据,一般很少有人知道第三个参数,但是如果你在和别人说的时候,你知道第三个参数,那么别人肯定会对你的基本功做出一个肯定的答案。
  3. .特别重要的一点,这个函数返回值是你截取的那一部分,并不是返回原数组。(这里很多人会有一个大误区,就是我想着删除第一个元素[1,2,1],返回的应该是剩下的[2,1],但是实际上返回值是[1],我们真正想要的结果还需要去操作原属组。)

废话不多说,咱们先抛开原题,简单试验一下splice这个方法

image.png

思考一:如果只有一个参数的话,那么B会是什么呢?

image.png

答案是:第二个参数它会默认设置为数组的长度arr.length

思考二:下面会是怎样的输出呢?

image.png

这个代码我就不放答案了,强烈建议自己去敲一敲,按F12在控制台打一下真的花不了你一分钟的。


回到正题

ok,我们再来捋一下下面的代码。

image.png

乍一看好像没什么问题,运行一下试试;

image.png

什么情况?我们不是去重复值吗?怎么还有重复的呢?我们来一步一步分析一下到底怎么回事:

  1. i拿着数字1去和下面对比,对比到j=4,发现1===1,运行splice(4,1)把数组末尾的1删除,这时候原数组的值为arr=[1,2,2,2]
  2. 接下来进入第二轮循环i拿着索引为1的数字2去对比拿着j拿着的索引为2的数字2,发现2===2这时候运行splice(2,1)!!!!!注意:全篇重点来了!!!!! splice方法运行后,arr的长度发生变化,原本数组是arr=[1,2,2,2],现在数组中索引为2的元素数字2被删除了,而后面原来索引值为3的数字2的索引值瞬间变为了2,!!!这个索引值的变化是瞬间的,注意,此时,我们的j还是22比过了吗?是的,比过了,所以i拿着2直接去找索引为3的数字了

这种方法我们想到了,我应该在判断的时候,如果进到了下面的if语句里

image.png

那么就说明找到了重复的值,那么我们就让j--,重新再让i拿着的数字和当前的索引判断一下是否相等。

image.png


总结:我们要通过这个例子,来捋清查重的思路,我不仅仅希望通过这篇文章你只学会了删除1,2,3,更重要的是你通过这个例子来打通之前未考虑这个问题的思路。举一反三,希望你可以动手敲一敲。


FFF方
451 声望12 粉丝