JS第一类函数
JavaScript是一种动态脚本语言,允许我们以面向对象风格或函数式风格使用它。同样,JavaScript的一个特性就是 第一类函数 。
在本章节中,我们将讨论第一类函数是什么,它的用途是什么,并且还将查看一些实际应用来更加准确地理解它的使用方式和工作方式。
JS第一类函数是什么
第一类函数是指作为第一类公民对待的函数,可以存储在变量中、作为参数传递给其他函数、从其他函数返回、拥有自己的属性。这意味着这些第一类函数支持其他JavaScript对象所允许的所有操作。因此,JS第一类函数支持以下所述的操作:
- 可以存储为变量的值
- 可以由另一个函数返回
- 可以作为函数的参数传递
- 可以存储在数组、堆栈或队列中
- 可以拥有自己的属性和方法
我们将看到这些操作的实现,并尝试更好地理解第一类函数的用法。
存储在变量中
以下示例代码是将第一类函数存储在变量中的实现:
function add(x, y) {
return x + y;
}
let sum = add;
上面的代码中:
- 我们创建了一个函数,并传入了两个参数。
- 然后,我们将这个函数赋值给一个变量,在此之前我们并没有将其定义为函数(即没有使用括号),这是我们之前所做的。
- 因此,问题就出在这里,它是如何工作的呢。答案是我们只需要按照下面所描述的方式调用变量或函数本身即可:
let result = add(10, 20);
在这里,我们将 add() 函数赋值给一个变量,并传入了两个参数。这是一种方式。
let result = sum(10,20);
在这里,由于我们已经将 add() 函数赋值给了 sum 变量,所以我们可以进一步将 sum 变量赋值给 result,并使用它而不是使用 add() 函数。这是因为 sum 和 add 都指向同一个地址。
完整的代码如下所示:
<html>
<body>
<script>
function add(x, y) {
return x + y;
}
let sum = add;
let result = sum(10, 20);
console.log(result);
</script>
</body>
</html>
运行代码后,我们得到了以下输出:
将第一类函数作为参数传递给另一个函数
正如我们讨论过的,这些第一类函数可以存储在变量中,这意味着这些函数也可以像值一样使用。因此,我们也可以将它们作为参数传递给其他函数。
让我们看下面的示例来理解工作原理以及如何将其作为其他函数的参数传递:
<html>
<body>
<script>
function sum(x, y) {
return x + y;
}
let assign= sum;
function avg(x,y, z) {
return z(x, y) / 2;
}
let res = avg(10, 20, assign);
console.log(res);
</script>
</body>
</html>
执行代码后,我们得到了以下输出:
在上面的代码中,
- 我们可以看到我们创建了sum()函数并将该函数赋值给一个新的变量’assign’。
- 然后,我们创建了avg()函数,在该函数中我们传递了三个变量x,y,z,其中z用于将sum()函数作为参数传递给avg()函数。通过这种方式,我们可以将一等函数作为参数传递给另一个函数。
从函数中返回函数
一等函数只是值,因此我们也可以从函数中返回它。让我们看以下示例代码:
<html>
<body>
<script>
function test() {
return function() {
console.log("JavaTpoint");
}
}
const callFunc = test(); //for invoking the anonymous function
callFunc();
</script>
</body>
</html>
输出:
在上面的代码中,
- 我们创建了一个名为test()的函数,在其中我们进一步返回了一个在它下面定义的函数。
- 因此,我们可以从另一个函数中返回一个一级函数。
- 函数test()被称为高阶函数。高阶函数是一个将一级函数作为值返回的函数。
- 此外,被返回的函数是匿名函数。因此,我们需要调用这个匿名函数,为了做到这一点,我们有以下两种描述的用法:
方法1:使用变量
在上面的代码中,我们使用了这种方法来调用匿名函数,除此之外,我们还有下面的示例代码,它将帮助我们理解它:
<html>
<body>
<script>
const test = function() {
return function() {
console.log("JavaTpoint");
}
}
const callFunc = test(); //to invoke the anonymous function
callFunc();
</script>
</body>
</html>
输出:
在这里,我们只是创建了一个常量变量 callFunc 并将匿名函数赋值给它。然后我们用括号调用了常量函数。
注意:在调用这样的函数时,我们需要使用另一个变量来接收它。否则,它将不会返回它要返回的函数。如果我们在不将其存储在另一个变量中的情况下返回它,它将直接返回。
方法2:使用双括号
下面的代码示例将帮助您理解:
<html>
<body>
<script>
function test() {
return function() {
console.log("JavaTpoint");
}
}
test ()();
</script>
</body>
</html>
输出:
在上述代码中,为了调用函数,我们使用了双圆括号,类似于将函数存储到另一个变量中然后使用单圆括号调用变量,就像我们在第一种方法中所做的那样。
因此,这就是关于一等函数的全部内容,我们已经更好地描述了它的用法和实现。