Question

我有一个向导，询问几个预定义的问题，以找出用户的需求。最后，它必须根据用户的答案提供一些项目。所有可用项目都有一些共同的属性和一个或两个特定属性。在JavaScript中执行此操作的最佳方法或算法是什么？

e.g：

第1项属性：

名称
重量
颜色
尺寸

第2项属性：

名称
尺寸
重量

第3项属性：

名称
颜色
尺寸

我们首先提出这些问题：

你想要显示名字吗？ -Yes -No
尺寸重要吗？ - 是 -
是否需要着色？ -Yes -No

最后，系统应将第1项和第2项显示为可用选项。

Answer 1

这是一个工作示例页面。我注意到你应该添加一些代码的TODO。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">

        <title>Hello!</title>

        <script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
        <script>
            'use strict';

            $(document).ready(function() {
                var items = {
                    ferrari: {
                        color: 'red',
                    },
                    bmw: {
                        color: 'black',
                        size: 4
                    }
                };

                $('#select-item').click(function(event) {
                    // Compute the scores for each item.
                    var answers = $(this).parents('form').serializeArray(),
                        itemScores = {}
                    ;

                    for (var key in items) {
                        itemScores[key] = 0;

                        for (var property in items[key]) {
                            for (var j = 0; j < answers.length; j++) {
                                var questionNumber = answers[j].name.substr('answers['.length, 1),
                                    question = $('#question' + questionNumber),
                                    weights = question.data('weights') || {}
                                ;

                                // TODO: do a special calculation for each property
                                // switch (property) { case 'color': ... break; case 'size': ... break; }
                                itemScores[key] += weights[property] || 0;
                            }
                        }
                    }

                    // Display the list of results
                    // TODO: display only the items with the best scores.
                    var list = $(document.createElement('ul'));

                    for (var key in itemScores) {
                        var item = $(document.createElement('li'));

                        item.text(key + ': ' + itemScores[key]);
                        list.append(item);
                    }

                    $('#results').html(list);

                    // Prevent the default behaviour of the form.
                    event.preventDefault();
                });
            });
        </script>
    </head>

    <body>
        <form>
            <ul>
                <li>
                    <label for="answers[0]">Do you want name to be shown?</label>
                    <input id="question0" name="answers[0]" type="checkbox" value=1 />
                </li>
                <li>
                    <label for="answers[1]">Does size matter?</label>
                    <input id="question1" name="answers[1]" type="checkbox" value=1 data-weights='{"size":2}' />
                </li>
                <li>
                    <label for="answers[2]">Does it have to be colored?</label>
                    <input id="question2" name="answers[2]" type="checkbox" value=1 data-weights='{"color":1}' />
                </li>
                <input id="select-item" type="submit" />
            </ul>
        </form>

        <div id="results">
        </div>
    </body>
</html>

如果你想在服务器端（使用NodeJS）做那种算法，我在全栈框架Danf的文档中做了一个教程，做了类似的事情。这是tutorial的直接链接（我警告你，初学者可能会有点困难）。

过滤JS中具有共同属性的项目

1 个答案: