javascript 之谜 - 函数如何访问外部变量

Question

这个问题已经有答案了:

How do JavaScript closures work? (86 个回答)

已关闭 8 年前。

我对 javascript 有点陌生，并试图理解一些不平凡的东西 - 至少我希望如此:) 事情。

我的问题很笼统，但我有一个具体的例子可以帮助我提出我的问题并帮助您理解我的意思。

示例:

function updateBookmark(bookmark){
    var index = _.findIndex($scope.bookmarks, function(b){
        return b.id == bookmark.id;
    });
    return index;
}

显然 findIndex 函数在某处声明(在我们的例子中 - lodash.js)它获取两个参数(至少两个可见参数:一个数据集和一个函数)

第一个问题:

在此示例中，b 是什么？ b 如何获得它的值？我理解 b 是数据集的每个对象，但我的意思是 - 这里幕后发生了什么，所以 b 会是什么？？

第二个问题:

作者选择传递一个匿名函数，该函数等于 b.id 和 bookmark.id，

我知道他可以在使用 bookmark.id 的地方使用它，但是 findIndex 如何访问此书签？!

正如我之前所总结的，这个函数是在其他地方声明的，它是否以某种方式获取作用域中的所有变量？这是怎么回事？

提前感谢回复者，并对这个困惑的问题表示歉意......吉姆。

Answer 1

如果你重写一些东西，它会变得更容易理解。

从最后一部分开始:

// Q: "How does `findIndex`have access to `bookmark`"
_.findIndex(bookmarks, function (b) { });
// A: "It doesn't."
var bookmark = { id: 1 };
var bookmarks = [ /* ... */ ];
function compareWithBookmark( test ) {
  return test.id === bookmark.id;
}
_.findIndex(bookmarks, compareWithBookmark);

如您所见，findIndex 实际上没有任何对书签的访问权限。
相反，它可以访问一个函数，该函数可以传递一个值进行测试，并且该函数将返回该测试是否通过或失败。

在 .findIndex 或 [].map 或 [].filter 的掩护下，它们都只是接受一个函数，创建一个循环，一次将每个元素传递到函数中，然后对返回值执行某些操作。

function findIndex (array, test) {
  var index = -1;
  var i = 0;
  var l = array.length;
  var el;
  var result;

  for (; i < l; i += 1) {
    el = array[i];       // <-- how `b` got its value
    result = test(el, i, array); // <-- test(b)
    if (!!result) {
      index = i;
      break;
    }
  }

  return index;
}

不同的函数会对结果执行不同的操作(map 返回一个包含每个 结果 的新数组，filter 返回一个数组，其中仅 !!result 测试通过，等等)，但所有这些都执行此内循环。

这也是循环结构和注意事项的相当大的简化，但这正是驱动您预期行为的原因。

编辑

这是我刚刚定义的函数、数组以及我正在检查的对象的完整用法。

var bookmarks = [
  { id:  2 },
  { id:  3 },
  { id:  6 },
  { id: 14 }
];

var bookmark = { id: 3 };
function compareBookmarkIdTest (el) {
  return el.id === bookmark.id;
}

var index = findIndex(bookmarks, compareBookmarkIdTest);
index; // 1

希望有帮助。