Javascript过滤器函数:我如何使这个过滤器出绿色水果

Javascript Filter Function: How do I make this filter out the green fruits?

本文关键字:过滤器 何使这 函数 Javascript      更新时间:2023-09-26
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循环?

提前感谢您的协助!

你可以在你的水果数组中使用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);

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'
    });

示例过滤器:

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

示例for循环:

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);