Sept compétences JavaScript (2)_compétences javascript

Le dernier article vous a présenté les Sept compétences JavaScript (2). J'écris du code JavaScript depuis longtemps et je ne me souviens même pas quand j'ai commencé. Je suis très enthousiasmé par ce que JavaScript a accompli ces dernières années ; j'ai eu la chance de bénéficier de ces réalisations. J'ai écrit pas mal d'articles, de chapitres et un livre qui lui est dédié, et pourtant je découvre encore de nouvelles choses sur la langue. Ce qui suit est une description des techniques de programmation qui m'ont fait dire « Ah ! » dans le passé, et ce sont des techniques que vous devriez essayer maintenant plutôt que d'attendre de les découvrir à un moment donné dans le futur.

var band = {
　　 "name":"The Red Hot Chili Peppers",
　　 "members":[
　　 {
　　 "name":"Anthony Kiedis",
　　 "role":"lead vocals"
　　 },
　　 {
　　 "name":"Michael 'Flea' Balzary",
　　 "role":"bass guitar, trumpet, backing vocals"
　　 },
　　 {
　　 "name":"Chad Smith",
　　 "role":"drums,percussion"
　　 },
　　 {
　　 "name":"John Frusciante",
　　 "role":"Lead Guitar"
　　 }
　　 ],
　　 "year":""
　　 }

Vous pouvez utiliser JSON directement en JavaScript, l'encapsuler dans une fonction, ou même l'utiliser comme valeur de retour d'une API. Nous appelons cela JSON-P, et de nombreuses API utilisent ce formulaire. Vous pouvez appeler un fournisseur de données et renvoyer les données JSON-P directement dans le code du script :

01　
12　

Il s'agit d'appeler la fonction de service Web fournie par le site Delicious pour obtenir la liste de signets récents non ordonnés au format JSON. ​

Fondamentalement, JSON est le moyen le plus portable de décrire des structures de données complexes, et il peut s'exécuter dans le navigateur. ​

Vous pouvez même l'exécuter en PHP en utilisant la fonction json_decode(). ​

Fonctions intégrées de JavaScript (Math, Array et String)　

Une chose qui m'a surpris est que lorsque j'ai étudié les fonctions mathématiques et String en JavaScript, j'ai découvert qu'elles pouvaient grandement simplifier mon travail de programmation. ​

En les utilisant, vous pouvez enregistrer le traitement de boucles complexes et le jugement conditionnel. ​

Par exemple, lorsque j'ai besoin d'implémenter une fonction pour trouver le plus grand nombre dans un tableau de nombres, j'écrivais la boucle comme ceci :

 var numbers =
　　[,,,,];
　　 var max = ;
　　 for(var i=;i
　　 if(numbers[i]
　　> max){
　　 max = numbers[i];
　　 }
　　 }
　　 alert(max);

Nous pouvons y parvenir sans boucle :

 var numbers =

　　[,,,,];
　　 numbers.sort(function(a,b){return b -
　　a});
　　 alert(numbers[]);

Il est à noter que vous ne pouvez pas trier() un tableau de caractères numériques, car dans ce cas il ne sera trié que par ordre alphabétique. ​
Si vous souhaitez en savoir plus sur l'utilisation, vous pouvez lire ce bon article sur sort(). ​

Une autre fonction intéressante est Math.max(). ​

Cette fonction renvoie le plus grand nombre parmi les nombres du paramètre :

Math.max(12,123,3,2,433,4); // returns 433　

Étant donné que cette fonction vérifie les nombres et renvoie le plus grand, vous pouvez l'utiliser pour tester la prise en charge d'une fonctionnalité par le navigateur :

 var scrollTop=
　　Math.max(
　　 doc.documentElement.scrollTop,
　　 doc.body.scrollTop
　　 );

Ceci est utilisé pour résoudre les problèmes d'IE. Vous pouvez obtenir la valeur scrollTop de la page actuelle, mais en fonction du DOCTYPE sur la page, une seule des deux propriétés ci-dessus stockera cette valeur et l'autre propriété ne sera pas définie, vous pouvez donc l'obtenir en utilisant Math.max () nombre. ​

Lisez cet article et vous obtiendrez plus de connaissances sur l'utilisation de fonctions mathématiques pour simplifier JavaScript. ​

Une autre paire de fonctions très utiles pour manipuler des chaînes est split() et join(). Je pense que l'exemple le plus représentatif est l'écriture d'une fonction pour attacher des styles CSS aux éléments de la page. ​

C'est le cas. Lorsque vous attachez une classe CSS à un élément de page, soit c'est la première classe CSS de cet élément, soit elle possède déjà des classes. Vous devez ajouter un espace après les classes existantes. puis ajoutez cette classe. Et lorsque vous souhaitez supprimer cette classe, vous devez également supprimer l'espace devant la classe (c'était très important dans le passé, car certains anciens navigateurs ne reconnaissaient pas les classes suivies d'espaces).

Donc, l'écriture originale serait comme ceci :

 function addclass(elm,newclass){
　　 var c =
　　elm.className;
　　 elm.className = (c === '') ? newclass : c+' '+newclass;
　　 }　　你可以使用 split() 和 join() 函数自动完成这个任务： function addclass(elm,newclass){
　　 var classes =
　　elm.className.split(' ');
　　 classes.push(newclass);
　　 elm.className = classes.join(' ');
　　 }　　

Cela garantira que toutes les classes sont séparées par des espaces et que la classe que vous souhaitez ajouter est placée à la fin.

C'est un comportement à courte vue. Les boîtes à outils peuvent vous aider à développer rapidement, mais si vous ne comprenez pas profondément JavaScript, vous pouvez également faire des erreurs.

Stockage des données au format JSON

Avant de découvrir JSON, j'utilisais toutes sortes de méthodes folles pour stocker des données dans les types de données natifs de JavaScript, tels que des tableaux, des chaînes, mélangées à des symboles faciles à diviser et d'autres éléments désagréables déroutants.

Après que Douglas Crockford ait inventé JSON, tout a changé.

En utilisant JSON, vous pouvez utiliser les propres fonctions de JavaScript pour stocker des données dans des formats complexes, et elles peuvent être directement accessibles et utilisées sans aucune conversion supplémentaire.

JSON est l'abréviation de « JavaScript Object Notation », qui utilise les deux méthodes d'abréviation mentionnées ci-dessus.

Le contenu ci-dessus correspond aux sept compétences JavaScript que l'éditeur a partagées avec vous. J'espère qu'il vous plaira.