Que doit savoir tout programmeur JavaScript? [fermé]

Existe-t-il un ensemble de choses que chaque programmeur JavaScript doit savoir pour pouvoir dire "Je connais JavaScript"?

Pas jQuery. Pas YUI. Non (etc., etc.)

Les cadres peuvent être utiles, mais ils cachent souvent les détails parfois laids de la façon dont JavaScript et le DOM fonctionnent réellement chez vous. Si votre objectif est de pouvoir dire «je connais JavaScript», investir beaucoup de temps dans un framework s'oppose à cela.

Voici quelques fonctionnalités du langage JavaScript que vous devez savoir pour comprendre ce qu'il fait et ne pas se faire prendre, mais qui ne sont pas immédiatement évidentes pour beaucoup de gens:

• Ce object.propet object['prop']sont la même chose (donc pouvez - vous cesser d' utiliser eval, merci); que les propriétés des objets sont toujours des chaînes (même pour les tableaux); ce que for... inest pour (et ce n'est pas ).

• Reniflement de propriété; ce qui undefinedest (et pourquoi ça sent ); pourquoi l' inopérateur apparemment peu connu est bénéfique et différent de typeof/ undefinedchecks; hasOwnProperty; le but de delete.

• Que le Numbertype de données est vraiment un flottant; les difficultés indépendantes de la langue d'utilisation des flotteurs; éviter le parseIntpiège octal.

• Portée de la fonction imbriquée; la nécessité d'utiliser vardans la portée que vous souhaitez éviter les globales accidentelles; comment les portées peuvent être utilisées pour les fermetures; le problème de la boucle de fermeture .

• Comment les variables et les windowpropriétés globales entrent en collision; comment les variables globales et les éléments de document ne doivent pas entrer en collision mais le faire dans IE; la nécessité d'utiliser également varà l'échelle mondiale pour éviter cela.

• Comment l' functionénoncé agit pour « hisser » une définition avant le code qui la précède; la différence entre les énoncés de fonction et les expressions de fonction; pourquoi les expressions de fonction nommées ne doivent pas être utilisées .

• Fonctionnement réel du constructeur, prototypepropriété et newopérateur les méthodes d'exploitation pour créer le système de classe / sous-classe / instance normal que vous vouliez réellement; lorsque vous souhaiterez peut-être utiliser des objets basés sur la fermeture au lieu du prototypage. (La plupart des didacticiels JS sont absolument terribles à ce sujet; il m'a fallu des années pour les comprendre directement.)

• Comment thisest déterminé au moment de l'appel, non lié; comment, par conséquent, le passage de méthode ne fonctionne pas comme vous l'attendez d'autres langues; comment les fermetures ou Function#bindpeuvent être utilisées pour contourner cela.

• D'autres fonctionnalités ECMAScript Fifth Edition comme indexOf, forEachet les méthodes deArray programmation fonctionnelle sur ; comment réparer les anciens navigateurs pour vous assurer que vous pouvez les utiliser; les utiliser avec des expressions de fonction anonymes en ligne pour obtenir un code compact et lisible.

• Le flux de contrôle entre le navigateur et le code utilisateur; exécution synchrone et asynchrone; les événements qui se déclenchent à l'intérieur du flux de contrôle (par exemple, la mise au point) par rapport aux événements et délais d'expiration qui se produisent lorsque le contrôle revient; comment appeler un buildin soi-disant synchrone alertpeut finir par provoquer une rentrée potentiellement désastreuse.

• Comment les scripts inter-fenêtres affectent instanceof; comment les scripts inter-fenêtres affectent le flux de contrôle à travers différents documents; comment, postMessageje l'espère, résoudre ce problème.

Voir cette réponse concernant les deux derniers éléments.

