我的函数不知何故没有访问其父闭包&是缺少变量。怎么样？ [英] My function somehow doesn’t have access to its parent closure & is missing variables. How?

问题描述

在我的顶层函数中，我使用require.js导入一些依赖项。他们在那里，没有问题。在这个函数中，我定义了一个回调函数，并尝试使用通过require.js导入的一些变量，即父闭包中的变量。

我知道 fn.apply

code>和朋友只设置上下文到这去，而不是他们可以销毁一个闭包的引用或改变范围链。

  define（[
'backbone'，
'backbone.vent'，
'app / utils / foo'，
'app / services / intent'
]，function（Backbone，Vent，Foo）{
'use strict'; 
 
 // Backbone，Vent和Foo在这里定义
 
 Vent.on（'myevent'，function（options）{
 // Backbone定义在这里， Foo。
}）; 
}）; 
  

这怎么可能？

$ p

解决方案

我怀疑设置断点的函数包含对 Backbone ，但不是 Vent 或 Foo 。

关闭在JS运行时有点贵。它需要引擎以这样一种方式包装对象，使得它保持对这些变量的内部引用，使得它们可以在执行该函数时被正确地解析。所以为了性能原因，Chrome（和我怀疑大多数其他引擎）倾向于优化掉任何关闭变量，当脚本编译时没有实际使用。

考虑下面的例子（注意 x ， y 和 z 定义在外部函数的范围内，而不是全局范围） p>

  window.onload = function（）{var x = 1，y = z = 3; （function（）{debugger; x ++;}）（）;}  

^{备用JSFiddle演示}

如果您尝试在控制台上输出 x 和 y c> debugger 指令，这将是您将看到的：

如果你看看 Scope Variable 面板， / p>

为什么？，因为Chrome已经确定 y 和 z 不在函数内使用，因此不需要编译代码保留对变量的引用。如果在脚本中添加对 y 的引用，编译器将保留对它的引用，并且名称将不再是 undefined 在调试器中。

In my top-level function, I’m importing some dependencies using require.js. And they’re there, no problem. Within this function, I define a callback function and attempt to use some of the variables imported via require.js, that is, variables within the parent closure.

And they just aren’t there, as confirmed by a breakpoint and a peek at the Chrome inspector’s Scope Variables panel.

I understand that fn.apply and friends only set the context as far as this goes, not that they can destroy a reference to a closure or alter the scope chain.

define([
    'backbone',
    'backbone.vent',
    'app/utils/foo',
    'app/services/intent'
], function(Backbone, Vent, Foo) {
    'use strict';

    // Backbone, Vent, and Foo are defined here

    Vent.on('myevent', function(options) {
        // Backbone is defined here, but not Vent or Foo.
    });
});

How is this even possible?

And how can I fix it?

解决方案

I suspect that the function where you set the breakpoint contains a reference to Backbone, but not Vent or Foo.

Closures are somewhat expensive on the JS runtime. It requires the engine wrap up the object in such a way that it keeps internal references to those variables so they can be resolved correctly at the time the function is executed. So for performance reasons, Chrome (and I suspect most other engines as well) has a tendency to optimize away any closure variables that aren't actually used when the script is compiled. This can lead to some confusing things when debugging, but it's to be expected.

Consider the following example (Note x, y, and z are defined in the scope of the outer function, not in global scope):

window.onload = function() {
  var x = 1, y = 2, z = 3;
  (function() {
    debugger;
    x++;
  })();
}

^{Alternate JSFiddle demonstration}

If you try to output x and y on the console when this script hits the debugger directive, this is what you'll see:

And if you look at the Scope Variable panel you'll see:

Why? because Chrome has determined that y and z are not used within the function so there's no need for the compiled code to keep a reference to the variable. If you add a reference to y within the script, then the compiler will keep a reference to it, and the name will no longer be undefined in the debugger.

这篇关于我的函数不知何故没有访问其父闭包&是缺少变量。怎么样？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！