從方法返回的字符串將產生不確定的

Question

我有一個ES2015模塊：

export default class ArrayCollection { 

    constructor(items = []) { 
     this.items = items; 
    } 

    search(query) { 
     this.items.forEach(function (item, index) { 
      if (query == item) { 
       return `Your query ${query} was found in the array on the ${index} index`; 
      }; 
     }); 

     return `Your array does not contain a ${query}`; 
    } 
} 

在我main.js我有這樣的：

import ArrayCollection from './ArrayCollection'; 

let Numbers = new ArrayCollection([2, 4, 6, 8, 10]); 

let searchResult = Numbers.search(4); 

console.log(searchResult); 

爲什麼會出現的console.log回報undefined？

我想搜索一個項目的數組，如果它是有返回它。我知道在ES6中有特殊的方法，但我只想知道上面的代碼有什麼問題。

感謝。

===編輯===

如果通過webpack或rollup它產生通過任何瀏覽器上運行下面的代碼香草上面運行ES6代碼：

var ArrayCollection = function ArrayCollection(items) { 
    if (items === void 0) items = []; 

    this.items = items; 
}; 

ArrayCollection.prototype.search = function search (query) { 
    this.items.forEach(function (item, index) { 
     if (query == item) { 
      return ("Your query " + query + " was found in the array on the " + index + " index"); 
     } 
    }); 

    // return `Your array does not contain a ${query}`; 
}; 


var Numbers = new ArrayCollection([2, 4, 6, 8, 10]); 

var searchResult = Numbers.search(4); 

alert(searchResult); 

這裏是JsFiddle這會產生相同的錯誤。如果我可以對ES6版本進行修正而不是編譯版本，那將會很不錯。

Answer 1

這裏有兩個問題與您的代碼：

1. 的forEach回調中返回只會退出回調，而不是搜索功能。即使你在回調中返回，結果將始終爲Your array does not contain a 4。
2. 請注意==操作員。除非你非常熟悉強制，否則我會建議使用三等分運算符（===）。請參閱：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators

你可以寫你的代碼更簡單和使用.indexOf避免你的問題：

export default class ArrayCollection { 

    constructor(items = []) { 
     this.items = items; 
    } 

    search(query) { 
     if (this.items.indexOf(query) > 0) { 
      return `Your query ${query} was found in the array on the ${index} index`; 
     }; 

     return `Your array does not contain a ${query}`; 
    } 
}