javascript - 下划线中的返回值每次循环都不会停止函数

Question

我注意到一个奇怪的行为，至少是一个我不理解的行为，同时在每个循环的下划线内返回值。我的代码如下，它基本上是根据元素的 id 来测试元素是否已经存在于数组中，如下所示:

var elements = [{id: "1", name : "foo"},{id : "3", name: "bar"}];

element_exists = function(key, val){
    _.each(elements,function(element){
        console.log(element[key], val);
        if(element[key] == val){
            console.log("element exists");
                return true;
        }
   });
   return false;
};

console.log("true : ", element_exists("id", "1"));
console.log("false : ", element_exists("id", "2"));

我在控制台中得到以下日志:

1 1
element exists
3 1
true : false
1 2
3 2
false : false

我的问题是为什么函数不为第一个元素返回 true？

Answer 1

@ltbesh 你弄错了! 函数确实返回值并停止。 它只会继续对输入中的剩余元素执行迭代器函数。

您将循环语句与 _.each 方法混淆了。

_.each 方法的第二个参数是迭代器函数。它基本上是为数组的每个元素执行的函数。因此，如果您在迭代器函数中编写 return 语句，它只会终止该特定函数调用。继续为数组中的剩余元素调用该函数。

更新

---

UnderscoreJS 解决方案

您需要改用_.find 或_.some 下划线方法。 (好吧，现在是 2020 年了，是时候放弃使用下划线和 lodash 来获得 ES6 提供的开箱即用的功能了)。但是，由于问题是关于 underscoreJS，我将首先提供一个使用 underscore 的解决方案。

var elements = [{id: "1", name : "foo"},{id : "3", name: "bar"}];

element_exists = function(key, val){
    return _.find(elements,function(element){
        return element[key] === val;
   });
};

console.log("true : ", element_exists("id", "1"));
console.log("false : ", element_exists("id", "2"));

<script src="https://underscorejs.org/underscore-min.js"></script>

基于 ES6 的解决方案

现在，为了展示在没有任何外部库的情况下在 ES6 中实现相同功能是多么简洁，这里是 ES6 版本:

var elements = [{id: "1", name : "foo"},{id : "3", name: "bar"}];

element_exists = (key, val) => (
    elements.find(element => element[key] === val)
)

console.log("true : ", element_exists("id", "1"));
console.log("false : ", element_exists("id", "2"));

PS:如果您只想检查元素是否存在而不希望它由您的 element_exists 方法返回，请从使用 find 切换到 一些。