Почему этот простой пример простого JavaScript не работает?

// expected output: ["red", "yellow", "blue"]
var primaryColors = [
  { color: 'red' },
  { color: 'yellow' },
  { color: 'blue' }
];

primaryColors.reduce({
  function(previous, primaryColor) {
    previous.push(primaryColor.color);
    return previous;
  }
}, []); 
// VM607:2 Uncaught TypeError: #<Object> is not a function
// at Array.reduce (native)
// at <anonymous>:2:15
3
StandardNerd 9 Янв 2017 в 15:56

3 ответа

Лучший ответ

Согласно подписи reduce функция, первый параметр которой должен быть function,

primaryColors.reduce(function(previous, primaryColor) {
  previous.push(primaryColor.color);
  return previous;
}, []); 

DEMO

Кроме того, этот сценарий лучше всего подходит для карты ,

var result = primaryColors.map(function(primaryColor) {
  return primaryColor.color;
}, []);

DEMO

5
Rajaprabhu Aravindasamy 9 Янв 2017 в 13:04

Ваша логика на правильном пути, но синтаксис немного неправильный. reduce принимает функцию обратного вызова в качестве первого аргумента, тогда как у вас есть литерал объекта:

primaryColors.reduce(function(previous, primaryColor) {
    previous.push(primaryColor.color);
    return previous;
}, []);
2
Nick Salloum 9 Янв 2017 в 12:59

Как и в предыдущих ответах, обратный вызов для уменьшения ( ) получает следующий список аргументов (accumulator, currentValue, currentIndex, array)

Но все это можно упростить до:

const primaryColors = [
  { color: 'red' },
  { color: 'yellow' },
  { color: 'blue' }
]; 

const result = primaryColors.reduce((acc, el) => acc.concat([el.color]), []);

console.log(result)
0
Artur Grigio 13 Дек 2018 в 20:13