使用jQuery定期使用模块结构导致我的大部分应用程序/代码遵循以下结构：

(function() {
    var chat = {
        websocket: new WebSocket("ws://echo.websocket.org/"),
        that: this,
        init: function() {
            this.scrollToBottom();
            this.bindEvents();
            this.webSocketHandlers();
        },
        bindEvents: function() {
            this.toggleChat();
            this.filterPeople();
            this.compose();
        },
        elements: {
            indicator: $(".indicator"),
            statusText: $(".status-text"),
            chatHeadNames: $(".people li .name"),
            filterInput: $("#filter-input"),
            msgInput: $("#msg-input"),
            sendBtn: $(".send")
        },
        ...
        ...
        ...
        filterPeople: function() {
          var that = this;
          this.elements.chatHeadNames.each(function() {
              $(this).attr('data-search-term', $(this).text().toLowerCase());
          });
        },
        ...
        ...
        };

        chat.init();
})();

我想知道的是，是否通过jQuery引用所有的元素作为单个变量chat.elements的一部分是一个很好的做法？

我的一部分告诉我们，它确实是一次很好地引用所有选择器并将其缓存在变量中，以便可以使用缓存的变量(而不是多个DOM选择)对同一元素进行多次使用。

我的另一部分说，这可能是一个反模式，特定的元素应该在需要的时候选择和缓存。

我已经使用了类似的结构，并对代码有不同的反应，但没有什么可靠的。任何帮助将不胜感激。谢谢！