JavaScript，函数概念对比：命名/箭头/匿名/闭包

我们相信：世界是美好的，你是我也是。平行空间的世界里面，不同版本的生活也在继续...

JavaScript中有关函数的概念很多，有普通函数、箭头函数、匿名函数等等区分，还有个和匿名函数非常类似的闭包的概念。当然，这些概念相关的代码，都比较容易理解。但是，就是概念上可能会有混淆。

苏南大叔的“程序如此灵动”博客，记录苏南大叔的代码编程经验总结。本文测试环境：nodejs@20.18.0，chrome@132.0.6834.84。

普通函数

普通函数，就是最常见的形式。参考代码：

function f1(s,n){}

命名函数，这种代码方式，在较早的网络教程里面，被认为是匿名函数。但是，目前的相关测试代码又表明：这不是匿名函数。因为它确实有名字，可以访问到.name属性。参考代码：

let f2 = function(s,n){}

最后一种函数定义new Function()的方式，比较罕见。

var f3 = new Function("s", "n", "console.log(s,n)");
f3("苏", "南");  //苏 南

参考文章：

• https://newsn.net/say/js-new-function.html

箭头函数

箭头函数，如果没有被赋值给某个变量的话，它妥妥的没有名字，所以也是个匿名函数。箭头函数的最大特点是：它内部逻辑的this取自最近的上下文，并且是定义的时候，通过绑定其父级别的函数进行绑定的。参考代码：

var fn = function () {
  return (s, n) => {
    console.log(s, n); // 苏 南
    console.log(this); // { author: "sunan" }
  };
};
fn.call({ author: "sunan" })("苏", "南");

输出：

苏 南
{ author: 'sunan' }

参考文章：

• https://newsn.net/say/js-arrow-func.html

匿名函数

匿名函数，顾名思义，就必须是没有名字，无法访问.name。当匿名函数被赋值给某个变量后，就具有了名字。也失去了匿名函数的具名资格。比如：

function(){}

()=>{}

从上面的例子，可以看到：普通函数或者箭头函数，都可能是匿名函数。所以，匿名和不匿名是另外一种概念划分方式，不能把匿名函数和【this/arguments访问】划上某种等号。

参考文章：

• https://newsn.net/say/js-anonymous-func.html

闭包

闭包，实际上是利用匿名函数对作用域内变量的访问。但是匿名函数可能是普通的匿名函数，还可能是特殊的箭头函数。所以，this和arguments的特殊变量访问，也需要对箭头函数特殊对待。

(function(){
  var var1 = "";
  return function (){
    console.log( var1 );
  }
})();

参考文章：

• https://newsn.net/say/js-closure.html

结语

更多苏南大叔的JavaScript经验文章，请点击：

• https://newsn.net/tag/js/

如果本文对您有帮助，或者节约了您的时间，欢迎打赏瓶饮料，建立下友谊关系。
本博客不欢迎：各种镜像采集行为。请尊重原创文章内容，转载请保留作者链接。