javascript - “var dialogs = {};”在jQuery/JavaScript中是什么意思？

很抱歉在这里打扰大家，但我仍在尝试了解有关我正在使用的一些javascript代码的更多信息。我刚刚问了一个关于对话框的问题[id] = $();现在，我进一步查找代码，看到其他我不熟悉的东西。

有人可以解释在这种情况下“var dialogs = {}”的目的是什么。谢谢，

 $(function () {
// Cache for dialogs
var dialogs = {};

var getValidationSummaryErrors = function ($form) {
    // We verify if we created it beforehand
    var errorSummary = $form.data('validation-summary-errors');
    if (!errorSummary) {
        errorSummary = $('<div class="validation-summary-errors"><span>Please correct the errors and try again.</span><ul></ul></div>')
            .insertBefore($form);

        // Remember that we created it
        $form.data('validation-summary-errors', errorSummary);
    }

    return errorSummary;
};

var formSubmitHandler = function (e) {
    var $form = $(this);

    // We check if jQuery.validator exists on the form
    if (!$form.valid || $form.valid()) {
        $.post($form.attr('action'), $form.serializeArray())
            .done(function (json) {
                json = json || {};

                // In case of success, we redirect to the provided URL or the same page.
                if (json.success) {
                    location = json.redirect || location.href;
                } else if (json.errors) {
                    var errorSummary = getValidationSummaryErrors($form);

                    var items = $.map(json.errors, function (error) {
                        return '<li>' + error + '</li>';
                    }).join('');

                    var ul = errorSummary
                        .find('ul')
                        .empty()
                        .append(items);
                }
            });
    }

    // Prevent the normal behavior since we opened the dialog
    e.preventDefault();
};

var loadAndShowDialog = function (id, link, url) {
    var separator = url.indexOf('?') >= 0 ? '&' : '?';

    // Save an empty jQuery in our cache for now.
    dialogs[id] = $();

    // Load the dialog with the content=1 QueryString in order to get a PartialView
    $.get(url + separator + 'content=1')
        .done(function (content) {
            dialogs[id] = $('<div class="modal-popup">' + content + '</div>')
                .hide() // Hide the dialog for now so we prevent flicker
                .appendTo(document.body)
                .filter('div') // Filter for the div tag only, script tags could surface
                .dialog({ // Create the jQuery UI dialog
                    title: link.data('dialog-title'),
                    modal: true,
                    resizable: true,
                    draggable: true,
                    width: link.data('dialog-width') || 300
                })
                .find('form') // Attach logic on forms
                    .submit(formSubmitHandler)
                .end();
        });
};

// List of link ids to have an ajax dialog
var links = ['logonLink', 'registerLink'];

$.each(links, function (i, id) {
    $('#' + id).click(function (e) {
        var link = $(this),
            url = link.attr('href');

        if (!dialogs[id]) {
            loadAndShowDialog(id, link, url);
        } else {
            dialogs[id].dialog('open');
        }

        // Prevent the normal behavior since we use a dialog
        e.preventDefault();
    });
});

});

请注意，这是完整的javascript。没有更多没有在这里显示的内容。

另外:是否需要？

最佳答案

它实例化了一个新的Object，而没有任何自己的属性或方法。基本上和说的一样

var dialogs = new Object();

{}表示法称为object literal。

在此代码中需要。变量dialogs用于跟踪现有(已创建)的对话框，因此不必每次打开对话框时都创建它们。如果仔细看，有几行引用此变量。 dialogs在顶部声明(var dialogs = {})，因此处于同一级别的每个其他函数都可以使用它(在variable scope上阅读)。

使用dialogs对象时，我已在代码中标记了位置。不要让dialogs[id]表示法欺骗您-dialogs不是数组(Javascript没有关联数组)，而是这里的对象，因此等效于dialogs.id。

$(function () { //this is used not to pollute the global scope

var dialogs = {}; //HERE - dialogs is declared in this local scope

...

var loadAndShowDialog = function (id, link, url) {
    var separator = url.indexOf('?') >= 0 ? '&' : '?';

    dialogs[id] = $(); //HERE - dialogs.id will be an empty jQuery object

    $.get(url + separator + 'content=1')
        .done(function (content) {
            //HERE - dialogs.id becomes a (jQuery-wrapped) div
            //with the appropriate content
            dialogs[id] = $('<div class="modal-popup">' + content + '</div>')
               ...
        });
};

...
$.each(links, function (i, id) {
    $('#' + id).click(function (e) {
        ...
        if (!dialogs[id]) { //HERE - if a dialog with this id does not exist
            loadAndShowDialog(id, link, url); //load a new one
        } else { //otherwise
            dialogs[id].dialog('open'); //HERE - open the existing dialog
        }
        ...
    });
});

});

关于javascript - “var dialogs = {};”在jQuery/JavaScript中是什么意思？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/9108683/