当前位置:首页 > JavaScript

js 实现indexof函数

2026-02-02 19:49:59JavaScript

实现 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;
}

数组版本的 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;
}

使用示例

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

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

注意事项

  • 字符串版本支持多字符搜索,而数组版本仅支持单个元素搜索。
  • 两个实现均支持可选的 fromIndex 参数,用于指定开始搜索的位置。
  • 如果未找到目标值,函数返回 -1,与原生的 indexOf 行为一致。
  • 数组版本处理负数的 fromIndex 时,会从数组末尾开始计算位置。

js 实现indexof函数

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

相关文章

js实现轮播

js实现轮播

实现基础轮播效果 使用HTML结构创建轮播容器和图片元素: <div class="carousel"> <div class="carousel-inner">…

css3结合js制作

css3结合js制作

CSS3 结合 JavaScript 制作动态效果 CSS3 和 JavaScript 结合可以实现丰富的动态效果,包括动画、交互和响应式设计。以下是几种常见的实现方式: CSS3 动画与 Jav…

js 实现vue模板

js 实现vue模板

实现 Vue 模板的 JavaScript 方法 通过原生 JavaScript 可以实现类似 Vue 的模板渲染功能,主要包括数据绑定、指令处理和模板解析。以下是核心实现思路: 数据绑定与响应式…

js实现拖拽

js实现拖拽

实现拖拽的基本步骤 通过监听鼠标事件(mousedown、mousemove、mouseup)实现拖拽功能。以下是核心代码逻辑: const draggableElement = document…

js实现图片上传

js实现图片上传

图片上传的基本实现 使用HTML的<input type="file">元素配合JavaScript的File API可以实现图片上传功能。HTML部分需要创建一个文件选择输入框和一个用于…

js实现验证

js实现验证

验证表单输入 使用JavaScript验证表单输入是常见的需求。可以通过监听表单提交事件,检查输入字段是否符合要求。 document.getElementById('myForm').addEve…