当前位置:首页 > JavaScript

js 实现indexof函数

2026-04-07 13:35:27JavaScript

实现 JavaScript 的 indexOf 函数

JavaScript 的 indexOf 方法用于返回字符串或数组中指定元素的第一个匹配位置的索引。以下是手动实现该功能的几种方法。

字符串的 indexOf 实现

function customIndexOf(str, searchValue, fromIndex = 0) {
  if (fromIndex < 0) fromIndex = 0;
  if (fromIndex >= str.length) return -1;

  for (let i = fromIndex; i < str.length; i++) {
    if (str[i] === searchValue[0]) {
      let match = true;
      for (let j = 1; j < searchValue.length; j++) {
        if (str[i + j] !== searchValue[j]) {
          match = false;
          break;
        }
      }
      if (match) return i;
    }
  }
  return -1;
}

使用示例:

js 实现indexof函数

const str = "Hello, world!";
console.log(customIndexOf(str, "world")); // 输出: 7
console.log(customIndexOf(str, "x"));    // 输出: -1

数组的 indexOf 实现

function customArrayIndexOf(arr, searchElement, fromIndex = 0) {
  if (fromIndex < 0) fromIndex = Math.max(0, arr.length + fromIndex);

  for (let i = fromIndex; i < arr.length; i++) {
    if (arr[i] === searchElement) {
      return i;
    }
  }
  return -1;
}

使用示例:

js 实现indexof函数

const arr = [1, 2, 3, 4, 5];
console.log(customArrayIndexOf(arr, 3)); // 输出: 2
console.log(customArrayIndexOf(arr, 6)); // 输出: -1

优化版本(支持 Unicode 和边界检查)

对于字符串实现,可以进一步优化以支持 Unicode 字符和更严格的边界检查:

function robustIndexOf(str, searchValue, fromIndex = 0) {
  if (typeof str !== 'string' || typeof searchValue !== 'string') {
    throw new TypeError('Input must be strings');
  }

  if (fromIndex < 0) fromIndex = 0;
  if (fromIndex >= str.length || searchValue.length === 0) return -1;

  const maxIndex = str.length - searchValue.length;
  for (let i = fromIndex; i <= maxIndex; i++) {
    if (str.slice(i, i + searchValue.length) === searchValue) {
      return i;
    }
  }
  return -1;
}

说明:

  • 字符串实现通过逐字符比较来匹配子串。
  • 数组实现直接遍历数组元素。
  • 优化版本使用 slice 方法简化子串匹配,并增加类型检查。

标签: 函数js
分享给朋友:

相关文章

js实现倒计时

js实现倒计时

使用 setInterval 实现倒计时 通过 setInterval 定时器每秒更新剩余时间,适用于简单倒计时场景。 function countdown(seconds, callbac…

js实现全选

js实现全选

实现全选功能的方法 在JavaScript中实现全选功能通常涉及监听全选复选框的点击事件,并根据其状态控制其他复选框的选中状态。以下是几种常见的实现方式: 基础DOM操作实现 通过获取所有目标复选框…

js防抖和节流实现

js防抖和节流实现

防抖(Debounce)的实现 防抖的核心思想是在事件被触发后,延迟执行回调函数。如果在延迟时间内再次触发事件,则重新计时。适用于输入框搜索、窗口大小调整等场景。 function debounce…

js实现投球

js实现投球

实现投球动画的基本思路 使用JavaScript和CSS动画结合的方式模拟投球效果。核心是通过改变元素的位置、旋转和缩放属性,配合定时器或CSS过渡实现平滑动画。 创建基础HTML结构 <…

js实现吸色

js实现吸色

使用Canvas实现吸色功能 通过Canvas的getImageData方法获取像素颜色数据。创建一个Canvas元素,将目标图像绘制到Canvas上,通过鼠标事件获取坐标对应的颜色值。 c…

js实现下拉菜单

js实现下拉菜单

使用HTML和CSS创建基础结构 HTML部分需要包含一个触发下拉的按钮和隐藏的下拉菜单内容: <div class="dropdown"> <button class="dr…