电脑知识|欧美黑人一区二区三区|软件|欧美黑人一级爽快片淫片高清|系统|欧美黑人狂野猛交老妇|数据库|服务器|编程开发|网络运营|知识问答|技术教程文章 - 好吧啦网

您的位置:首頁技術文章
文章詳情頁

JavaScript中數組去重的5種方法

瀏覽:124日期:2023-10-22 13:43:07

正常情況下,數據去重的工作一般都是由后端同事來完成的,但是前端也要掌握好處理數據的能力,萬一去重的工作交給我們大前端處理,我們也不能慫呀?,F在我總結了一些去重的方法,希望對大家有點幫助。

方法一:new Set()實現數組去重

ES6 提供了新的數據結構 Set,它類似于數組,但是成員的值都是唯一的,沒有重復的值。 Set 本身是一個構造函數,用來生成 Set 數據結構。Set函數可以接受一個數組,用于初始化。根據 Set的數據特性,我們可以實現數組去重。

let list = [1, 1, ’a’, ’a’, true, true, false, false, null, ’’, null, ’’, undefined, undefined];let list1 = Array.from(new Set(list)); // [ 1, 'a', true, false, null, '', undefined ]let list2 = [...new Set(list)]; // [ 1, 'a', true, false, null, '', undefined ]

方法二:some()+循環去重

some() 方法用于檢測數組中的元素是否滿足指定條件(函數提供) 。 如果有一個元素滿足條件,則表達式返回true , 剩余的元素不會再執行檢測。 如果沒有滿足條件的元素,則返回false。 我們可以定義一個新數組來承接沒有重復的數據,遍歷原始數組的時候,用新數組來判斷數據是否已經出現過。

