Javascript：使用reduce / map等创建具有特定值的对象数组

Question

I want to create an array of objects from an array of objects, this is the data:

// Input:
const shippingMethodOptions = [{
  id: 1,
  carrier_token: 'fedex',
  carrier_name: 'Fedex',
  weight: 1,
  price: 3
}, {
  id: 2,
  carrier_token: 'fedex',
  carrier_name: 'Fedex',
  weight: 2,
  price: 6
}, {
  id: 3,
  carrier_token: 'fedex',
  carrier_name: 'Fedex',
  weight: 6,
  price: 9
}, {
  id: 4,
  carrier_token: 'usps',
  carrier_name: 'Usps',
  weight: 6,
  price: 9
}, {
  id: 5,
  carrier_token: 'delaware',
  carrier_name: 'Delaware',
  weight: 5,
  price: 10
}]

As you can see the data has carrier_token and carrier_name , what I want is to create an output array with the unique carriers like so:

// Output:
const carriers = [{
  carrier_token: 'fedex',
  carrier_name: 'Fedex'
}, {
  carrier_token: 'usps',
  carrier_name: 'USPS'
}, {
  carrier_token: 'delaware',
  carrier_name: 'Delaware'
}]

What I have tried is building it with a for loop, however I would love to know if this is possible in a more clean way (reduce?)

This is my current solution so far (but again, I would love to know if it's possible to make it cleaner with Reduce etc.)

const getCarriers = options => {
  const carriers = []

  options.forEach(({ carrier_token, carrier_name }) => {
    const foundIndex = _.findIndex(carriers, carrier => carrier.carrier_token === carrier_token)

    if (foundIndex !== -1) {
      return
    }

    carriers.push({
      carrier_token,
      carrier_name
    })
  })

  return carriers
}

const carriers = getCarriers(shippingMethodOptions)

Answer 1

Seems like a pretty straight-forward reduce job.

What you'll need is a way to keep track of existing carriers. I recommend using a Set and storing keys made from the token and name, for example in a string like "<token>:<name>" .

 const shippingMethodOptions = [{"id":1,"carrier_token":"fedex","carrier_name":"Fedex","weight":1,"price":3},{"id":2,"carrier_token":"fedex","carrier_name":"Fedex","weight":2,"price":6},{"id":3,"carrier_token":"fedex","carrier_name":"Fedex","weight":6,"price":9},{"id":4,"carrier_token":"usps","carrier_name":"Usps","weight":6,"price":9},{"id":5,"carrier_token":"delaware","carrier_name":"Delaware","weight":5,"price":10}] const carriers = shippingMethodOptions.reduce(function(arr, smo) { let key = `${smo.carrier_token}:${smo.carrier_name}` return this.has(key) ? arr : this.add(key) && arr.concat({ carrier_token: smo.carrier_token, carrier_name: smo.carrier_name }); }.bind(new Set()), []) console.info(carriers) 

I'm binding the Set to the reduce callback so it can be used via the this keyword however you could just as easily create it outside the callback scope and store it in a variable, eg

const keys = new Set()

Answer 2

I'd consider using .reduce() with a Map() , where the map entries have keys based on ${carrier_token}:${carrier_name} and values in the required object format. Then use Array.from() on the .values() of the map.

 const shippingMethodOptions = [{"id":1,"carrier_token":"fedex","carrier_name":"Fedex","weight":1,"price":3},{"id":2,"carrier_token":"fedex","carrier_name":"Fedex","weight":2,"price":6},{"id":3,"carrier_token":"fedex","carrier_name":"Fedex","weight":6,"price":9},{"id":4,"carrier_token":"usps","carrier_name":"Usps","weight":6,"price":9},{"id":5,"carrier_token":"delaware","carrier_name":"Delaware","weight":5,"price":10}] const carriers = Array.from( shippingMethodOptions.reduce((map, {carrier_token, carrier_name}) => { const key = `${carrier_token}:${carrier_name}` if (!map.has(key)) map.set(key, { carrier_token, carrier_name }) return map }, new Map()).values() ) console.log(carriers) 

Or if just the carrier_token is enough for uniqueness you can simplify it:

 const shippingMethodOptions = [{"id":1,"carrier_token":"fedex","carrier_name":"Fedex","weight":1,"price":3},{"id":2,"carrier_token":"fedex","carrier_name":"Fedex","weight":2,"price":6},{"id":3,"carrier_token":"fedex","carrier_name":"Fedex","weight":6,"price":9},{"id":4,"carrier_token":"usps","carrier_name":"Usps","weight":6,"price":9},{"id":5,"carrier_token":"delaware","carrier_name":"Delaware","weight":5,"price":10}] const carriers = Array.from( shippingMethodOptions.reduce((map, {carrier_token, carrier_name}) => { if (!map.has(carrier_token)) map.set(carrier_token, { carrier_token, carrier_name }) return map }, new Map()).values() ) console.log(carriers)