使用javascript，只要该项目不存在于数组中就推送到数组

Question

我已经准备了很多关于此的文章，但是似乎没有一个人可以帮助我解决我的问题，或者我不理解他们的回答，无法将其转换为我的脚本。 我想从输入中将项目添加到数组中，只要该项目尚不存在于数组中即可。 请任何帮助，不胜感激。

我想我需要使用for循环，然后将新项目与数组中的现有项目进行比较，以检查该项目是否已经存在。

    var Fruit = ['apple', 'bannanna', 'rasberry', 'watermelon', 'grape', 'orange'];

    $('#addFruit').on('click', function(e) {
      e.preventDefault();
      var val = $('#fruitAdd').val();
      Fruit.unshift(val);
      console.log(Fruit);
    });

HTML
   <form>
    <div class="form-group">
      <input type="text" id="fruitAdd" class="form-control" placeholder="Search">
    </div>
    <button type="submit" id="addFruit" class="btn btn-default search">Submit</button>
   </form>

Answer 1

您可以通过检查索引来检查数组中是否存在项：

var fruit = ['apple', 'banana'];
if (fruit.indexOf('cherry') === -1) {
    console.log('No cherries here');
}

因此，您可以这样编写：

var val = $('#fruitAdd').val();
if (Fruit.indexOf(val) === -1) {
    Fruit.push(val);
}

Answer 2

另一种方法是将fruit声明为对象文字并添加属性：

fruit = {'apple': true, 'banana': true};
var val = $('#fruitAdd').val();
fruit[val] = true; 

Answer 3

如果您想使用循环，我想代码看起来像它。

 var Fruit = ['apple', 'bannanna', 'rasberry', 'watermelon', 'grape', 'orange'];

$('#addFruit').on('click', function(e) {
  e.preventDefault();
  var flag = true;
  var val = $('#fruitAdd').val();
  for(var i = 0 ; i < Fruits.length ; i ++){
      if(Fruits[i] == val)
         flag = false;
  }
  if(flag)
      Fruits.push(val);
});