function distinct(list) { let result = [list[0]];// 用于承接沒有重復的數據,初始時將原始數組的第一個值賦給它。 for (let i = 1; i < list.length; i++) { // 判斷結果數組中是否存在一樣的值,若果沒有的話則將數據存入結果數組中。 if (!(result.some(val => list[i] === val))) { result.push(list[i]); } } return result; }let arr = [1, 1, ’a’, ’a’, true, true, false, false, null, ’’, null, ’’, undefined, undefined];distinct(arr); // [ 1, 'a', true, false, null, '', undefined ]

方法三:雙重for循環去重

雙重for循環,第一層循環確保數組中的每一項都能被比較,第二層循環確保被比較項后的每一項都能跟被比較項比較。

function distinct2(list) { for (let i = 0; i < list.length; i++) { for (let j = i + 1; j < list.length; j++) { // 后面數據的若跟前一項數據相同,則重復,需要去除。 if (list[i] === list[j]) {list.splice(j, 1); // 去除后面的相同項j--; } } } return list;}let arr = [1, 1, ’a’, ’a’, true, true, false, false, null, ’’, null, ’’, undefined, undefined];distinct2(arr); // [ 1, 'a', true, false, null, '', undefined ]

方法四:hasOwnProperty()方法去重

hasOwnProperty() 方法用來檢測一個屬性是否是對象的自有屬性,而不是從原型鏈繼承的。如果該屬性是自有屬性,那么返回 true,否則返回 false。

function unique(arr) { var obj = {}; // 用來記錄數組中的數據 return arr.filter(function(item, index, arr){ // 如果記錄對象中存在某個數據,則返回false過濾掉;否則obj進行記錄并篩選出來 return obj.hasOwnProperty(typeof item + item) ? false : (obj[typeof item + item] = true) })}let arr = [1,1,’true’,’true’,true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,’NaN’, 0, 0, ’a’, ’a’,{},{}];unique(arr) // [ 1, 'true', true, 15, false, undefined, null, NaN, 'NaN', 0, ’a’, {}]

方法五:利用filter()+indexOf()方法去重

indexOf() 方法可返回某個指定的字符串值在字符串中首次出現的位置。

function unique(arr) { return arr.filter(function(item, index, arr) { // 從數組0位開始查,如果當前元素在原始數組中的第一個索引==當前索引值,說明它是第一次出現。 return arr.indexOf(item, 0) === index; });}let list = [1, 1, ’a’, ’a’, true, true, false, false, null, ’’, null, ’’, undefined, undefined];unique(list); // [ 1, 'a', true, false, null, '', undefined ]

此外,數組去重還可以利用filter()、includes()等方法實現,但是思路都跟上面幾種方法類似,這里就不一一列舉了。

以上就是JavaScript中數組去重的5種方法的詳細內容,更多關于JavaScript中數組去重的資料請關注好吧啦網其它相關文章!

標簽: JavaScript
相關文章:
主站蜘蛛池模板: 干式变压器厂_干式变压器厂家_scb11/scb13/scb10/scb14/scb18干式变压器生产厂家-山东科锐变压器有限公司 | 悬浮拼装地板_篮球场木地板翻新_运动木地板价格-上海越禾运动地板厂家 | 集装箱标准养护室-集装箱移动式养护室-广州璟业试验仪器有限公司 | 【铜排折弯机,钢丝折弯成型机,汽车发泡钢丝折弯机,线材折弯机厂家,线材成型机,铁线折弯机】贝朗折弯机厂家_东莞市贝朗自动化设备有限公司 | 电杆荷载挠度测试仪-电杆荷载位移-管桩测试仪-北京绿野创能机电设备有限公司 | 缓蚀除垢剂_循环水阻垢剂_反渗透锅炉阻垢剂_有机硫化物-郑州威大水处理材料有限公司 | 反渗透阻垢剂-缓蚀阻垢剂厂家-循环水处理药剂-山东鲁东环保科技有限公司 | 超声骨密度仪-动脉硬化检测仪器-人体成分分析仪厂家/品牌/价格_南京科力悦 | 新材料分散-高速均质搅拌机-超声波分散混合-上海化烁智能设备有限公司 | PO膜_灌浆膜及地膜供应厂家 - 青州市鲁谊塑料厂 | 上海三信|ph计|酸度计|电导率仪-艾科仪器 | POM塑料_PBT材料「进口」聚甲醛POM杜邦原料、加纤PBT塑料报价格找利隆塑料 | 电子万能试验机_液压拉力试验机_冲击疲劳试验机_材料试验机厂家-济南众标仪器设备有限公司 | PE一体化污水处理设备_地埋式生活污水净化槽定制厂家-岩康塑业 | 爆炸冲击传感器-无线遥测传感器-航天星百科 | 中天寰创-内蒙古钢结构厂家|门式刚架|钢结构桁架|钢结构框架|包头钢结构煤棚 | 【黄页88网】-B2B电子商务平台,b2b平台免费发布信息网 | 工业设计,人工智能,体验式3D展示的智能技术交流服务平台-纳金网 J.S.Bach 圣巴赫_高端背景音乐系统_官网 | 生物制药洁净车间-GMP车间净化工程-食品净化厂房-杭州波涛净化设备工程有限公司 | 课件导航网_ppt课件_课件模板_课件下载_最新课件资源分享发布平台 | 保镖公司-私人保镖-深圳保镖公司【环宇兄弟保镖】 | 云阳人才网_云阳招聘网_云阳人才市场_云阳人事人才网_云阳人家招聘网_云阳最新招聘信息 | 四川职高信息网-初高中、大专、职业技术学校招生信息网 | 自动焊锡机_点胶机_螺丝机-锐驰机器人| 闸阀_截止阀_止回阀「生产厂家」-上海卡比阀门有限公司 | 美国PARKER齿轮泵,美国PARKER柱塞泵,美国PARKER叶片泵,美国PARKER电磁阀,美国PARKER比例阀-上海维特锐实业发展有限公司二部 | 浙江皓格药业有限公司| 明渠式紫外线杀菌器-紫外线消毒器厂家-定州市优威环保 | 恒温槽_恒温水槽_恒温水浴槽-上海方瑞仪器有限公司 | 聚合氯化铝-碱式氯化铝-聚合硫酸铁-聚氯化铝铁生产厂家多少钱一吨-聚丙烯酰胺价格_河南浩博净水材料有限公司 | 天津市能谱科技有限公司-专业的红外光谱仪_红外测油仪_紫外测油仪_红外制样附件_傅里叶红外光谱技术生产服务厂商 | 基业箱_环网柜_配电柜厂家_开关柜厂家_开关断路器-东莞基业电气设备有限公司 | 纯化水设备-纯水设备-超纯水设备-[大鹏水处理]纯水设备一站式服务商-东莞市大鹏水处理科技有限公司 | China plate rolling machine manufacturer,cone rolling machine-Saint Fighter | 仿清水混凝土_清水混凝土装修_施工_修饰_保护剂_修补_清水混凝土修复-德州忠岭建筑装饰工程 | 超声波分散机-均质机-萃取仪-超声波涂料分散设备-杭州精浩 | 防堵吹扫装置-防堵风压测量装置-电动操作显示器-兴洲仪器 | 新型锤式破碎机_新型圆锥式_新型颚式破碎机_反击式打沙机_锤式制砂机_青州建源机械 | 低气压试验箱_高低温低气压试验箱_低气压实验箱 |林频试验设备品牌 | 台湾HIWIN上银直线模组|导轨滑块|TBI滚珠丝杆丝杠-深圳汉工 | 压力控制器,差压控制器,温度控制器,防爆压力控制器,防爆温度控制器,防爆差压控制器-常州天利智能控制股份有限公司 |