Javascript Girl
  1. Javascript Girl
  3. Javascript: lors de l'utilisation de l'objet littéral, la commande des propriétés est-elle importante?
Intereting Posts
Centrez un site horizontal déroulant d'une page dans le navigateur (ne centrant pas un div) Définissez la zone de texte en lecture seule et la couleur d'arrière-plan est en gris dans jquery Entrée du fichier déclencheur Jquery Autocomplète de type Twitter dans la zone de texte Qu'est-ce qui signifie (value inégal value) en JavaScript? Remplissez automatiquement les données dans les boîtes de saisie KnockoutJS / Bootstrap – Effacement du formulaire modal lors de la fermeture de modal en utilisant javascript Comparaison des tableaux d'objets en JavaScript Console.log of element.children affiche 0 length mais a trois entrées lorsqu'il a été développé plus tard Y at-il quelque chose qui garantit un temps constant pour accéder à une propriété d'un objet en JavaScript? Comment puis-je obtenir jquery pour exécuter des animations en parallèle exact? Quelle est l'expression valide de gauche dans la grammaire JavaScript? Object.create n'est pas pris en charge dans ie8 Paramètres d'invite personnalisés OneSignal et bouton Notify Javascript et css sans blocage dans les navigateurs modernes. Est-il encore nécessaire?

Javascript: lors de l'utilisation de l'objet littéral, la commande des propriétés est-elle importante?

Prenons l'exemple suivant à partir de: http://www.phpied.com/3-ways-to-define-a-javascript-class/ 

var apple = { type: "macintosh", color: "red", getInfo: function () { return this.color + ' ' + this.type + ' apple'; } };

Maintenant, je déplace la méthode getInfo () en haut de la déclaration de mon objet. 

 var apple = { getInfo: function () { return this.color + ' ' + this.type + ' apple'; }, type: "macintosh", color: "red", }; apple.getInfo(); red macintosh apple

Je m'attendais à ce que l'analyseur / compilateur javascript échoue, puisque this.color et this.type ne sont pas encore définis. Comment cela fonctionne-t-il en interne?

(Cette question était à l'origine une question de cadre ExtJS ici: ExtJS: propriétés de paramètres via une fonction sur le prototype: est-ce un modèle sécurisé?, Mais j'ai compris qu'il s'agissait d'une question de javascript plus générale, donc celle-ci)

Le code à l'intérieur de la fonction n'est pas exécuté tant que vous ne l'appelez pas, et la color de la propriété n'est pas évaluée jusqu'à apple.getInfo() que apple.getInfo() soit appelé.

Modifier: 

 var apple = { getInfo: function () { return this.color + ' ' + this.type + ' apple'; }, type: "macintosh", color: "red", } }

À ce moment, l'objet Apple est défini, et la propriété getInfo est une fonction qui renverra les propriétés “ lorsqu'il sera évalué 

 apple.getInfo();

La fonction est maintenant évaluée et la color et le type propriétés ont déjà été définis à ce stade

La fonction obtient les valeurs de ces propriétés lorsqu'elles sont évaluées de sorte que si la color et le type propriétés sont modifiés, la valeur de retour de la fonction change également.

La fonction est appelée après avoir effectué l'instance. Lorsqu'il est défini, il n'est pas exécuté, ne tente pas d'accéder aux propriétés, mais où vous avez appelé la fonction getInfo() , elles sont toutes présentes. En fait, il n'existe aucun moyen d'exécuter un code JavaScript personnalisé entre l'interprète en analysant les propriétés individuelles.

Je m'attendais à ce que l'analyseur / compilateur javascript échoue, puisque this.color et this.type ne sont pas encore définis.

L'analyseur dans le compilateur ne s'en préoccupe pas. JavaScript n'évalue pas si une propriété ou une variable peut être trouvée jusqu'à ce que le code qui l'utilise soit exécuté . Et dans le cas de propriétés, une propriété qui n'existe pas encore vient d'être créée (si vous l'écrivez) ou résulte dans la valeur undefined (si vous en lisez), même si votre objet n'a pas été créé, T ont color propriétés de color et de type , le code ne lirait toujours pas une erreur. Vous obtenez simplement la chaîne "undefined undefined apple" .

Javascript: lors de l'utilisation de l'objet littéral, la commande des propriétés est-elle importante?

Des questions? Probablement pas. A-t-il un sens? Oui, à partir de ES6 (alias ECMAScript 6 alias ECMAScript 20150), la dernière spécification. L'ordre des propriétés dans un initialiseur d'objet détermine l'ordre dans lequel les propriétés sont créées, ce qui déclenche partiellement l'ordre dans lequel elles sont visitées par les boucles for-in , l'ordre qu'elles apparaissent dans les tableaux Object.keys , etc. (partiellement Parce que les noms de propriétés qui peuvent contraindre les nombres entiers sont traités différemment.) Mais il est rare que vous vous souciiez. Détails dans cette réponse et cette réponse (cette dernière concerne principalement des tableaux, mais touche également les objets non-tableau).