H5W3
当前位置:H5W3 > JavaScript > 正文

【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.

本文地址:H5W3 » 【JS】【JavaScript】重写数组的indexOf()方法

评论 0

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址