Was sollte jeder JavaScript-Programmierer wissen? [geschlossen]

Gibt es eine Reihe von Dingen, die jeder JavaScript-Programmierer wissen sollte, um "Ich kenne JavaScript" sagen zu können?

Nicht jQuery. Nicht YUI. Nicht (usw. usw.)

Frameworks mögen nützlich sein, aber sie verbergen oft die manchmal hässlichen Details, wie JavaScript und das DOM tatsächlich vor Ihnen funktionieren. Wenn Sie in der Lage sein möchten, "Ich kenne JavaScript" zu sagen, ist es dagegen, viel Zeit in ein Framework zu investieren.

Hier sind einige JavaScript-Sprachfunktionen, die Sie kennen sollten, um zu verstehen, was sie tun, und die nicht auffallen, die aber für viele Menschen nicht sofort offensichtlich sind:

• Das object.propund object['prop']sind das Gleiche (können Sie bitte aufhören zu verwenden eval, danke); Diese Objekteigenschaften sind immer Zeichenfolgen (auch für Arrays). wofür for... inist (und was nicht ).

• Immobilienschnüffeln; was undefinedist (und warum riecht es ); warum der scheinbar wenig bekannte inBediener nützlich ist und sich von typeof/ undefinedprüft; hasOwnProperty;; der Zweck von delete.

• Dass der NumberDatentyp wirklich ein Float ist; die sprachunabhängigen Schwierigkeiten bei der Verwendung von Floats; Vermeidung der parseIntOktalfalle.

• Scoping für verschachtelte Funktionen; die Notwendigkeit, varin dem Bereich zu verwenden, in dem Sie versehentliche Globals vermeiden möchten; wie Zielfernrohre für Verschlüsse verwendet werden können; das Problem der Verschlussschleife .

• Wie globale Variablen und windowEigenschaften kollidieren; wie globale Variablen und Dokumentelemente nicht kollidieren sollten, sondern im IE; die Notwendigkeit, auch varim globalen Bereich zu verwenden, um dies zu vermeiden.

• Wie sich die functionAnweisung verhält , um eine Definition vor dem vorhergehenden Code zu " heben "; der Unterschied zwischen Funktionsanweisungen und Funktionsausdrücken; warum benannte Funktionsausdrücke nicht verwendet werden sollten .

• Wie der Konstruktor funktioniert, funktionieren die prototypeEigenschaft und der newOperator wirklich. Methoden , um dies auszunutzen, um das normale Klassen- / Unterklassen- / Instanzsystem zu erstellen, das Sie tatsächlich wollten; wenn Sie möglicherweise schließungsbasierte Objekte anstelle von Prototypen verwenden möchten. (Das meiste JS-Tutorial-Material ist absolut schrecklich. Ich habe Jahre gebraucht, um es klar in meinen Kopf zu bekommen.)

• Wie thiswird zur Anrufzeit bestimmt, nicht gebunden; wie folglich das Übergeben von Methoden nicht so funktioniert, wie Sie es von anderen Sprachen erwarten ; wie Verschlüsse oder Function#bindverwendet werden können, um das zu umgehen.

• Andere ECMAScript Fifth Edition Features wie indexOf, forEachund die funktionale Programmierung Methoden aufArray ; wie man ältere Browser repariert, um sicherzustellen, dass man sie verwenden kann; Verwenden Sie sie mit anonymen Inline-Funktionsausdrücken, um kompakten, lesbaren Code zu erhalten.

• Der Kontrollfluss zwischen Browser und Benutzercode; synchrone und asynchrone Ausführung; Ereignisse, die innerhalb des Kontrollflusses ausgelöst werden (z. B. Fokus), im Vergleich zu Ereignissen und Zeitüberschreitungen, die auftreten, wenn die Kontrolle zurückkehrt; Wie das Aufrufen eines vermeintlich synchronen eingebauten Geräts alertzu einem potenziell katastrophalen Wiedereintritt führen kann.

• Wie sich fensterübergreifende Skripte auswirken instanceof; Wie wirkt sich fensterübergreifendes Scripting auf den Kontrollfluss zwischen verschiedenen Dokumenten aus? wie postMessagewird das hoffentlich behoben.

Siehe diese Antwort zu den letzten beiden Punkten.

Vor allem sollten Sie JavaScript kritisch betrachten, anerkennen, dass es aus historischen Gründen eine unvollständige Sprache ist (sogar mehr als die meisten anderen Sprachen), und die schlimmsten Probleme vermeiden. Crockfords Arbeit an dieser Front ist definitiv lesenswert (obwohl ich ihm nicht zu 100% zustimme, was die „guten Teile“ sind).

Dass es deaktiviert werden kann.

