Description des connaissances :
Lorsque vous apprenez JavaScript, faites attention aux sept détails suivants pour rendre notre code plus facile à comprendre et plus efficace tout en remplissant la même fonction.
1.Code simplifié
Exemple : Créer un objet
C'était comme ça avant :
Var voiture = nouvel objet();
Car.color = "rouge";
Car.wheels = 4;
Voiture.age = 8;
Et maintenant ça peut s'écrire ainsi :
Voiture Var = {couleur : 'rouge', roues :4, âge :8>
Par exemple : Créer un tableau
C'était comme ça avant :
Var studentArray = new Array('zhangsan', 'lisi', 'zhaowu', 'wuliu');
Et maintenant ça peut s'écrire ainsi :
Var studentArray = {'zhangsan', 'lisi', 'zhaowu', 'wuliu'};
Exemple : Utiliser l'opérateur ternaire pour simplifier le code
L'écriture précédente de était :
Var result; if(x > 100) { Result = 1; }else{ Result = -1; }
Et maintenant, cela peut s'écrire :
Var résultat = x >100 ? 1 : -1;
2. Utilisez JSON comme format de données
Utilisez le format Json pour stocker les données :
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":"2009" }
Vous pouvez également utiliser JS pour stocker des données, le code est le suivant :
<div id = “dataDiv”></div> <script> Function saveData(data) { Var out =“<ul>”; For(var i=0; i<data.length; i++) { Out += “<li><a href =”'+data[i].url+'”>+ data[i].d+</a></li>”; } Out += ‘</ul>'; Document.getElementById(‘dataDiv').innerHTML = out; } </script>
Vous pouvez même utiliser les données stockées générées par le JS ci-dessus comme valeur de retour de l'API
3. Essayez d'utiliser les fonctions natives JavaScript
Par exemple : Obtenez la valeur maximale dans un ensemble de données
var maxData = Math.max(0,20,50,10);
alert(maxData); //La valeur maximale renvoyée est 50
Par exemple : utilisez JS pour ajouter un style de classe à un élément. L'extrait de code est le suivant :
Function addClass(elm, newclass) { Var classes = elm.className.split(‘ ‘ ); Classes.push(newclass); Elm.className = classes.join(‘ '); }
4. Délégation événementielle
Par exemple :
<h2>Great Web resources</h2> <ul id="resources"> <li><a href="http://opera.com/wsc">Opera Web Standards Curriculum</a></li> <li><a href="http://sitepoint.com">Sitepoint</a></li> <li><a href="http://alistapart.com">A List Apart</a></li> <li><a href="http://yuiblog.com">YUI Blog</a></li> <li><a href="http://blameitonthevoices.com">Blame it on the voices</a></li> <li><a href="http://oddlyspecific.com">Oddly specific</a></li> </ul>
Meilleure façon d'écrire des scripts :
(function(){ var resources = document.getElementById('resources'); resources.addEventListener('click',handler,false); function handler(e){ var x = e.target; // get the link tha if(x.nodeName.toLowerCase() === 'a'){ alert('Event delegation:' + x); e.preventDefault(); } }; })();
5. Fonctions anonymes
var myApplication = function(){ var name = 'Chris'; var age = '34'; var status = 'single'; function createMember(){ // [...] } function getMemberDetails(){ // [...] } return{ create:createMember, get:getMemberDetails } }(); //myApplication.get() and myApplication.create() now work.
6. Code configurable
Si vous souhaitez que le code que vous écrivez soit plus facile à utiliser ou à modifier pour les autres, il doit être configurable. La solution consiste à ajouter un objet de configuration au script que vous écrivez. Les points clés sont les suivants :
1. Ajoutez un objet appelé configuration dans votre script.
2. Stockez dans l'objet de configuration toutes les choses que d'autres pourraient vouloir modifier, comme l'ID CSS, le nom de la classe, la langue, etc.
3. Renvoyez cet objet en tant que propriété publique afin que d'autres puissent le remplacer.
7. Compatibilité des codes
La compatibilité est quelque chose que les débutants ont tendance à négliger. Habituellement, lorsqu'ils apprennent Javascript, ils sont testés dans un navigateur fixe, et ce navigateur est très probablement IE. C'est très fatal, car de nos jours, parmi les principaux navigateurs grand public, IE. a le pire soutien aux normes. Le résultat constaté par l'utilisateur final peut être que le code que vous avez écrit ne peut pas s'exécuter correctement dans un certain navigateur. Vous devriez tester votre code dans tous les principaux navigateurs. Cela peut prendre du temps, mais cela devrait être fait.
Les sept choses ci-dessus à noter lors de l'apprentissage de JavaScript [à lire absolument] sont tout le contenu partagé par l'éditeur. J'espère qu'il pourra vous donner une référence, et j'espère également que tout le monde soutiendra Script Home.