iis服务器助手广告广告
返回顶部
首页 > 资讯 > 前端开发 > JavaScript >javascript中关于去重操作的使用
  • 133
分享到

javascript中关于去重操作的使用

2024-04-02 19:04:59 133人浏览 薄情痞子
摘要

目录前言:核心的基本算法数据去重的基本用法1、数组去重2、字符串去重3、数字去重最后前言: 前端开发里面,在js中关于数据去重操作的使用是非常常用,也是非常重要的点,一般情况下关于对

前言:

前端开发里面,在js中关于数据去重操作的使用是非常常用,也是非常重要的点,一般情况下关于对数组去重点操作是最常用的,其次是具体的关于某一数据类型的去重操作,如字符串去重、数字去重等。那么本篇博文就来分享一下去重操作的使用,方便后期查阅使用。

核心的基本算法

     遍历拿到的数据数组,然后把该数组中的元素存放到新的数组中,在存放到新数组之前要检查数组的元素是否已经存在,如果存在(相同元素,即重复元素)就不再放入新的数组中。

数据去重的基本用法

在JS中关于去重操作的使用一般是关于数组去重、字符串去重、数字去重,具体的使用示例如下所示。

1、数组去重

数组去重有三种方法:

  • 方法一:indexOf循环去重;
  • 方法二:es6的Set去重;Array.from(new Set(arr));
  • 方法三:Object 键值对去重;把数组的值存成 Object 的 key 值,比如 Object[valuea] = true, 在判断另一个值的时候,如果 Object[valueb]存在的话,就说明该值是重复的。

这里只拿indexOf 循环去重来做示例,​​

   示例数组:

var array = [1, 2, 3, 4, 5, 5, 4, 3, 2,1];

   处理方法:

function repeat(array){
var array1 = []; // 新建数组用来存array的值
for(var i=0,leng=array.length;i<leng;i++){
if(array1.indexOf(array[i]) === -1){
array1.push(array[i]);
}
}
return array1;
}
console.log(unique(array)); // 数组输出结果: [ 1, 2, 3, 4, 5]

注意:indexOf是ES5新增加的函数,用来获取数组中元素的位置(下标),兼容性IE8+。

2、字符串去重

示例字符串:       

var str = "12345678987654321”;

处理方法:

function repeat(str){
var str1 = ""; //用来接收去重后的字符串
for(var i in str){
if(str1.indexOf(str.charAt(i)) == -1){
str1+=str.charAt(i);
}
}
return str1; // 返回去重后的字符串
}
// 输出结果repeat("123456789");

// 字符串转换成数组
function repeat1(str){
var array = str.slice("");
var str1 = uniqueArray(array);
return str1.join("");
}
console.log(repeat1(str)); //输出结果repeat1("123456789");

3、数字去重

接着上面字符串去重的思路就比较简单许多,首先把数字转换成字符串,然后再做处理。12345678987654321去重之后结果为123456789。

示例字符串:

var str = "12345678987654321”;

处理方法:

function repeat(num){
var str = num + "";
var num1 = repeat(str);
return parseInt(num1);
}
console.log(repeat(num)); // 输出结果repeat(123456789);

最后

     通过上面介绍的JS中关于去重操作的使用汇总,常用的去重算法通过本文内容就可涵盖,在vue.js开发中的使用就游刃有余了,这也是在开发过程中必用的功能,尤其是对于初中级开发者来说,更应该掌握这些情况的使用,这里不再赘述。

到此这篇关于javascript中关于去重操作的使用的文章就介绍到这了,更多相关JS去重操作内容请搜索编程网以前的文章或继续浏览下面的相关文章希望大家以后多多支持编程网!

--结束END--

本文标题: javascript中关于去重操作的使用

