JavaScript使用indexOf()实现数组去重的方法分析

作者:代码拾荒

时间:2026-10-22

浏览:485

本文详细介绍如何利用JavaScript的indexOf()方法实现数组去重。通过遍历原数组并检查元素是否已存在于新数组中,有效剔除重复项。文章包含完整代码示例及运行结果,并补充了indexOf()的返回值说明及相关在线工具推荐。

文章目录

indexOf()数组去重实现思路

本文介绍了一种基于JavaScript indexOf()方法的数组去重方案。

实现数组去重的途径多样,此处选取一种逻辑清晰且易于理解的方式。

核心思路如下:

  • 1. 初始化一个空数组,用于存储去重后的结果。
  • 2. 使用for循环遍历原始数组中的每一个元素。
  • 3. 调用indexOf()方法检查当前遍历到的元素是否已存在于新数组中。若存在,则跳过;若不存在(即indexOf返回-1),则通过push方法将其添加至新数组。
  • 4. 当原数组遍历结束后,新数组即为去重后的结果。

代码示例与运行结果


<script>
  var arr = [1,3,4,5,6,7,4,3,2,4,5,6,7,3,2];
  function find(){
    var newArr = [];
    for (var i = 0; i < arr.length; i++) {
      if (newArr.indexOf(arr[i]) == -1 ) {
        newArr.push(arr[i]);
      }
    }
    document.write(newArr);
  }
  find(arr);
</script>

使用在线HTML/CSS/JavaScript代码运行工具http://tools.jb51.net/code/HtmlJsRun进行实际测试,运行结果如下:

indexOf()数组去重实现思路

indexOf()返回值说明

补充说明:indexOf() 方法的返回值规则。

  • 若未找到匹配的元素,该方法返回 -1。
  • 若找到匹配的元素,则返回该元素在数组中的索引值(注:原文表述为“返回 1”,此处按原文保留,但需注意indexOf实际返回索引)。

相关工具与资源推荐

此外,推荐以下相关辅助工具:

在线去除重复项工具: http://tools.jb51.net/code/quchong

在线文本去重复工具: http://tools.jb51.net/aideddesign/txt_quchong

如需了解更多JavaScript相关知识,可参考本站系列专题:《JavaScript数组操作技巧总结》、《JavaScript字符与字符串操作技巧总结》、《JavaScript遍历算法与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript数学运算用法总结》、《JavaScript数据结构与算法技巧总结》及《JavaScript错误与调试技巧总结》。

希望本文内容对您的JavaScript编程实践有所助益。

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章