Surtout, vous devriez regarder JavaScript de manière critique, en reconnaissant qu'il s'agit pour des raisons historiques d'un langage imparfait (encore plus que la plupart des langues), et en évitant ses pires problèmes. Le travail de Crockford sur ce front vaut vraiment la peine d'être lu (bien que je ne sois pas d'accord à 100% avec lui sur les «bonnes parties»).

Qu'il peut être désactivé.

Comprendre les choses écrites dans le Javascript de Crockford : The Good Parts est une assez bonne hypothèse qu'une personne est un programmeur JS décent.

Vous pouvez à peu près savoir comment utiliser une bonne bibliothèque comme JQuery et ne pas connaître les parties cachées de Javascript.

Une autre note concerne les outils de débogage sur divers navigateurs. Un programmeur JS doit savoir comment déboguer son code dans différents navigateurs.

Oh! Et savoir que JSLint nuira totalement à vos sentiments !!

Si vous voulez être un véritable ninja JavaScript, vous devez connaître les réponses à toutes les questions du Quiz JavaScript Perfection kills .

Un exemple pour vous mettre en appétit:

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

Que renvoie cette expression?

• "nombre"
• "indéfini"
• "une fonction"
• Erreur

Vous ne connaissez pas JavaScript si vous ne savez pas:

1. Fermetures
2. Héritage basé sur un prototype
3. Le modèle de module
4. Le W3C-DOM
5. Fonctionnement des événements

..que javascript n'est pas java :)

Beaucoup, beaucoup de gens commençant par le développement de sites Web m'ont dit que javascript est simplement du java simple!

1. Familiarisez-vous avec au moins une bibliothèque Javascript (Jquery, Prototype, etc.).

2. Apprenez à utiliser les outils de débogage des principaux navigateurs (MSIE 7-8, Firefox, Chrome, Safari)

3. Renseignez-vous sur l'industrie: le site Web de Douglas Crockford est un trésor tandis que Ajaxian.com est un bon blog pour suivre les idées nouvelles, intéressantes et ou étranges pour Javascript. Il existe un certain nombre d'autres ressources, mais ce sont celles qui m'ont le plus aidé.

Les objets Javascript fonctionnent comme des citoyens de première classe , des rappels , sans oublier les événements puis JQuery .

Ce Javascript n'est pas quelque chose qui s'apprend en une heure!

Les variables sont globales sauf si déclarées locales !!

Mauvais (DoSomething () n'est appelé que 10 fois):

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

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

CountToFive();

Bon (DoSomething () est appelé 50 fois comme prévu):

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

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

CountToFive();

Comment utiliser les bonnes pièces et comment éviter les parties horribles .

Pour savoir que Javascript s'appelait à l'origine LiveScript et que le préfixe «Java» était attaché à des fins marketing, non pas parce que Java et Javascript sont liés (ce qu'ils ne sont pas).

Oh et pour posséder n'importe quelle version de 'Javascript: The Definitive Guide' de David Flanagan (cette information est à la page 2).

... et d'avoir apprécié ceux qui l'ont précédé en essayant de brouiller document.all [] d'Internet Explorer 4 et les document.layers [] de Netscape Navigator 4 avant que Jquery ne retire la douleur.

ÉDITER:

Comme @Kinopiko le souligne, JavaScript a été appelé à l'origine le projet Mocha ( certaines sources pensent également qu'il s'appelait le projet LiveWire), mais il est généralement admis que le langage (écrit par Brendan Eich) devait être publié en tant que LiveScript avant l'adoption du préfixe Java. sortie début 1996.

Il faut être conscient de ce qui suit pour dire "Je connais JavaScript":

1. JavaScript est bon mais DOM est un point douloureux
2. Les problèmes de navigateur croisés peuvent vous rendre fou
3. Sauf si le code est testé sur au moins 4 bons navigateurs différents, vous ne pouvez pas dire que son bug est gratuit
4. Fermeture .............. À savoir
5. Son prototype basé sur ........... Nice celui son plaisir d'apprendre cela
6. mot-clé du débogueur ..... Aide en cas de crise

Ce JavaScript est beaucoup plus différent que les autres langages que vous ne le pensez. Regardez cet excellent Google Tech Talk pour vous faire une idée: http://www.youtube.com/watch?v=hQVTIJBZook

Que doit savoir tout codeur javascript?

Que diriez-vous, je peux désactiver vos efforts en 2 clics. Prévoyez donc un repli si possible.

Je recommande fortement de lire Javascript: The Good Parts

Vous connaissez javascript si vous pouvez utiliser efficacement Array, Number, String, Date et Object. Points positifs pour Math et RegExp. Vous devriez être capable d'écrire des fonctions et d'utiliser des variables (dans une portée correcte, c'est-à-dire en tant que «méthodes» d'un objet).

Je vois quelques commentaires sur la connaissance des fermetures, la syntaxe de fonction extravagante, blabla. Tout cela est tout à fait hors de propos pour cette question. C'est comme dire que vous êtes un coureur si vous pouvez courir le 100m en moins de 11 secondes.

Je dis qu'il faut peut-être quelques semaines pour devenir compétent en javascript. Après cela, il faut des années et des dizaines de livres et des milliers de lignes de programmation pour devenir un expert, un ninja, etc.

Mais ce n'était pas la question.

Oh, et le DOM ne fait pas partie de javascript, et jQuery non plus. Je pense donc que les deux sont également sans rapport avec la question.

JSLint http://www.JSLint.com/

Après avoir lu tout ce qui précède, il est également parfaitement bien d'apprendre Javascript en utilisant un cadre comme jQuery. La vérité est que c'est la première façon dont beaucoup de gens ont choisi JS en premier lieu. Pas de honte là-dedans.

tableau . lengthLa méthode n'est pas un nombre d'éléments du tableau, mais l'indice le plus élevé. même lorsque l'élément a été défini surundefined

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

ce comportement se distingue à peine d'un bogue de conception de langage.

jQuery serait ma meilleure recommandation. Pas seulement pour le code lui-même, c'est l'idiome, le style, la pensée derrière cela qui mérite le plus d'être émulé.

Ce javascript est la langue la plus déployée au monde. (Probablement)

Apprendre une langue vraiment bien et comprendre ses différentes bizarreries vient de (années d'expérience). Si vous voulez être un meilleur programmeur, je dirais, comprendre les modèles de conception, comment et quand les utiliser et / ou même quand vous les utilisez sans vous en rendre compte; architecture technique et expérience utilisateur.

Connaître le langage (JavaScript) signifie que vous pouvez choisir n'importe quel framework et l'utiliser à volonté. Vous devrez inévitablement plonger dans le code source, et si tout ce que vous savez est la syntaxe d'un framework ou 2 ou 3, alors vous n'irez pas loin. En disant cela, entrer dans le code source de quelques frameworks différents est probablement l'un des meilleurs moyens de voir comment JavaScript peut être utilisé. Jouez en parcourant le code dans Firebug ou Web Inspector, puis en vérifiant la documentation JavaScript, en particulier les documents Mozilla et Webkit, pour mieux comprendre ce que vous regardez.

Comprendre la différence entre la programmation orientée objet et la programmation fonctionnelle, que JavaScript est un mélange sexy des deux et quand et comment les utiliser pour créer une base de code tueur et des applications impressionnantes feront de vous un meilleur programmeur JavaScript.

Il suffit de lire certains livres, en particulier les "bonnes parties" de Crockford qui présentent simplement ses opinions sur ce qui est bon en JavaScript, tout en sautant la plupart des parties IMPRESSIONNANTES de JavaScript va vous mettre du mauvais pied.

Vérifier le code écrit par quelqu'un comme Thomas Fuchs, d'autre part, vous donnera beaucoup plus d'informations sur le pouvoir d'écrire du JavaScript incroyable et efficace.

Essayer de mémoriser quelques gotchas ou WTF ne va pas beaucoup aider non plus, vous le comprendrez si vous commencez à coder et à parcourir un code de bibliothèque / frameworks, en particulier un code utile, pour voir pourquoi ils ont utilisé certains propriétés / valeurs et pas d'autres pourquoi et quand il est bon d'utiliser des opérandes et des opérateurs spécifiques, tout cela est là dans le code d'utilisation du framework. Quoi de mieux que d'apprendre par l'exemple? : ^)

En Javascript, la performance compte.

Il n'y a pas de compilateur intelligent pour optimiser votre code, vous devez donc être plus prudent lorsque vous écrivez du code javascript que des langages comme C #, Java ...

littéraux d'objets parce qu'ils sont si agréables à écrire.

Les éléments suivants sont également importants:

1) Levage variable. 2) Chaînes de portée et objets d'activation.

puis des choses comme celles-ci: :)

3) wtfjs.com