Das Verständnis der in Crockfords Javascript: The Good Parts geschriebenen Dinge ist eine ziemlich gute Annahme, dass eine Person ein anständiger JS-Programmierer ist.

Sie können ziemlich genau wissen, wie man eine gute Bibliothek wie JQuery verwendet, und die verborgenen Teile von Javascript immer noch nicht kennen.

Ein weiterer Hinweis ist das Debuggen von Tools in verschiedenen Browsern. Ein JS-Programmierer sollte wissen, wie er seinen Code in verschiedenen Browsern debuggt.

Oh! Und wenn Sie wissen, dass JSLint Ihre Gefühle total verletzt !!

Wenn Sie ein echter JavaScript-Ninja sein möchten, sollten Sie die Antworten auf jede Frage im Perfection Kills JavaScript Quiz kennen .

Ein Beispiel, um Appetit zu machen:

(function f(f){ 
  return typeof f(); 
})(function(){ return 1; });

Was gibt dieser Ausdruck zurück?

• "Nummer"
• "nicht definiert"
• "Funktion"
• Error

Sie kennen JavaScript nicht, wenn Sie nicht wissen:

1. Verschlüsse
2. Prototypbasierte Vererbung
3. Das Modulmuster
4. Das W3C-DOM
5. Wie Ereignisse funktionieren

..das Javascript ist nicht Java :)

Viele, viele Leute, die mit der Entwicklung von Websites beginnen, haben mir gesagt, dass Javascript nur einfaches Java ist!

1. Machen Sie sich mit mindestens einer Javascript-Bibliothek (Jquery, Prototype usw.) vertraut.

2. Erfahren Sie, wie Sie die Debugging-Tools der wichtigsten Browser (MSIE 7-8, Firefox, Chrome, Safari) verwenden.

3. Informieren Sie sich über die Branche: Die Website von Douglas Crockford ist eine Fundgrube, während Ajaxian.com ein guter Blog ist, um über neue, interessante und seltsame Ideen für Javascript auf dem Laufenden zu bleiben. Es gibt eine Reihe anderer Ressourcen, aber diese haben mir am meisten geholfen.

Javascript- Objekte und fungieren als erstklassiger Bürger , Rückrufe , nicht zu vergessen Ereignisse und dann JQuery .

Dieses Javascript kann man nicht in einer Stunde lernen!

Variablen sind global, sofern sie nicht als lokal deklariert sind !!

Schlecht (DoSomething () wird nur 10 Mal aufgerufen):

function CountToTen()
{
  for(i=0; i< 10; i++)
  {
    DoSomething(i);
  }
}

function countToFive()
{
  for(i=0; i<5; i++)
  {
    CountToTen();
  }
}

CountToFive();

Gut (DoSomething () wird wie vorgesehen 50 Mal aufgerufen):

function CountToTen()
{
  var i;
  for(i=0; i< 10; i++)
  {
    DoSomething(i);
  }
}

function countToFive()
{
  var i;
  for(i=0; i<5; i++)
  {
    CountToTen();
  }
}

CountToFive();

Wie man die guten Teile benutzt und wie man die schrecklichen Teile vermeidet .

Zu wissen, dass Javascript ursprünglich LiveScript hieß und das Präfix 'Java' zu Marketingzwecken angehängt wurde, nicht weil Java und Javascript verwandt sind (was sie nicht sind).

Oh, und für den Besitz einer Version von David Flanagans 'Javascript: The Definitive Guide' (diese Informationen finden Sie auf Seite 2).

... und um diejenigen zu würdigen, die zuvor versucht haben, das document.all [] von Internet Explorer 4 und die document.layers [] von Netscape Navigator 4 zu verschleiern, bevor Jquery den Schmerz beseitigt hat.

BEARBEITEN:

Wie @Kinopiko darauf hinweist, wurde JavaScript ursprünglich als Projekt Mocha bezeichnet ( einige Quellen gehen auch davon aus, dass es als Projekt LiveWire bezeichnet wurde), aber es wird allgemein angenommen, dass die Sprache (geschrieben von Brendan Eich) als LiveScript veröffentlicht werden sollte, bevor das Java-Präfix übernommen wurde Veröffentlichung Anfang 1996.

Man sollte sich über Folgendes bewusst sein, um "Ich kenne JavaScript" zu sagen:

1. JavaScript ist gut, aber DOM ist ein Schmerzpunkt
2. Browserübergreifende Probleme können Sie verrückt machen
3. Wenn der Code nicht in mindestens 4 verschiedenen guten Browsern getestet wurde , kann man nicht sagen, dass er fehlerfrei ist
4. Schließung .............. Muss wissen
5. Sein Prototyp basiert ........... Schön, dass es Spaß macht, dies zu lernen
6. Debugger- Schlüsselwort ..... Hilft in der Krise

