JS实现数组去重的八种方法（实用）
admin
2024-01-20 07:30:30
0次

前言

js数组去重是比较常见的数组操作方式之一，网上有很多关于数组去重的博客文章，方法各式各样，但有些方法实用性很差，很容易造成不必要的麻烦，所以我们需要去其糟粕取其精华，下面我们就整理一些比较实用的数组去重方法。

Methods 1：利用双重for循环

思路：定义一个新数组，并存放原数组的第一个元素，然后将元素组一一和新数组的元素对比，若不同则存放在新数组中。

function unique(arr) {let newArr = [arr[0]];for (let i = 1; i < arr.length; i++) {let repeat = false;for (let j = 0; j < newArr.length; j++) {if (arr[i] === newArr[j]) {repeat = true;break;}}if (!repeat) {newArr.push(arr[i]);}}return newArr;
}console.log(unique([1, 1, 2, 5, 5, 3, 4, 9, 6, 3, 4]));
// 结果是[1, 2, 5, 3, 4, 9, 6]

Methods 2：利用对象

思路：利用对象属性存在的特性，如果没有该属性则存入新数组

function unique(arr) {const newArr = []const obj = {}arr.forEach(item => {if (!obj[item]) {newArr.push(item)obj[item] = true}})return newArr}console.log(unique([1, 1, 2, 5, 5, 3, 4, 9, 6, 3, 4])) // 结果是[1, 2, 5, 3, 4, 9, 6]

Methods 3：利用数组的indexOf方法

思路：新建一个空数组，遍历需要去重的数组，将数组元素存入新数组中，存放前判断数组中是否已经含有当前元素，没有则存入。此方法也无法对NaN去重。

