web前端面试一道面试题

Question

今天面试的时候一道面试题，大概是这样的，感觉自己很绕，希望大家帮我看下。谢谢。问题是下面会输出3次1吗，如果不会，能修改使其实现吗？
functionnewFun(a){
returnfunction(a){
console.log(a)
}
}
functionfun(a){
console.log(a)
newFun((a)=>{
console.log(a)
})
}
fun(1)

Answer 1

当然不会了，人肉单步一下就知道了，跳过声明，从fun(1)进入，请跟着序号走functionnewFun(a){//2-1:调用newFun，参数为刚刚的箭头函数returnfunction(a){//3:返回一个匿名函数，这个匿名函数接受并打印参数aconsole.log(a);}//4-0:函数newFun结束}functionfun(a){//0-1:调用fun，参数1console.log(a);//1:打印a，即参数1newFun(a=>{//2-0:调用newFun，参数为一个箭头函数（注意这个函数是作为参数被声明的，此时这个函数还没有被调用）console.log(a);});//4-1:函数newFun的调用已经结束，并且它返回了一个匿名函数，但这个匿名函数没有被一个变量接收//5-0:函数fun的调用已经结束，该函数没有返回任何值}fun(1);//0-0:调用fun，参数1//5-1:函数fun的调用已经结束，脚本结束可以看出从头到尾只打印了一次1，只有函数fun中的第一个console.log(a)会被执行，作为迷惑你的另外两个console.log(a)分别在两个作为参数和返回值的函数中，但没有被调用。要使得这两个console.log(a)被执行，只要调用其所属的函数即可functionnewFun(a){//3-1:调用newFun，参数为刚刚的箭头函数returnfunction(a){//4:返回一个匿名函数，这个匿名函数接受并打印参数aconsole.log(a);}//5-0:函数newFun结束}functionfun(a){//0-1:调用fun，参数1console.log(a);//1:打印a，即参数1letbrandNewFun=a=>console.log(a);brandNewFun(a);//2:调用brandNewFun，参数为a，即1newFun(brandNewFun)(a);//3-0:调用newFun，参数为一个箭头函数brandNewFun（注意这个函数是作为参数的，此时这个函数没有被调用）//5-1:函数newFun的调用已经结束，并且它返回了一个匿名函数，且我们立即调用了这个匿名函数，参数为a，即1，因此这里输出1//6-0:函数fun的调用已经结束，该函数没有返回任何值}fun(1);//0-0:调用fun，参数1//6-1:函数fun的调用已经结束，脚本结束