javascript - 将 javascript (jQuery) 对象属性返回到默认状态

Question

我正在使用 module pattern在模式中构建一个小测验，这几乎完成了。测验结束时有一个按钮，上面写着“再试一次”，它将重新开始测验，我很难想出一种 DRY 方法来重置设置属性(应用程序的变量列表)到它的默认值。

这是我现在拥有的:

jQuery(function($) {
    var s,
        QuizApp = {
            settings: {
                timer: null,
                isPaused: false,
                count: null,
                correctAnswer: null,
                score: 0,
                questionCounter: 1
            },

            init: function() {
                s = this.settings;
                this.questionsGet();
                this.bindUIActions();
            },

            // Code omitted for event handlers and such

            resetQuiz: function() {
                s.timer = null;
                s.isPaused = false;
                s.count = null;
                s.correctAnswer = null;
                s.score = 0;
                s.questionCounter = 1;
            },
        },
}; $(function() {
    QuizApp.init();
});

});

不是很干——实际上很糟糕。我想要的是:

jQuery(function ($) {
    var s,
        QuizApp = {
            settings: {
                timer: null,
                isPaused: false,
                count: null,
                correctAnswer: null,
                score: 0,
                questionCounter: 1,
                defaults: { /* pseudo code to store settings here */ }
            },
            resetQuiz: function () {
                s = s.defaults // pseudo code to reset the settings to the value stored in defaults
            },
        };
    $(function () {
        QuizApp.init();
    });
});

或者更好的东西，如果你能想到的话。我已经搜索了大量“重置对象属性”和“克隆对象属性”，但我没有找到任何可以解释如何执行此操作的内容。显然，jQuery 可以使用。

此外，我不明白如何/在哪里存储数据以及如何将数据映射回去，因为我不完全理解这是什么类型的数据(“设置”是一个对象属性，它的值子属性？或者它是一个多维数组？我应该将数据存储在什么位置以便稍后检索其默认值？等等)，所以任何类型的深入解释或指向我们正在处理的数据类型信息的链接这里有一个额外的好处!

Answer 1

在您的 QuizApp 之外创建一个名为 defaults 的变量，并为其分配您的默认值。

然后当你声明 QuizApp settings: $.extend({},defaults)

然后在您的 restartQuiz() 函数中声明 s = $.extend({},defaults);

我还建议用

包装您的代码

; (function($){

    "strict mode";

})();

这将防止与覆盖外部变量的冲突

; (function(){
"strict mode";

jQuery(function($) {
var s,
    defaults = {
        timer: null,
        isPaused: false,
        count: null,
        correctAnswer: null,
        score: 0,
        questionCounter: 1
    },
    QuizApp = {
        settings: $.extend({},defaults),

        init: function() {
            s = $.extend({},defaults);
            this.questionsGet();
            this.bindUIActions();
        },

        resetQuiz: function() {
           s = $.extend({},defaults); // pseudo code to reset the settings to the value stored in defaults
        },

    };
$(function() {
    QuizApp.init();
});

})(jQuery);