4) tout est un objet http://www.lifeinafolder.com/images/Js.jpg

1. Savoir qu'il y a une vie avec et sans with() et où tracer la ligne.
2. Vous pouvez créer des erreurs personnalisées avec l' throwinstruction pour arrêter volontairement le runtime javascript.

JavaScript ne prend pas en charge la séparation du mot-clé de retour et de l'instruction de retour avec un caractère de nouvelle ligne comme le code suivant (ou essayez-le sur ma page jsFiddle )

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

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

Je ne comprends pas pourquoi JavaScript ne prend pas en charge ce style car il est beaucoup plus facile de lire du code source JavaScript très complexe par rapport au style par défaut de JavaScript.

PS. J'ai écrit JavaScript presque 6 ans. Mais je viens de trouver ce bogue avec moi-même lorsque j'essaie d'exécuter la fonction suivante. Il renvoie toujours indéfini. Lorsque j'utilise le débogueur et que j'entre dans cette fonction, tout fonctionne bien. Je pense que ce devrait être le pire bug de programmation de ma vie.

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') : '');
}

Étant donné que JS est un langage fonctionnel, un programmeur JS décent doit être capable d'écrire Y-combinator et d'expliquer comment cela fonctionne au départ.

... à propos de Google Web Toolkit , ce qui signifie que votre projet javascript pourrait probablement être développé de manière beaucoup plus pratique.