Dieses JavaScript unterscheidet sich viel mehr von anderen Sprachen als Sie vielleicht denken. Sehen Sie sich diesen großartigen Google Tech Talk an, um sich einen Eindruck zu verschaffen : http://www.youtube.com/watch?v=hQVTIJBZook

Was sollte jeder Javascript-Codierer wissen?

Wie wäre es, ich kann Ihre Bemühungen mit 2 Klicks ausschalten. Stellen Sie also nach Möglichkeit einen Fallback bereit.

Ich empfehle dringend, Javascript: The Good Parts zu lesen

Sie kennen Javascript, wenn Sie Array, Number, String, Date und Object effektiv einsetzen können. Pluspunkte für Math und RegExp. Sie sollten in der Lage sein, Funktionen zu schreiben und Variablen zu verwenden (im richtigen Bereich, dh als 'Methoden' eines Objekts).

Ich sehe einige Kommentare über das Wissen um Verschlüsse, extravagante Funktionssyntax und Blabla. All das ist für diese Frage ziemlich irrelevant. Das heißt, Sie sind ein Läufer, wenn Sie den 100-Meter-Lauf in weniger als 11 Sekunden laufen können.

Ich sage, es dauert vielleicht ein paar Wochen, um Javascript zu beherrschen. Danach dauert es Jahre und Dutzende von Büchern und Tausenden von Programmzeilen, um ein Experte, ein Ninja usw. zu werden.

Aber das war nicht die Frage.

Oh, und das DOM ist kein Teil von Javascript und jQuery auch nicht. Daher denke ich, dass beide für die Frage gleichermaßen irrelevant sind.

JSLint http://www.JSLint.com/

Nachdem Sie alle oben genannten Informationen gelesen haben, ist es auch vollkommen in Ordnung , Javascript mithilfe eines Frameworks wie jQuery zu lernen. Die Wahrheit ist, dass es der erste Weg ist, wie viele Leute JS überhaupt aufgegriffen haben. Keine Schande.

Array . lengthMethode ist nicht die Anzahl der Elemente des Arrays, sondern der höchste Index. auch wenn der Artikel auf eingestellt warundefined

var a = [];
a.length;   // === 0
a[10];      // === undefined
a[10] = undefined;
a.length;   // === 11
a.pop();    // === undefined
a.length;   // === 10

Dieses Verhalten ist kaum von einem Sprachdesignfehler zu unterscheiden.

jQuery wäre meine beste Empfehlung. Nicht nur für den Code selbst ist es die Redewendung, der Stil, das Denken dahinter, das es am meisten wert ist, emuliert zu werden.

Dieses Javascript ist die am weitesten verbreitete Sprache der Welt. (Wahrscheinlich)

Das Erlernen einer Sprache und das Verstehen ihrer verschiedenen Macken beruht auf (jahrelanger) Erfahrung. Wenn Sie ein besserer Programmierer sein möchten, würde ich sagen, Designmuster verstehen, wie und wann sie verwendet werden sollen und / oder sogar wenn Sie sie verwenden, ohne es zu merken; technische Architektur & Benutzererfahrung.

Wenn Sie die (JavaScript-) Sprache kennen, können Sie jedes Framework auswählen und nach Belieben verwenden. Sie müssen unweigerlich in den Quellcode eintauchen, und wenn Sie nur die Syntax eines Frameworks oder 2 oder 3 kennen, werden Sie nicht weit kommen. Wenn Sie dies sagen, ist der Zugriff auf den Quellcode einiger verschiedener Frameworks wahrscheinlich eine der besten Möglichkeiten, um zu sehen, wie JavaScript verwendet werden kann. Durchspielen Sie den Code in Firebug oder Web Inspector und überprüfen Sie anschließend die JavaScript-Dokumentation, insbesondere die Mozilla- und Webkit-Dokumente, um ein besseres Verständnis für Ihre Inhalte zu erhalten.

Wenn Sie den Unterschied zwischen objektorientierter und funktionaler Programmierung verstehen, dass JavaScript eine sexy Mischung aus beidem ist und wann und wie Sie beide verwenden, um eine Killer-Codebasis und großartige Anwendungen zu erstellen, werden Sie zu einem besseren JavaScript-Programmierer.

Wenn Sie nur einige Bücher lesen, insbesondere Crockfords "gute Teile", in denen lediglich seine Meinung zu den guten Eigenschaften von JavaScript wiedergegeben wird, während Sie die meisten der FANTASTISCHEN Teile von JavaScript überspringen, werden Sie auf dem falschen Fuß davonkommen.

