【JS】【JavaScript】重写数组的indexOf()方法

前言

为什么需要重写方法，这些方法直接拿来用不就好了吗？相信初学者总会有这样的疑惑，包括前些天的我同样充满了疑惑。

什么是重写，说白了就是使用现有的知识探究某个方法的底层实现，而重写的过程就是你对这些方法深入理解的过程。只有理解的足够深刻，才能将其模拟出来。

那么模拟它的意义又是什么呢？曾经看过一段话，“初级工程师只要在工作中能够完成对应任务就可以，中级工程师需要具备独立开发模块、造轮子的能力，而高级工程师就是把初级变成中级。”。

那这和重写这些方法又有什么关联呢？举个例子，或许很久以前并没有indexOf方法，而为了完成indexOf的功能，需要重复的编写同样的代码。于是造个轮子吧，然后indexOf诞生了。

所以重写这些方法就是为了深层的探究它是怎么诞生的，而掌握了诞生它的原理就能够写出更多的例如：myIndexOf, mySplice, mySlice等等方法。就能够让自己更加接近一名中级工程师。

为什么会写这样一篇文章？就是为了让更多初学者不要一味的追求框架的用法，框架也是由这些基础的东西产生的。框架的智慧在于原理，在于对基础知识的深刻理解。

重写indexOf()：

【JS】【JavaScript】重写数组的indexOf()方法

const arr = ['重', '写', 'i', 'n', 'd', 'e', 'x', 'o', 'f', '方', '法']

第一步：因为它是数组上的方法，所以需要在数组的原型上添加

Array.prototype.myIndexOf = myIndexOf

第二步：传入查找的元素，如果在数组中能找到则返回索引，否则返回-1

Array.prototype.myIndexOf = function(item) {
let arr = this
let index = -1
for (let i = 0; i < arr.length; i++) {
if (arr[i] == item) {
index = i
}
}
return index
}
console.log(arr.myIndexOf("重")) // 0
console.log(arr.myIndexOf("方")) // 9
console.log(arr.myIndexOf("你瞅啥")) // -1 --- 数组没有该元素

第三步：传入起始位置，如果不传则默认为0；如果长度大于arr.length - 1，则直接返回-1

Array.prototype.myIndexOf = function(item, start) {
let arr = this
let index = -1
let i = 0
if (start) {
if (start > arr.length - 1) {
return -1
} else {
i = start
}
}
for (i; i < arr.length; i++) {
if (arr[i] == item) {
index = i
}
}
return index
}
console.log(arr.myIndexOf("法")) // 10
console.log(arr.myIndexOf("d", 3)) // 4
console.log(arr.myIndexOf("重", 2)) // -1 --- 2开始没有'重'
console.log(arr.myIndexOf("方", 12)) // -1 --- 12 > arr.length
console.log(arr.myIndexOf("瞅你咋的")) // -1 --- 数组没有该元素

第四步：简化代码

Array.prototype.myIndexOf = function(item, start) {
let arr = this //谁调用这个方法this就指向谁
let index = -1 //默认返回-1，找到则修改为对应索引
let i = start | 0 //传入start则 i = start 否则 i = 0
if (start > arr.length - 1) {
return -1
}
for (i; i < arr.length; i++) {
if (arr[i] == item) {
index = i
}
}
return index
}

总结

平时在写代码的时候不要仅仅停留在用，还要思考它在底层是怎么运作的，为什么能够实现这样效果。带着问题找本质，利用自己已经掌握的知识尝试去实现它，遇到瓶颈时再去查找别人是怎么实现的。说这些就是希望编写代码的时候不要只停留在编写的层面，要善于思考，保持这样的习惯会潜移默化的发生很多改变。这些话也写给我自己。

Keep foolish, keep hungry.

以上是 【JS】【JavaScript】重写数组的indexOf()方法 的全部内容， 来源链接： utcz.com/a/97482.html

回到顶部