Underscore.js-命令和功能练习

Question

我正在学习Underscore.js和高阶函数。 我遇到了以下问题，我只是被卡住了。

我不是在寻找讲义，但与此同时，我没有任何地方可以寻求指导。 我希望有人至少可以指出正确的方向。

命令式与功能性究竟是什么意思？

对于完成“功能性”解决方案，我什至不知道从哪里开始。

任何有关此主题的有用信息将不胜感激。

请注意：我确实了解map（），flatten（）和reduce（）的作用。 我只是不知道如何将其应用于这种情况。

我不明白“功能”的真正含义。 我希望有任何见识。

var products = [
    {
        name: 'Sonoma',
        ingredients: ['artichoke', 'sundried tomatoes', 'mushrooms'],
        containsNuts: false,
    },
    {
        name: 'Pizza Primavera',
        ingredients: ['roma', 'sundried tomatoes', 'goats cheese', 'rosemary'],
        containsNuts: false,
    },
    {
        name: 'South Of The Border',
        ingredients: ['black beans', 'jalapenos', 'mushrooms'],
        containsNuts: false,
    },
    {
        name: 'Blue Moon',
        ingredients: ['blue cheese', 'garlic', 'walnuts'],
        containsNuts: true,
    },
    {
        name: 'Taste Of Athens',
        ingredients: ['spinach', 'kalamata olives', 'sesame seeds'],
        containsNuts: true,
    },
];

// Underscore.js

// Count the ingredient occurence

// IMPERATIVE example:
var ingredientCount = { "{ingredient name}": 0 };

for (i = 0; i < products.length; i += 1) {
    for (j = 0; j < products[i].ingredients.length; j += 1) {
        ingredientCount[products[i].ingredients[j]] =
            (ingredientCount[products[i].ingredients[j]] || 0) + 1;
    }
}

expect(ingredientCount['mushrooms')]).toBe(2);


// FUNCTIONAL: 
/* chain() together map(), flatten() and reduce() */

var ingredientCount = { "{ingredient name}": 0 };

// ? ? ?

expect(ingredientCount['mushrooms']).toBe(2);

Answer 1

您需要将其分解为几个部分。 首先，您只关心成分，但是products包含大量额外信息，因此请使用map提取成分。

现在，您可以将成分放在一组数组中，但是您只想要一个包含所有成分的大数组，因此可以使用flatten来实现。

现在您要计算成分。 您可以认为这是一系列减少，您有一个具有先前计数的对象，而对于当前项目，您想要增加计数。 这可以通过以空对象开始的reduce来完成。 我将把incrementCount功能的实现留给读者练习。

const ingredients = _.map(products, p => p.ingredients);
const flatIngredients = _.flatten(ingredients);
const counts = _.reduce(flatIngredients, incrementCount, {});

使用功能代码，可以将您的数据视为经过一系列转换，每次转换都使您更接近目标，而不是一个试图将所有变异都塞入其中的大循环。

Answer 2

功能性意味着每个被调用的函数都具有返回值，并且通常没有副作用（“纯”）。 这是一种非常适合数据转换的编程风格。

• map接受一个数组，并返回一个数组，其中每个项目都已转换。
• reduce遍历数组，始终提供先前返回的值和数组中的下一项，从而计算新值。 可用于计算总和等。
• flatten使列表列表变成一个列表。

 var products = [ { name: 'Sonoma', ingredients: ['artichoke', 'sundried tomatoes', 'mushrooms'], containsNuts: false, }, { name: 'Pizza Primavera', ingredients: ['roma', 'sundried tomatoes', 'goats cheese', 'rosemary'], containsNuts: false, }, { name: 'South Of The Border', ingredients: ['black beans', 'jalapenos', 'mushrooms'], containsNuts: false, }, { name: 'Blue Moon', ingredients: ['blue cheese', 'garlic', 'walnuts'], containsNuts: true, }, { name: 'Taste Of Athens', ingredients: ['spinach', 'kalamata olives', 'sesame seeds'], containsNuts: true, }, ]; const result = products.reduce((allIngredients, item) => allIngredients.concat(item.ingredients), []) .reduce((counts, ingredient) => { counts[ingredient] ? counts[ingredient]++ : (counts[ingredient] = 1); return counts }, {}) console.log(result);