本文链接: https://www.lsjlt.com/news/145763.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • javascript中关于去重操作的使用
    目录前言:核心的基本算法数据去重的基本用法1、数组去重2、字符串去重3、数字去重最后前言: 前端开发里面,在JS中关于数据去重操作的使用是非常常用,也是非常重要的点,一般情况下关于对...
    99+
    2024-04-02
  • javascript中去重操作怎么使用
    本篇内容主要讲解“javascript中去重操作怎么使用”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“javascript中去重操作怎么使用”吧!核心的基本算法    &nb...
    99+
    2023-06-30
  • 关于JavaScript数组对象去重的几种方法
    数组对象如下: let repeatData = [ { id: 1, name: 'sun', age: 18 }, { id: 1, name: ...
    99+
    2023-05-17
    JavaScript数组去重 js数组对象去重
  • python中关于文件的操作
    今天让我们来一起学习一下python中关于文件的操作吧:先看看以下如果打开文件:#open()打开文件的方法:r参数只能以读的方式打开文件,不能写=(,,=)data=.read()(data) ...
    99+
    2023-01-31
    操作 文件 python
  • Golang 使用Map实现去重与set的功能操作
    假设现在有一个需求 将以下 url 保存起来,要求不重复 www.baidu.com www.sina.com.cn www.hao123.com www.baidu.com w...
    99+
    2024-04-02
  • python3中关于时间格式的操作
    在写python时,很多时候需要用的时间函数,如:记录当前时间,以时间命名文件,或是比较时间的先后等,这里记录一下关于常用时间模块的方法。 环境:ubuntu16.04python3.5.2 用到两个模块:time 和 datetime ...
    99+
    2023-01-31
    操作 格式 时间
  • 关于MySQL中的 like操作符详情
    1、简介 当对未知或者说知道某一部分的值进行过滤时,可以使用like操作符;like操作符用于模糊匹配。 like支持两个通配符,它们分别是: %通配符,用于匹配多个字...
    99+
    2024-04-02
  • nodejs中关于mysql数据库的操作
    目录基本概念为什么要有数据库什么是数据库数据库的分类数据库中基本术语数据库的可视化操作(创建数据库、创建表)数据类型(部分)数据库的常见命令数据库相关表相关插入数据修改数据删除数据查...
    99+
    2022-11-13
    nodejs数据库操作 mysql数据库操作 nodejs mysql数据库
  • Mysql中关于表的操作是怎样的
    Mysql中关于表的操作是怎样的,很多新手对此不是很清楚,为了帮助大家解决这个难题,下面小编将为大家详细讲解,有这方面需求的人可以来学习下,希望你能有所收获。创建数据库  createdatabase数据库...
    99+
    2024-04-02
  • JavaScript中关于Object.create()的用法
    JavaScript的Object.create()方法 ES5定义了一个名为Object.create()的方法,它创建一个对象,其中第一个参数就是这个对象的原型,Object.c...
    99+
    2023-02-10
    JavaScript的Object.create用法 Object.create() JS Object.create()
  • Shell中怎么实现文本去重操作
    这期内容当中小编将会给大家带来有关Shell中怎么实现文本去重操作,文章内容丰富且以专业的角度为大家分析和叙述,阅读完这篇文章希望大家可以有所收获。代码如下:ccccaaaabbbbddddbbbbccccaaaa现在需要对它进行去重处理,...
    99+
    2023-06-09
  • javascript的操作符适用于哪些值
    这篇文章主要讲解了“javascript的操作符适用于哪些值”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“javascript的操作符适用于哪些值”吧! ...
    99+
    2024-04-02
  • 关于javascript中的parentNode
    parentNode是JavaScript中的一个属性,它用于访问一个元素的父节点。在DOM(文档对象模型)结构中,每个HTML元素...
    99+
    2023-09-13
    Java
  • 关于JavaScript的URL.createObjectURL()的使用方法
    URL.createObjectURL() 静态方法会创建一个 DOMString,其中包含一个表示参数中给出的对象的URL。这个 URL 的生命周期和创建它的窗口中的 docume...
    99+
    2023-05-17
    JavaScript createObjectURL() URL.createObjectURL()
  • 使用JavaScript怎么对数组去重
    使用JavaScript怎么对数组去重?相信很多没有经验的人对此束手无策,为此本文总结了问题出现的原因和解决方法,通过这篇文章希望你能解决这个问题。js数组去重方法:1、遍历数组法;2、数组下标判断法;3、排序后相邻去除法;4、优化的遍历数...
    99+
    2023-06-14
  • 详解JavaScript中常用操作符的使用
    目录1、可选链操作符(optional chaining operator)2、空值合并操作符(nullish coalescing operator)3、箭头函数(Arrow Fu...
    99+
    2023-05-17
    JavaScript操作符使用 JavaScript操作符
  • 关于Python中编辑器的操作方法
    关于Python中编辑器的操作方法,针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。Hello world安装完Python之后(我本机的版本是2.5.4),打开IDLE(Py...
    99+
    2023-06-17
  • 关于Python中字符串的各种操作
    目录1、字符串拼接2、字符串截取(字符串切片)3、分割字符串4、合并字符串5、统计字符串出现的次数6、检测字符串是否包含某子串7、字符串对齐方法8、检索字符串是否以指定字符串开头(s...
    99+
    2024-04-02
  • Python关于Numpy的操作基础
      NumPy(Numerical Python) 是 Python 语言的一个扩展程序库,支持大量的维度数组与矩阵运算,此外也针对数组运算提供大量的数学函数库。  NumPy 的前身 Numeric 最早是由 Jim Hugunin 与...
    99+
    2023-01-31
    操作 基础 Python
  • JavaScript中的new操作符的具体使用
    JavaScript中的new操作符是一个非常重要的概念,它可以让我们创建一个自定义的对象类型或者一个内置的对象类型,比如Array、Date、Function等。那么,new操作符...
    99+
    2023-05-18
    JavaScript new操作符 js new运算符
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作