JavaScript - преимущества литерала объекта - PullRequest
Новая
       24

JavaScript - преимущества литерала объекта

38 голосов
/ 21 октября 2009

Я читал, что вместо того, чтобы просто писать кучу функций, я должен использовать литерал объекта.

Может кто-нибудь объяснить, в чем преимущества объектного литерала, на примерах, потому что я пока не понимаю.

Спасибо

Ответы [ 4 ]

66 голосов
/ 21 октября 2009

Как сказал Расс Кэм, вы не загрязняете глобальное пространство имен, что очень важно в наши дни при объединении сценариев из разных мест (TinyMCE и т. Д.).

Как сказал Алекс Секстон, это также способствует хорошей организации кода.

Если вы используете эту технику, я бы предложил использовать шаблон модуля. При этом по-прежнему используются литералы объекта, но в качестве возвращаемого значения из функции области видимости: 

var MyThingy = (function() {

    function doSomethingCool() {
        ...
    }

    function internalSomething() {
        ....
    }

    function anotherNiftyThing() {
        // Note that within the scoping function, functions can
        // call each other direct.
        doSomethingCool();
        internalSomething();
    }

    return {
        doSomethingCool: doSomethingCool,
        anotherNiftyThing: anotherNiftyThing
    };
})();

Наружное использование: 

MyThingy.doSomethingCool();

Функция определения объема оборачивается вокруг всех ваших функций, а затем вы немедленно вызываете ее и сохраняете возвращаемое значение. Преимущества:

  • Функции объявляются нормально и поэтому имеют имена . (Принимая во внимание, что с форматом {name: function() { ... }} все ваши функции являются анонимными, даже несмотря на то, что свойства, ссылающиеся на них, имеют имена.) Имена помогают инструментам, от показа стеков вызовов в отладчике до сообщения, какая функция вызвала исключение. (Обновление 2015: последняя спецификация JavaScript, ECMAScript 6th edition, определяет большое количество способов, которыми механизм JavaScript должен выводить имя функции. Одним из таких случаев является назначение функции свойству, как в нашем {name: function() { ... }} пример. Так как двигатели реализуют ES6, эта причина исчезнет.)
  • Дает вам свободу иметь личные функции, используемые только вашим модулем (например, мой internalSomething выше). Никакой другой код на странице не может вызывать эти функции; они действительно частные. Только те, которые вы экспортируете в конце, в операторе return, видны вне функции определения объема.
  • Позволяет легко возвращать различные функции в зависимости от среды, если реализация просто полностью меняется (например, IE-vs-W3C или SVG против Canvas и т. Д.).

Пример возврата различных функций: 

var MyUtils = (function() {
    function hookViaAttach(element, eventName, handler) {
        element.attachEvent('on' + eventName, handler);
    }

    function hookViaListener(element, eventName, handler) {
        element.addEventListener(eventName, handler, false);
    }

    return {
        hook: window.attachEvent ? hookViaAttach : hookViaListener
    };
})();

MyUtils.hook(document.getElementById('foo'), 'click', /* handler goes here */);
15 голосов
/ 21 октября 2009

Использование литерала объекта (шаблон литерала объекта a.k.a.) не будет загрязнять глобальное пространство имен так же сильно, как использование многих функций, объявленных глобально, а также помогает логически организовать код

Например, этот литерал объекта 

var obj = {
              find : function(elem) { /* find code */ },
              doSomething: function() { /* doSomething code */ },
              doSomethingElse: function() { /* doSomethingElse code */ }
          }

по сравнению с 

function find(elem) { /* find code */ },
function doSomething() { /* doSomething code */ },
function doSomethingElse() { /* doSomethingElse code */ }

создаст только одно свойство глобального объекта по сравнению с тремя. Вы можете легко использовать такие функции, как 

obj.doSomething();
10 голосов
/ 21 октября 2009

Ребекка Мерфи выступила с докладом об объектных литералах на конференции jQuery этого года. Одна из лучших причин их использования - просто хорошая организация кода.

Вот запись Ребекки об объектном буквальном образце: http://rmurphey.com/blog/2009/10/15/using-objects-to-organize-your-code/

2 голосов
/ 09 ноября 2013

Я всегда использовал объектные литералы, потому что они представляют собой простой способ организации кода. Вот почему мне не нравится прототип, он слишком грязный.

Функции не ограничивают пространство имен, как кто-либо, упомянутый выше, больше, чем объектные литералы.

Вы можете легко написать литерал типа 

var obj = {}
var find = function(elem) { /* find code */ },
var doSomething = function() { /* doSomething code */ },
var doSomethingElse = function() { /* doSomethingElse code */ }

, что приведет к созданию множества глобальных объектов, таких же, как функции. Точно так же вы можете сделать: 

(function() {
function find(elem) { /* find code */ },
function doSomething() { /* doSomething code */ },
function doSomethingElse() { /* doSomethingElse code */ }
})();

, который не будет создавать эти глобальные объекты (все объекты в JS)

таким образом, вы по-прежнему не создаете множество глобальных объектов.

На мой взгляд, у литералов объекта есть два преимущества. Один из них используется многими плагинами, такими как jQuery, чтобы люди были знакомы и их было легко читать. Делая их легко передавать через данные в плагин. Легко создавать как публичные, так и приватные методы ....

Они могут быть медленными, хотя каждый раз, когда вы создаете экземпляр объекта, все его методы дублируются. Насколько я понимаю, это не относится к прототипу, так как у вас есть одна копия методов, а новые ojects просто ссылаются на прототип.

Конечно, я могу ошибаться ...

...