Wenn Sie sich Code ansehen, der von jemandem wie Thomas Fuchs geschrieben wurde, erhalten Sie viel mehr Einblick in die Möglichkeiten, erstaunliches und effizientes JavaScript zu schreiben.

Der Versuch, sich ein paar Fallstricke oder WTFs zu merken, hilft auch nicht viel. Sie werden das aufgreifen, wenn Sie mit dem Codieren beginnen und den Code einer Bibliothek / eines Frameworks, insbesondere eines hilfreich kommentierten, durchgehen, um zu sehen, warum sie bestimmte verwendet haben Eigenschaften / Werte und nicht andere, warum und wann es gut ist, bestimmte Operanden und Operatoren zu verwenden, ist dies alles im Code der Benutzer des Frameworks enthalten. Wie besser als mit gutem Beispiel zu lernen? : ^)

In Javascript ist Leistung wichtig.

Es gibt keinen intelligenten Compiler, der Ihren Code optimiert. Sie sollten also beim Schreiben von Javascript-Code vorsichtiger sein als Sprachen wie C #, Java ...

Objektliterale, weil sie so schön zu schreiben sind.

Die folgenden Dinge sind ebenfalls wichtig:

1) Variables Heben. 2) Bereichsketten und Aktivierungsobjekte.

und dann solche Dinge: :)

3) wtfjs.com

4) Alles ist ein Objekt http://www.lifeinafolder.com/images/Js.jpg

1. Zu wissen, dass es ein Leben mit und ohne gibt with()und wo man die Grenze ziehen kann.
2. Sie können mit der throwAnweisung benutzerdefinierte Fehler erstellen , um die Javascript-Laufzeit absichtlich zu stoppen.

JavaScript unterstützt keine Trennung Schlüsselworts return und der Anweisung return mit einem Zeilenumbruchzeichen wie dem folgenden Code nicht (oder versuchen Sie es auf meiner jsFiddle-Seite ).

function foo()
{
    return
    {
        bar: 'something'
    };
}

$(function()
{
    document.write(foo());
});

Ich verstehe nicht, warum JavaScript diesen Stil nicht unterstützt, da es viel einfacher ist, sehr komplexen JavaScript-Quellcode zu lesen, wenn man ihn mit dem Standardstil von JavaScript vergleicht.

PS. Ich habe JavaScript fast 6 Jahre geschrieben. Aber ich habe diesen Fehler gerade bei mir selbst gefunden, als ich versuchte, die folgende Funktion auszuführen. Es wird immer undefiniert zurückgegeben. Wenn ich den Debugger benutze und in diese Funktion einsteige, funktioniert alles einwandfrei. Ich denke, es sollte der schlimmste Programmierfehler in meinem Leben sein.

function JqGridInlineEditor_GenerateTool(cellvalue, options, rowObject, disableEdit, disableDelete)
{
    return 
        (!disableEdit ? '<a class="button edit" href="javascript: void(0);" onclick="JqGridInlineEditor_EditRow(this, \'{0}\');return false;" title="{2}"><img src="{1}" alt="{2}" /></a>'.format(options.rowId, getUrl('~/Content/Icons/Edit.gif'), 'Click here to Edit or \nDouble-click row to edit.') : '') +
        (!disableDelete ? '<a class="button delete" href="javascript: void(0);" onclick="JqGridInlineEditor_DeleteRow(this, \'{0}\');return false;" title="{2}"><img src="{1}" alt="{2}" /></a>'.format(options.rowId, getUrl('~/Content/Icons/Delete.png'), 'Click here to Delete or \nSelect row and then press Delete') : '') +
        (!disableEdit ? '<a class="button save" style="display:none" href="javascript: void(0);" onclick="JqGridInlineEditor_SaveRow(this, \'{0}\');return false;" title="{2}"><img src="{1}" alt="{2}" /></a>'.format(options.rowId, getUrl('~/Content/Icons/Save.png'), 'Click here to Save or \nPress Enter') : '') +
        (!disableEdit ? '<a class="button cancel" style="display:none" href="javascript: void(0);" onclick="JqGridInlineEditor_RestoreRow(this, \'{0}\');return false;" title="{2}"><img src="{1}" alt="{2}" /></a>'.format(options.rowId, getUrl('~/Content/Icons/Cancel.png'), 'Click here to Cancel or \nPress Esc') : '');
}

Da JS eine funktionale Sprache ist, muss ein anständiger JS-Programmierer in der Lage sein, Y-Combinator zu schreiben und zu erklären, wie es auf den ersten Blick funktioniert.

... über Google Web Toolkit , was bedeutet, dass Ihr Javascript-Projekt wahrscheinlich viel komfortabler entwickelt werden könnte.