javascript - 解释下这种函数定义

问题描述

问 题

一般定义函数

const foo = function(){console.log('666')}; 
foo(); //666

或者

function foo(){console.log('666')}; 
foo(); //666

那么下面这个这么解释？

const foo = function foo(){console.log('666')}; 
foo(); 

解决方案

其实题主觉得第三种写法奇怪，且看起来鸡肋，是因为没有搞懂这种写法的正确用法，第二个例子比较直观

简单来说，第一个和第三个都是函数表达式，第二个是函数声明。第三个是比较特殊一些的函数表达式，拥有特殊能力。

要来解释这个问题，我们需要搞懂'What, How, Why'.

所以第一个和第二个区别主要在于他们声明的时机不一致，函数表达式是在代码执行到那条语句的时候才会给变量赋值，而函数声明会在进入当前函数执行上下文的时候就提前赋值。

直观的例子

console.log(foo); // undefined

var foo = function(){};
 
console.log(foo); // function(){}


console.log(bar); // function(){}

function bar() {}

console.log(bar); // function(){}

对于第三种，直观的例子是这样

console.log(foo); // undefined

var foo = function bar(){
    console.log(bar); // function(){...}
    console.log(foo); // undefined
};
 
console.log(foo); // function(){}
console.log(bar); // undefined

所以看出区别了吧，就是这种写法的函数标示符和函数声明的不一样，它可以在函数内部访问到，但是函数外部是访问不到的。所以我们看到很多地方会这么写，有一个好处就是在使用递归的时候调用自身的时候，函数是有名字的，比较直观

为什么会这样？

浏览器解析的时候其实是把表达式后面的标示符付给了当前的函数对象，所以上面的例子中

foo.name; // bar

而在函数内的执行上下文中，当前函数对象是在作用域中的，所以可以在内部调用

以上

这篇关于javascript - 解释下这种函数定义的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！