JavaScript执行(三):你知道现在有多少种函数吗?

JavaScript执行(三):你知道现在有多少种函数吗?


在前一篇文章中,我们大致了解了执行上下文是什么,也知道了任何语句的执行都会依赖特定的上下文。


一旦上下文被切换,整个语句的效果可能都会发生改变。那么,切换上下文的时机就显得非常重要了。


在 JavaScript,切换上下文最主要的场景是函数调用。在这一课,我们就来讲讲函数调用切换上下文的事情。我们在讲函数调用之前,首先来认识一下函数家族。


函数



在 ES2018 中,函数已经是一个很复杂的体系了,我在这里整理了一下。


第一种,普通函数:用 function 关键字定义的函数。


示例:



1
2
3
function foo(){
// code
}


第二种,箭头函数:用 => 运算符定义的函数。

示例:



1
2
3
const foo = () => {
// code
}


第三种,方法:在 class 中定义的函数。

示例:



1
2
3
4
5
class C {
foo(){
//code
}
}


第四种,生成器函数:用 function * 定义的函数。

示例:



1
2
3
function foo*(){
// code
}


第五种,类:用 class 定义的类,实际上也是函数。

示例:



1
2
3
4
5
class Foo {
constructor(){
//code
}
}


第六 / 七 / 八种,异步函数:普通函数、箭头函数和生成器函数加上 async 关键字。

示例:



1
2
3
4
5
6
7
8
9
async function foo(){
// code
}
const foo = async () => {
// code
}
async function foo*(){
// code
}


ES6 以来,大量加入的新语法极大地方便了我们编程的同时,也增加了很多我们理解的心智负担。要想认识这些函数的执行上下文切换,我们必须要对它们行为上的区别有所了解。

# js, 前端
Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×