JavaScript手写数组的常用函数总结

这篇文章主要给大家介绍了关于JavaScript手写数组常用函数的相关资料,文中通过示例代码介绍的非常详细,对大家的学习…

这篇文章主要给大家介绍了关于JavaScript手写数组常用函数的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

目录
  • 前言
  • 参数说明
  • forEach 函数
  • filter 函数
  • find 函数
  • findIndex 函数
  • fill函数
  • map 函数
  • some 函数
  • every 函数
  • reduce 函数
  • reduceRight 函数
  • 最后

前言

在开发过程中,我们常常使用数组的一些 api 相关操作,其中包含 forEach 、 filter 、 find 、 findIndex 、 map 、 some 、 every 、 reduce 、 reduceRight 等函数方法。

今天,我们试试手写这些函数,实现数组这些函数方法。为了方便,直接在数组原型对象 prototype 上扩展。

本文 Githab 已上传,更多往期文章已分类整理。

正文

参数说明

callbackFn 回调函数

thisArg 执行 callbackFn 时使用的 this 值

currentValue 数组中正在处理的元素

index 当前索引

array 源数组

accumulator 累加器

initialValue reduce reduceRight 第一次调用 callbackFn 函数时的第一个参数的值默认值

element 自己实现的 this 对象

forEach 函数

语法: arr.forEach(callbackFn(currentValue [, index [, array]])[, thisArg])

方法功能: 对数组的每个元素执行一次给定的函数。

返回:undefined。