var arr = [1,9,8,8,7,2,5,3,3,3,2,3,1,4,5,444,55,22];
function unique(arr) {//定义一个新的临时数组 var newArr=[]; //遍历当前数组 for(var i=0;i

Methods 4：利用数组的includes方法

思路：此方法逻辑与indexOf方法去重异曲同工，只是用includes方法来判断是否包含重复元素。

function unique(arr) {var newArr = []for (var i = 0; i < arr.length; i++) {if (!newArr.includes(arr[i])) {newArr.push(arr[i])}}return newArr
}
console.log(unique([1,5,1,5,3,74,32,7,32,6,9,4,7,4]));
// 结果是[1, 5, 3, 74, 32, 7, 6, 9, 4]

Methods 5：利用数组的 filter 和 includes方法

同理，filter+indexOf也可

function unique(arr) {var newArr = []newArr = arr.filter(function (item) {return newArr.includes(item) ? '' : newArr.push(item)})return newArr
}
console.log(unique([1,5,1,5,3,74,32,7,32,6,9,4,7,4]));
// 结果是[1, 5, 3, 74, 32, 7, 6, 9, 4]

Methods 6：利用数组的 forEach 和 includes方法

function unique(arr) {let newArr = [];arr.forEach(item => {return newArr.includes(item) ? '' : newArr.push(item);});return newArr;
}
console.log(unique([1,1,2,5,6,3,5,5,6,8,9,8]));
// 结果是[1, 2, 5, 6, 3, 8, 9]

Methods 7：利用数组的 splice 方法。

function unique(arr){for(var i=0;i

Methods 8：利用Set()+Array.from()

代码最简洁，原理：

  • Set对象：是值的集合，你可以按照插入的顺序迭代它的元素。 Set中的元素只会出现一次，即Set中的元素是唯一的。
  • Array.from() 方法：对一个类似数组或可迭代对象创建一个新的，浅拷贝的数组实例。
function unique(arr){return Array.from(new Set(arr))
}var arr = [1,1,2,9,6,9,6,3,1,4,5];console.log(unique(arr))
//[ 1, 2, 9, 6, 3, 4, 5 ]
词库加载错误:未能找到文件“E:\highferrum_mysql\Configuration\Dict_Stopwords.txt”。

上一篇：学生信息（c++基础）

下一篇：剑指 Offer 03. 数组中重复的数字

相关内容

热门资讯

小赢淘金APP期货投资骗局，平... 　　“小赢淘金”之流，最擅长的就是用“注册送现金”、“充值返券”的糖衣炮弹来引流。别天真地以为那是福...
八方淘金APP非法期货交易欺骗... 　　警惕！八方生财、每日淘金、小赢淘金、悟空订购、蜻蜓订购、斗金订购等APP均涉嫌非法期货交易！　　...
智易购APP贵金属订购交易骗局... 　　很多人看到“3元起投”“充值送福利”“操作简单”“随时提现”这类宣传，很容易把智易购APP当成普...
喜玛银庄APP商品订购投资骗局... 　　喜玛银庄APP白银、铂金“现货订购”骗局警示：无资质平台涉嫌非法期货交易，投资者爆仓后如何维权？...
吉鑫乐享APP炒贵金属订购交易... 　　近期，多名投资者反映在“吉鑫乐享APP”进行贵金属投资时遭遇严重亏损，甚至血本无归。看似正规的“...
易掘金APP虚假期货投资骗局，... 　　“易掘金”的APP它打着“高收益、灵活投资”的旗号，宣称通过“商品订购”就能轻松赚钱，吸引了不少...
在大吉订购APP订购交易亏损被... 　　近期，不少投资者反映在“大吉订购App”上投资白银、铂金等商品遭遇严重亏损。该平台宣称提供现货订...
铂银壹号APP商品订购交易亏损... 　　许多中小投资者误以为网上的“商品现货订购”是合规合法的理财渠道，殊不知这背后隐藏着巨大的合规风险...
兴鑫淘金APP贵金属订购交易亏... 　　白银、贵金属或其他商品类投资，除国家批准的正规期货交易场所及持牌期货公司外，市面上大量第三方交易...
铂银掘金APP无资质的违规平台... 　　铂银掘金等平台的投资者，往往是被“注册送现金”“充值返现券”“首单免亏”等广告话术吸引，进而下载...
八方淘金APP订购交易不合规，... 　　“八方淘金APP”“铂银掘金APP”“铂银壹号APP”等软件被指以“现货订购”为名，实际采用高杠...
在指尖订购APP订购商品亏损被... 　　指尖订购APP这类平台，表面是“订购交易”，实则是披着电商外衣的非法期货陷阱。绝大多数投资者被蒙...
在犀贝易购APP做商品订购交易... 　　市面上打着“现货投资”“贵金属交易”旗号的APP并不少，但真正合规、受监管的平台并不多。犀贝易购...
易达淘金APP虚假商品订购交易... 　　易达淘金APP存在严重的虚假宣传与违规交易行为。该平台打着“商品订购”的旗号，实则通过不合规的交...
大浪淘金APP白银订购亏损被骗... 　　大浪淘金APP最隐蔽的套路，在于其完全封闭的内盘交易系统。表面上，它宣称与国际贵金属市场接轨；实...
一品好购APP上订购白银出现亏... 　　一品好购APP原名“一品订购”，运营方为上海宝智未来信息技术有限公司。近期不少投资者反映在该平台...
九州订购APP贵金属订购投资骗... 　　九州订购APP正通过抖.音、快手、今日头条等平台大量投放投资广告，用“5元起投”“充值返现”“0...
坚锅淘金APP交易软件并不正规... 　　当前，市面上大量所谓的“现货商城订购”交易软件，早已偏离了正常的实物商品买卖，演变为高杠杆、高手...
斗金订购APP贵金属期货交易骗... 　　斗金订购APP的投资者往往被铺天盖地的广告宣传所诱导——注册即送现金、充值返现券等看似诱人的福利...
警惕！云启购APP违规经营，披... 　　"5元起投、充值返现、稳赚不赔"——这些诱人的广告语背后，可能是一个精心设计的金融陷阱。　　近期...