Javascript过滤功能：如何过滤绿色水果？

Question

var fruits = [
    {name: 'nectarine',   color: 'orange'},
    {name: 'grape',       color: 'purple'},
    {name: 'banana',      color: 'yellow'},
    {name: 'grapefruit',  color: 'orange'},
    {name: 'watermelon',  color: 'green'},
    {name: 'strawberry',  color: 'red'},
    {name: 'apple',       color: 'red'},
    {name: 'pear',        color: 'green'},
    {name: 'pineapple',   color: 'yellow'},
    {name: 'kiwi',        color: 'green'},
    ];

    var green = [];
    for(var i=0; i<fruits.length; i++){
        if(fruits[i].color ==='green')
        green.push(fruits[i]);
    } 

如何使用for循环过滤绿色水果？

非常感谢您的帮助！

Answer 1

var fruits = [
    {name: 'nectarine',   color: 'orange'},
    {name: 'grape',       color: 'purple'},
    {name: 'banana',      color: 'yellow'},
    {name: 'grapefruit',  color: 'orange'},
    {name: 'watermelon',  color: 'green'},
    {name: 'strawberry',  color: 'red'},
    {name: 'apple',       color: 'red'},
    {name: 'pear',        color: 'green'},
    {name: 'pineapple',   color: 'yellow'},
    {name: 'kiwi',        color: 'green'},
    ];
    
    // only the name   
    var green_Names = [];
    fruits.map(function(fruit){ 
        if(fruit.color === 'green') green_Names.push( fruit.name );
    });
    var notGreen_Names = [];
    fruits.map(function(fruit){ 
         if(fruit.color !== 'green')  notGreen_Names.push( fruit.name )
    });

    // the full Objects
    var green = fruits.filter(function(fruit){ 
        return fruit.color === 'green'
    });
    var notGreen = fruits.filter(function(fruit){ 
        return fruit.color !== 'green'
    });
  
  
  var el = document.getElementById('el'); 
  el.innerHTML = 'Only the names : <br><br>';
  el.innerHTML += 'green_Names : <pre>' + JSON.stringify(green_Names ,null, ' ') + '</pre>';
  
  
  el.innerHTML += 'notGreen_Names : <pre>' + JSON.stringify(notGreen_Names ,null, ' ') + '</pre>';
  
  el.innerHTML += 'The full objects : <br><br>';
  
  el.innerHTML += 'Green : <pre>' + JSON.stringify(green ,null, ' ') + '</pre>';
  el.innerHTML+= 'NotGreen : <pre>' + JSON.stringify(notGreen ,null, ' ') + '</pre>';

<div id='el'></div>

    // only the names
    var green_Names = [];
    fruits.map(function(fruit){ 
        if(fruit.color === 'green') green_Names.push( fruit.name );
    });
    var notGreen_Names = [];
    fruits.map(function(fruit){ 
         if(fruit.color !== 'green')  notGreen_Names.push( fruit.name )
    });

    // the full Objects
    var green = fruits.filter(function(fruit){ 
        return fruit.color === 'green'
    });
    var notGreen = fruits.filter(function(fruit){ 
        return fruit.color !== 'green'
    });

这可以做到这一点！

Answer 2

您可以在fruit数组中使用JavaScript filter，如下所示：

var fruits = [{
  name: 'nectarine',
  color: 'orange'
}, {
  name: 'grape',
  color: 'purple'
}, {
  name: 'banana',
  color: 'yellow'
}, {
  name: 'grapefruit',
  color: 'orange'
}, {
  name: 'watermelon',
  color: 'green'
}, {
  name: 'strawberry',
  color: 'red'
}, {
  name: 'apple',
  color: 'red'
}, {
  name: 'pear',
  color: 'green'
}, {
  name: 'pineapple',
  color: 'yellow'
}, {
  name: 'kiwi',
  color: 'green'
}, ];

var green = [];


var green = fruits.filter(function(fruit) {
  return fruit.color === "green";
});

console.log(green);

Answer 3

过滤器的示例：

const notGreen1 = fruits.filter(fruit => fruit.color !== 'green');

console.log(notGreen1);

for loop 的示例：

function removeColor(originalArray, color) {
   const newArray = [];

   for(let i = 0; i < originalArray.length; i++) {
      if(originalArray[i].color !== color) {
         newArray.push(originalArray[i]);
      }
   }
   return newArray;
}

const notGreen2 = removeColor(fruits, 'green');
console.log(notGreen2);