扣丁学堂HTML5培训分享JS数组去重总结

数组去重，一般会在面试的时候才会碰到，要求手写数组去重方法的代码。如果是被提问到，数组去重的方法有哪些?你能答出其中的10种，面试官很有可能对你刮目相看。下面扣丁学堂HTML5培训小编就给大家分享一下JS数组去重总结。

HTML5培训

在实际项目中碰到的数组去重，一般都是后台去处理，很少让前端处理数组去重。虽然运用到的概率较低，但还是需要了解一下，以防面试的时候被问到。

数组去重的方法：

一、利用ES6 Set去重(ES6中最常用)

如果不考虑兼容性，这种去重的方法代码最少。这种方法还无法去掉“{}”空对象，后面的高阶方法会添加去掉重复“{}”的方法。

二、利用for嵌套for，然后splice去重(ES5中最常用)

双层循环，外层循环元素，内层循环时比较值。值相同时，则删去这个值。

三、利用indexOf去重

新建一个空的结果数组，for 循环原数组，判断结果数组是否存在当前元素，如果有相同的值则跳过，不相同则push进数组。

四、利用sort()

利用sort()排序方法，然后根据排序后的结果进行遍历及相邻元素比对。

五、利用对象的属性不能相同的特点进行去重

六、利用includes

七、利用hasOwnProperty

利用hasOwnProperty 判断是否存在对象属性

八、利用filter

九、利用递归去重

十、利用Map数据结构去重

创建一个空Map数据结构，遍历需要去重的数组，把数组的每一个元素作为key存到Map中。由于Map中不会出现相同的key值，所以最终得到的就是去重后的结果。

十一、利用reduce+includes

最后想要了解更多内容的小伙伴可以登录扣丁学堂官网咨询，扣丁学堂有专业老师制定的HTML5学习路线图辅助学员学习，此外还有与时俱进的HTML5视频教程供大家学习，想要学好HTML5开发的同学请加入扣丁学堂H5技术交流群：673883249。

H5进阶课程：https://ke.qq.com/course/387348?flowToken=1008605【扫码进入前端H5架构师进阶VIP体验课】

H5基础课程：https://ke.qq.com/course/320523?flowToken=1008606【扫码进入HTML5前端开发VIP免费公开课】

注：点击(了解更多)进入课程直播间