JavaScript 中的闭包与内联函数答案

【问题标题】：Closure in JavaScript with inline functionJavaScript 中的闭包与内联函数
【发布时间】：2020-01-27 11:45:05
【问题描述】：

可以说，我已经定义了一个类似的函数

var f = function(cb){cb()};

现在，如果我传递一个回调函数，它将起作用：

f(()=>{console.log("ccb")}); //print: ccb

但是如果我传递一个参数，在这种情况下 x 将是未定义的：

f((x)=>{console.log("x:"+x);}); // x will be undefined

所以一种解决方案是使用闭包，

function cba(x){
      return function(){
        console.log("ccbbaa:"+x)
      }
}

f(cba(20)); //will work give output: ccbbaa:20

但如果我尝试使用 inplace 函数实现闭包，请考虑定义 xx。

var xx = 20;
f(function(xx){
    return function(){
        console.log("xxx: "+xx)
    }
});

甚至不调用 f 内部的回调。为什么？我们将如何使用这个内联函数来使其工作？我正在研究闭包，所以想了解这一点。任何帮助表示赞赏。

【问题讨论】：

您执行带有签名function(xx) 的outer 函数，它返回带有签名function() 的新函数，但您从不执行后者。由于它也从未返回，因此您也不能在之后调用它。它刚刚生成并在某些时候被垃圾收集。
"f 内部的回调甚至没有被调用。为什么？" — 因为你没有做过什么会调用它。 f() 不会对通过调用传递给它的函数获得的返回值做任何事情。
@Quentin 我们如何更改它以使其正常工作？
@NikhilKumar — 你为一个没有真正明确定义的问题制定了一个非常抽象和破碎的解决方案。很难说如何解决实际问题，因为我们不知道它是什么。您似乎只是想让f 做某事f 根本不是设计用来做的，而是通过更改您传递给f 的内容来接近它……但无论您传递给f 的内容是什么不会改变f 的工作方式。

标签： javascript scope closures

【解决方案1】：

在您的代码中，您没有使用xx 调用您的内联函数。您只是将内联函数传递给f，它将被执行，但不会打印任何内容，因为被调用的内联函数只是返回另一个函数，然后永远不会被调用。

var f = function(cb){cb()};
var xx = 20;
f((function(xx){
    return function(){
        console.log("xxx: "+xx)
    }
})(xx));

【讨论】：

感谢您的快速响应和对幼稚问题的抱歉，但是按照这个逻辑，为什么 f(cba(20));工作
@NikhilKumar 因为你执行 cba 然后返回一个（单级）函数。如果您有(function(xx){ return function(){ console.log("xxx: "+xx) } })(xx)，则会发生完全相同的事情 - 您有一个执行并返回（单级）函数的函数。唯一的区别是，在后一种情况下，您拥有an IIFE，但实际上并没有本质上的不同——无论哪种方式，您都会得到相同的结果。
@VLAZ 哦，现在明白了，谢谢。想知道在这种情况下我们如何使用箭头函数，例如` f((xx)=>{return function(){console.log("xxx: "+xx)}}(xx));`。对吗？
@NikhilKumar 是的，这在语法上会起作用。但问题是你为什么想要一个 IIFE？与使用普通功能相比，它没有任何好处。如果需要，可以使用部分应用程序来预设函数期望的参数。使用这个（以及其他技术，如柯里化），您可以采用一个普通函数，该函数接受参数并生成 thunks，它们本质上是不需要参数但您可以稍后执行的函数。

【解决方案2】：

使用bind绑定参数：

const f = function(x){x()};
const param = 12

f(function(x){
    console.log("ccbbaa:"+x)
}.bind(null, param))

【讨论】：

【解决方案3】：

让这个工作的唯一方法是给匿名函数一个默认值 xx

f(function(xx=20){
    (function(){
        console.log("xxx: "+xx)
    })(xx);
});

【讨论】：

这仍然不会执行从外部返回的内部函数。
它不起作用，因为 f 将始终返回 undefined 因为它不返回任何内容。在 f 执行 function(xx) 之后，内部函数永远不会返回。要使其工作，您需要执行内部函数。我已经编辑了代码以使其工作。

【解决方案4】：

内联函数返回另一个从未调用过的函数。

 var f = function(cb){cb()};
    var xx = 20;
    f((function(xx){
        return function(){
            console.log("xxx: "+xx)
        }
    })(xx));

【讨论】：