javascript - 访问回调函数内的局部变量

Question

var inner = function() { console.log(x); }

// test 1
(function(cb) { var x = 123; cb(); })(inner);

// test 2
(function(cb) { var x = 123; cb.apply(this); })(inner);

// test 3
(function(cb) { var x = 123; cb.bind(this)(); })(inner);

// test 4
(function(cb) { cb.bind({x: 123})(); })(inner);

所有测试结果: ReferenceError: x 未定义

有人知道如何在回调中访问“x”作为局部变量吗？

Answer 1

事实:当你执行 var inner = function() { console.log(x); } 在你的第一行， x 没有定义。为什么？因为，在您的 inner 函数内部，没有 x 的本地声明(可以使用 var x = something 来完成)。然后运行时将在下一个范围内查找，即全局范围。也没有 x 的声明，所以 x 也没有在那里定义。

唯一有一个名为 x 的变量的地方是在你后面的 4 个 IIFE 中的每一个中。但在 IIFE 内部，每个 x 都是不同的变量，在不同的范围内。因此，如果您想要 console.log() 每个 IIFE 中定义的 x，那么您采取了错误的方法。

请记住，当您定义 inner 时，您正在捕获函数闭包内的环境。这意味着，无论 x 有什么值(在函数的声明中)，都将是 x 变量的可用值，当 inner 函数将被使用。您的 x 没有定义的事实只是一个附件，并不是导致不良行为的原因。

所以，当您在任何 IIFE 中调用 inner 函数时，会发生在 inner 函数中引用的 x声明是函数定义时x作为值的捕获值，而不是x现在在作用域中的值该函数当前被调用。这就是所谓的词法作用域。

要解决这个问题，您必须将要在 inner 函数内的 console.log() 的值作为参数传递给 inner 函数，如下:

var inner = function(x) { console.log(x); }
// test 1
(function(cb) { var x = 123; cb(x); })(inner);