视频1 视频21 视频41 视频61 视频文章1 视频文章21 视频文章41 视频文章61 推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37 推荐39 推荐41 推荐43 推荐45 推荐47 推荐49 关键词1 关键词101 关键词201 关键词301 关键词401 关键词501 关键词601 关键词701 关键词801 关键词901 关键词1001 关键词1101 关键词1201 关键词1301 关键词1401 关键词1501 关键词1601 关键词1701 关键词1801 关键词1901 视频扩展1 视频扩展6 视频扩展11 视频扩展16 文章1 文章201 文章401 文章601 文章801 文章1001 资讯1 资讯501 资讯1001 资讯1501 标签1 标签501 标签1001 关键词1 关键词501 关键词1001 关键词1501 专题2001
JS高阶函数原理与用法实例分析
2020-11-27 22:02:08 责编:小采
文档


要完全理解这个概念,首先必须了解函数式编程是什么一等函数(first-Class Function)以及的概念。

函数式编程

在大多数简单的术语中,函数编程是一种编程形式,您可以将函数作为参数传递给其他函数,并将它们作为值返回。在函数式编程中,我们根据函数思考和编码。

JavaScript,Haskell,Clojure,Scala和Erlang是实现函数式编程的一些语言。

一等函数

如果您一直在学习JavaScript,您可能听说过JavaScript将函数视为一等公民。那是因为在JavaScript或任何其他函数式编程语言中,函数是对象。

在JavaScript中,函数是一种特殊类型的对象。他们是Function对象。

在JavaScript中,您可以使用其他类型(如对象,字符串或数字)执行的所有操作函数都可以执行。您可以将它们作为参数传递给其他函数(回调函数),将它们分配给变量并传递它们等等。这就是JavaScript中的函数被称为First-Class函数(一等函数)的原因。

高阶函数

高阶函数是对其他函数进行操作的函数,可以将它们作为参数或通过返回它们。简单来说,高阶函数是一个函数,它接收函数作为参数或将函数作为输出返回。

例如Array.prototype.mapArray.prototype.filter并且Array.prototype.reduce是一些高阶功能,内置的语言。

运行高阶函数

让我们看一下内置高阶函数的一些例子,看看它与我们不使用高阶函数的解决方案的比较。

Array.prototype.map

map()方法通过调用作为输入数组中每个元素的参数提供的回调函数来创建一个新数组。该map()方法将从回调函数中获取每个返回值,并使用这些值创建一个新数组。

传递给回调函数map()方法接受3个参数:element,index,和array。

假设我们有一个数组,我们想要创建一个新数组,其中包含第一个数组的每个值的两倍。让我们看看如何使用和不使用高阶函数来解决问题。

不用高阶函数

const arr1 = [1,2,3]; 
const arr2 = [];
for(let i = 0; i <arr1.length; i ++){ 
 arr2.push(arr1 [i] * 2); 
}
//打印[2,4,6] 
console.log(arr2);

使用高阶函数

const arr1 = [1,2,3];
const arr2 = arr1.map (function (item) { 
 return item * 2; 
}
console.log(arr2)

我们可以使用箭头函数语法使其更短

const arr1 = [1, 2, 3];
const arr2 = arr1.map(item => item * 2);
console.log(arr2);

创建我们自己的高阶函数

到目前为止,我们看到了语言中内置的各种高阶函数。现在让我们创建自己的高阶函数。

我们假设JavaScript没有原生map方法。我们可以自己构建它,从而创建我们自己的高阶函数。

假设我们有一个字符串数组,我们希望将此数组转换为整数数组,其中每个元素表示原始数组中字符串的长度。

const strArray = ['JavaScript', 'Python', 'PHP', 'Java', 'C'];
function mapForEach(arr, fn) {
 const newArray = [];
 for(let i = 0; i < arr.length; i++) {
 newArray.push(
 fn(arr[i])
 );
 }
 return newArray;
}
const lenArray = mapForEach(strArray, function(item) {
 return item.length;
});
// prints [ 10, 6, 3, 4, 1 ]
console.log(lenArray);

在上面的例子中,我们创建了一个高阶函数mapForEach,它接受一个数组和一个回调函数fn。此函数循环遍历提供的数组,并在每次迭代时调用函数调用fn内的回调函数newArray.push

回调函数fn接收数组的当前元素并返回该元素的长度,该元素存储在newArray。for循环完成后,newArray返回并分配给lenArray。

结论

我们已经了解了高阶函数和一个内置的高阶函数。我们还学习了如何创建自己的高阶函数。

简而言之,高阶函数是一个函数,它可以接收函数作为参数,甚至可以返回一个函数。高阶函数就像常规函数一样,具有接收和返回其他函数的附加能力,即参数和输出。

更多关于JavaScript相关内容可查看本站专题:《JavaScript常用函数技巧汇总》、《javascript面向对象入门教程》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》及《JavaScript数算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

下载本文
显示全文
专题