JavaScript高级语法之一等公民——函数(高阶函数)

JavaScript中一等公民 —— 函数

在JavaScript中,函数是非常重要的,并且是一等公民。所谓的一等公民到底是什么呢?

首先,函数的使用是非常灵活的;
其次函数可以作为另外一个函数的参数;
最后函数也可以终作为一个函数的返回值使用。(高阶函数

接下来就展示一下函数的灵活性。

1.函数作为参数使用

// 将函数做为另一个函数的参数
function foo (a) {
    
    
   a()
}
function fn () {
    
    
    console.log('fn')
}

foo(fn) //将函数fn 作为函数foo的参数使用   输出结果为 fn

上面展示了一个最简单的使用,供大家参考理解,接来下展示一个小案例,示例代码如下:

// 创建一个calc函数,前两个参数为数字,第三个参数为计算函数 (名称顺序均为自定义)
function calc (num1, num2, calcFn) {
    
    
    console.log(calcFn(num1, num2))
}

// 创建一个加法函数
function add (num1, num2) {
    
    
    return num1 + num2
}
// 创建一个减法函数
function sub (num1, num2) {
    
    
    return num1 - num2
}
// 创建一个乘法函数
function mul (num1, num2) {
    
    
    return num1 * num2
}

var a = 20
var b = 30
// 调用calc函数传递不同的函数作为第三个参数,进行不同的方法计算,得到不同的输出结果
calc(a, b, add) // 50
calc(a, b, sub) // -10
calc(a, b, mul) // 600

2.函数作为返回值使用

众所周知,JS语法是允许在函数内部再定义函数的。
如下展示一个通俗易懂的小demo进行展示函数作为返回值的使用,示例代码如下:

// 在foo函数中嵌套一个bar函数
function foo () {
    
    
    function bar () {
    
    
        console.log('bar')
    }
    
    return bar // bar函数做为foo函数的返回值使用
}
var fn = foo()
fn() // bar

变量fn被赋值后就指向于foo函数中的bar函数,所以对fn()进行调用的到bar函数的打印结果

接着展示一个稍微有一丢丢绕的小demo(其实一点都不绕),示例代码如下:

// add函数作为makerAdder函数的返回值使用, makeAdder函数接收一个count的参数
function makeAdder (count) {
    
    
	// add函数接收一个num的参数,返回count与num的和
    function add (num) {
    
    
        return count + num
    }

    return add
}

var add5 = makeAdder(5)  //  此时的add5 意味着等于 函数makeAdder中的函数add
console.log(add5(6)) // 11 
console.log(add5(10)) // 15

这里给补充一个高阶函数的定义 :把一个函数如果接收另一个函数作为参数,或者该函数会返回另个一个函数作为返回值的函数,那么这个函数就称之为高阶函数。
所以上面的两个知识点所展示的代码都可以称为高阶函数。

猜你喜欢

转载自blog.csdn.net/qq_49002903/article/details/124284726