自定义函数:myForEach。

 Array.prototype.myForEach = function(callbackFn, thisArg) { if (typeof callbackFn !== 'function') throw ('callbackFn参数必须是函数'); let element = this, len = element && element.length || 0; if (!thisArg) thisArg = element; for (let index = 0; index 
   

filter 函数

语法: var newArray = arr.filter(callbackFn(currentValue[, index[, array]])[, thisArg])

方法功能: 创建一个新数组, 其包含通过所提供函数实现的测试的所有元素。

返回:一个新的、由通过测试的元素组成的数组,如果没有任何数组元素通过测试,则返回空数组。

自定义函数:myFilter。

 Array.prototype.myFilter = function(callbackFn, thisArg) { if (typeof callbackFn !== 'function') throw ('callbackFn参数必须是函数'); let element = this, len = element && element.length || 0, result = []; if (!thisArg) thisArg = element; for (let index = 0; index 
   

find 函数

语法: arr.find(callbackFn[, thisArg])

方法功能: 返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined。

返回:数组中第一个满足所提供测试函数的元素的值,否则返回 undefined。

自定义函数:myFind。

 Array.prototype.myFind = function(callbackFn, thisArg) { if (typeof callbackFn !== 'function') throw ('callbackFn参数必须是函数'); let element = this, len = element && element.length || 0; if (!thisArg) thisArg = element; for (let index = 0; index 
   

findIndex 函数

语法: arr.findIndex(callbackFn[, thisArg])

方法功能: 返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined。

返回:数组中通过提供测试函数的第一个元素的索引。否则,返回-1。

自定义函数:myFindIndex。

 Array.prototype.myFindIndex = function(callbackFn, thisArg) { if (typeof callbackFn !== 'function') throw ('callbackFn参数必须是函数'); let element = this, len = element && element.length || 0; if (!thisArg) thisArg = element; for (let index = 0; index 
   

fill函数

语法: arr.fill(value[, start[, end]])

方法功能: 用一个固定值填充一个数组中从起始索引到终止索引内的全部元素。不包括终止索引。

返回:返回替换的值,原数组发生改变。

自定义函数:myFill。

 Array.prototype.myFill = function(value, start = 0, end) { let element = this, len = element && element.length || 0; end = end || len; let loopStart = start <0 ? 0 : start,>= len ? len : end; // 设置循环结束值 for (; loopStart 
   

map 函数

语法: var new_array = arr.map(function callbackFn(currentValue[, index[, array]]) {// Return element for new_array }[, thisArg])

方法功能: 创建一个新数组,其结果是该数组中的每个元素是调用一次提供的函数后的返回值。

返回:测试数组中是不是至少有1个元素通过了被提供的函数测试。它返回的是一个Boolean类型的值。 一个由原数组每个元素执行回调函数的结果组成的新数组。

自定义函数:myMap。

 Array.prototype.myMap = function(callbackFn, thisArg) { if (typeof callbackFn !== 'function') throw ('callbackFn参数必须是函数'); let element = this, len = element && element.length || 0, result = []; if (!thisArg) thisArg = element; for (let index = 0; index 
   

some 函数

语法: arr.some(callbackFn(currentValue[, index[, array]])[, thisArg])

方法功能: 测试数组中是不是至少有1个元素通过了被提供的函数测试。它返回的是一个Boolean类型的值。

返回:数组中有至少一个元素通过回调函数的测试就会返回true;所有元素都没有通过回调函数的测试返回值才会为false。

自定义函数:mySome。

 Array.prototype.mySome = function(callbackFn, thisArg) { if (typeof callbackFn !== 'function') throw ('callbackFn参数必须是函数'); let element = this, len = element && element.length || 0; if (!thisArg) thisArg = element; for (let index = 0; index 
   

every 函数

语法: arr.every(callbackFn(currentValue[, index[, array]])[, thisArg])

方法功能 :测试一个数组内的所有元素是否都能通过某个指定函数的测试。它返回一个布尔值。

返回:如果回调函数的每一次返回都为 true 值,返回 true,否则返回 false。

自定义函数:myEvery。

 Array.prototype.myEvery = function(callbackFn, thisArg) { if (typeof callbackFn !== 'function') throw ('callbackFn参数必须是函数'); let element = this, len = element && element.length || 0; if (!thisArg) thisArg = element; for(let index = 0; index 
   

reduce 函数

语法: arr.reduce(callback(accumulator, currentValue[, index[, array]])[, initialValue])

方法功能: 对数组中的每个元素执行一个由您提供的reducer函数(升序执行),将其结果汇总为单个返回值。

返回:函数累计处理的结果。

自定义函数:myReduce。

 Array.prototype.myReduce = function(callbackFn, initialValue) { if (typeof callbackFn !== 'function') throw ('callbackFn参数必须是函数'); let element = this, len = element.length || 0, index = 0, result; if (arguments.length >= 2) { result = arguments[1]; } else { while (index 
   
    = len) throw new TypeError('Reduce of empty array ' + 'with no initial value'); result = element[index++]; } while (index 
    
   

reduceRight 函数

语法: arr.reduceRight(callback(accumulator, currentValue[, index[, array]])[, initialValue])

方法功能: 接受一个函数作为累加器(accumulator)和数组的每个值(从右到左)将其减少为单个值。

返回:执行之后的返回值。

自定义函数:myReduceRight。

 Array.prototype.myReduceRight = function(callbackFn, initialValue) { if (typeof callbackFn !== 'function') throw ('callbackFn参数必须是函数'); let element = this, len = element.length || 0, index = len - 1, result; if (arguments.length >= 2) { result = arguments[1]; } else { while (index >= 0 && !(index in element)) { index--; } if (index <0) { throw new TypeError('reduceRight of empty array with no initial value'); } result = element[index--]; } for (; index >= 0; index--) { if (index in element) { result = callbackFn(result, element[index], index, element); } } return result; } 

最后

到此这篇关于JavaScript手写数组常用函数总结的文章就介绍到这了,更多相关JS手写数组常用函数内容请搜索www.cfluntan.cn以前的文章或继续浏览下面的相关文章希望大家以后多多支持www.cfluntan.cn!

以上就是JavaScript手写数组的常用函数总结的详细内容,更多请关注www.cfluntan.cn其它相关文章!

为您推荐

返回顶部