函数在函数内声明并稍后调用时的函数作用域

Function scope when function is declared within a function and invoked later

我正在努力将工作页面脚本分为 page/content 脚本和扩展后台脚本;并且由于通信端口没有 return 功能类似于承诺的消息,因此内容脚本代码可以等待后台脚本中的承诺完成,然后再处理下一个所需步骤,我一直通过向对象添加函数,使用通信端口调用内容脚本中的函数。这运作良好,并允许在内容脚本中构建 promise.then 链,等待后台脚本承诺 resolve/reject。然而,当做类似的事情将 indexedDB 数据库从页面移动到扩展时,情况有点不同。

我想在内容脚本中做这样的事情。

var f = new Object();            
f.db_event_1 = function()
  {
    // Prepare data.
    // Declare functions for background script to invoke in content script
    // for oncomplete and onerror/onabort events.

    f.db_event_1_.complete = function() { };
    f.db_event_1_.error = function() { };

    // Communicate with background script, passing data, database name, object store 
    // names, etc. and invoke database transaction in the background script.

    // Wait (not an asyc function wait) for background script to invoke either of the 
    // above two functions based upon whether the transaction succeeds or fails.

  };

我没有完全掌握函数变量范围,并进行了一些简单的测试以确定函数中声明的变量在稍后调用时如何被该函数中声明的函数“记住”。例如,我不明白为什么 f.func_outer.inner 在声明时“记住”x 是 3 而 y 是 5。

可以相信 f.func_outer.inner 将始终以这种方式“记住”变量吗?

如果变量很大,是否应该在 func_outer.inner 结束时将它们设置为 null 以打破所有变量引用以避免潜在的内存泄漏?

谢谢。

var f = new Object();            
f.func_outer = function( x )
  {
    console.log( 'func_outer x = ' + x + ', y = ' + y );
    f.func_outer.inner = function()
      {
        console.log( 'func_outer.inner x = ' + x + ', y = ' + y );
      };
  };
f.func_outer( 3 );   // logs func_outer x = 3, y = 5.
f.func_outer.inner();  // logs func_outer.inner x = 3, y = 5.

是的,你可以依靠它。它在 js 中称为闭包,可以在此处找到有关此主题的更多信息 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures