JavaScript - Vorteile der Objektliteral

Question

Ich habe gelesen, dass anstatt einfach nur eine Reihe von Funktionen zu schreiben, ich Objektliteral verwenden soll.

Kann jemand erklären, was die Vorteile des Objekts mit Beispielen wörtlichen sind, weil ich bisher nicht verstehen.

Danke

Answer 1

Als Russ Cam sagte, vermeiden Sie den globalen Namensraum verschmutzen, die in diesen Tagen zu kombinieren Skripte von mehreren Standorten (TinyMCE, etc.) Ist sehr wichtig.

Wie Alex Sexton sagte, ist es für eine gute Code-Organisation als auch.

Wenn Sie diese Technik verwenden, würde ich vorschlagen, das Modul Muster. Dies nutzt noch Objektliterale, sondern als Rückgabewert aus einer Scoping-Funktion:

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
    };
})();

Externe Verwendung:

MyThingy.doSomethingCool();

Die Scoping-Funktion um alle Ihre Funktionen eingewickelt, und dann rufen Sie es sofort und speichern den Rückgabewert. Vorteile:

• Die Funktionen werden erklärt normal und deshalb haben Namen . (Die mit dem {name: function() { ... }} Format, alle Ihre Funktionen sind anonym, obwohl die Eigenschaften verweisen sie Namen haben.) Namen helfen Tools Ihnen helfen, von Anruf zeigt Stapeln in einem Debugger, Sie zu sagen, welche Funktion eine Ausnahme ausgelöst. (2015 Update: Die neueste Spezifikation JavaScript, um ECMAScript 6. Auflage, definiert eine Vielzahl von Möglichkeiten, die JavaScript-Engine muss schließen Name eine Funktion Eines davon ist, wenn die Funktion eine Eigenschaft zugeordnet ist, wie in unserem. {name: function() { ... }} Beispiel. so wie Motoren ES6 implementieren, wird dieser Grund weg.)
• gibt Ihnen die Freiheit nur durch Ihr Modul (wie mein internalSomething oben) verwendeten private Funktionen. Kein anderer Code auf der Seite können diese Funktionen aufrufen; sie sind wirklich privat. Nur die, die exportieren Sie am Ende, in der return-Anweisung, außerhalb der Scoping-Funktion sichtbar sind.
• Macht es einfach, je nach Umgebung verschiedene Funktionen zurückzukehren, wenn die Umsetzung vollständig gerade ändert (wie IE-vs-W3C Sachen oder SVG vs. Leinwand, usw.).

Beispiel der Rückkehr verschiedene Funktionen:

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 */);

Answer 2

Unter Verwendung eines Objektliteral (auch bekannt als Objektliteral Muster) den globalen Namensraum nicht verschmutzen so stark wie viele Funktionen werden global deklariert, und hilft auch Code in einer logischen Art und Weise zu organisieren

Zum Beispiel dieser Objektliteral

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

im Vergleich zu

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

wird nur eine Eigenschaft auf dem globalen Objekt schafft im Vergleich zu drei. Sie können dann leicht die Funktionen nutzen wie so

obj.doSomething();

Answer 3

Rebecca Murphey hat auf Objektliteralen einen Vortrag auf die diesem jQuery jährigen Konferenz. Einer der besten Gründe, sie zu nutzen ist einfach gute Code-Organisation.

Hier ist Rebeccas schreibt auf dem Objektliteral Muster auf: http://rmurphey.com/blog/2009/10/15/using-objects-to-organize-your-code/

Answer 4

Ive immer Objektliterale verwendet, weil sie eine klare Art und Weise zu organisieren Codes sind. Welches ist, warum ich Prototyp nicht mögen, es ist zu chaotisch.

Funktionen Sie verschmutzen nicht den Namensraum, wie jemand über jede mehr als Objektliterale erwähnt.

Sie leicht eine wörtliche wie

schreiben könnte

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

, die durch die Schaffung von vielen globalen Objekte die gleiche die gleichen wie die Funktionen verschmutzen würde. in ähnlicher Weise könnten Sie tun:

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

was würde diese globalen Objekte nicht schaffen (alles ist ein Objekt in JS)

auf diese Weise erstellen Sie nicht noch eine Menge globaler Objekte.

In meinen Augen Objektliterale haben zwei Vorteile. Einer sie von vielen Plugins wie jQuery verwendet werden, so dass die Leute familier sind, und sie sind leicht zu lesen. So dass sie leicht durch die Daten in ein Plugin zu übergeben. Es ist einfach, sowohl öffentliche als auch private Methoden erstellen ....

Sie können Sie aber wie jedes Mal langsam eine Instanz des Objekts erstellen alle seine Methoden dupliziert werden. Es ist mein Verständnis, dass dies nicht der Fall mit Prototyp ist, wie Sie eine Kopie der Methoden und neuer ojekte einfach den Prototyp verweisen.

Ich könnte natürlich falsch sein ...