Partagez 9 compétences en programmation javascript que je considère personnellement comme des compétences importantes

Partagez 9 compétences en programmation javascript que je considère personnellement comme des compétences importantes_javascript

WBOY

Libérer： 2016-05-16 16:02:02

original

1267 Les gens l'ont consulté

1. Utiliser son jugement avec habileté :

En js, NaN, undefined, Null, 0, "" est faux une fois converti en bool, donc il peut être écrit comme ceci.

Copier le code Le code est le suivant :

si(!obj) {}

représente ce que fait un objet s'il est faux, car si obj est l'un des éléments ci-dessus, alors il est faux, !false est vrai, donc il n'est pas nécessaire de if(obj==null || obj == NaN ....).

2. Utiliser habilement les opérateurs :

Il existe une astuce très classique pour obtenir l'horodatage.

Copier le code Le code est le suivant :

var dataspan = new Date()*1;

Nous savons que js est un langage faiblement typé. Date() renverra une chaîne représentant l'heure. L'utilisation de cette chaîne pour effectuer des opérations arithmétiques entraînera une conversion, qui est l'horodatage du résultat.

3. Utilisez habilement les expressions régulières :

Copier le code Le code est le suivant :

/.a/ig.exec('xsas')

//Équivalent à la création d'un objet reg et à l'appel de la méthode exec. Bien entendu, d'autres méthodes peuvent également être appelées, telles que test(), match(), etc. 

4. Obtenez la valeur maximale et minimale du tableau :

Copier le code Le code est le suivant :

valeurs var = [1,2,3,40,23];
var max = Math.Max.apply(Math,valeurs);

Appelez Max.apply, définissez l'objet sur Math, puis transmettez une valeur pour déterminer la valeur maximale.

5. Optimisation de la mémoire :

Copier le code Le code est le suivant :

function p(){this.p='moersing'}; var p1 = new p();
p1.xx 

p1.xx

…..

p1=null; //Après avoir effectué l'opération, libérez enfin manuellement la référence à p1. 

6. La manière la plus populaire de créer des objets (mode prototype) :

Copier le code Le code est le suivant :

fonction c(){

This.name ='moersing';

Cet.age=18;

This.books=['javascript développer','C# développer'];

>

c.prototype={ 

displayBookName:fonction (){ 

foreach(var t dans this.books) 

            {

              document.write(this.books[t]);

>

>

>

Le plus gros inconvénient du modèle de construction de prototype est le partage des types de référence. Par conséquent, définissez le type de référence dans le constructeur et définissez la méthode générale dans le prototype, en utilisant cette référence.

7. Portée au niveau du bloc et variables privées

En JavaScript, il n'existe pas de portée au niveau du bloc ni de variables privées, mais en utilisant certaines fonctionnalités, vous pouvez simuler ces effets.

7.1 Portée au niveau du bloc :

Copier le code Le code est le suivant :

(fonction(){

//Portée au niveau du bloc

>

)();

Ajoutez une parenthèse autour de la fonction anonyme. J'appelle cela "normalisation des fonctions", c'est-à-dire qu'elle peut être appelée comme une fonction standard, comme :

Copier le code Le code est le suivant :

var nom =fonction(){};

(nom)();//Ceci n'est généralement pas écrit comme ça;

L'avantage de ceci est que les variables de la fonction ne sont pas accessibles en dehors de (), et cela devient une portée au niveau du bloc. Cette méthode est généralement utilisée lors de l'écriture de plug-ins et n'ajoute pas de variables supplémentaires au global. . variables, et une fois la fonction exécutée, ses variables définies en interne sont détruites, il n'y a donc aucun problème avec la fonction de fermeture.

7.2 Variables privées :

Copier le code Le code est le suivant :

fonction privée()

{ 

var nom = 'moersing';

This.getName = function(){

Renvoie this.name;

>

>

Les variables privées utilisent en fait la portée de la fonction comme restriction (non accessible de l'extérieur), puis définissent une méthode qui renvoie la variable correspondante, et c'est tout.

8.Liste de nœuds DOM :

nodeList est un élément dynamique, ce qui signifie que si vous ajoutez un élément au document, nodeList sera mis à jour en temps réel, comme :

Copier le code Le code est le suivant :

var alldiv = document.getElementsByTagName('div');

pour(var i=0;i
{

      var div = document.createElement('div');

        div.innerHTML= i.toString();

           document.body.appendChild(div);

>

Ce code provoquera une boucle infinie. Un div est créé dans la boucle, puis la méthode appendChild l'ajoute au corps. Ensuite, tous les alldivs seront mis à jour immédiatement, donc i

Copier le code Le code est le suivant :

var alldiv = document.getElementsByTagName('div');

var len,i;

pour(i=0,len=alldiv.length;i
{

      var div = document.createElement('div');

        div.innerHTML= i.toString();

           document.body.appendChild(div);

>

Voici une suggestion : il est préférable de ne pas utiliser NodeList fréquemment, car chaque opération exécutera une requête de l'arborescence DOM.

En plus des méthodes présentées ci-dessus, l'API nouvellement ajoutée (sélecteur API Level1) de HTML5 peut également résoudre ce problème. Elle est similaire à la requête en temps réel Linq de C#. Quant à ce qu'est la requête en temps réel Linq, je le fais. mettra à jour le blog à l'avenir, alors restez à l'écoute :

Copier le code Le code est le suivant :

var allDiv= document.querySelectorAll('div');

pour(var i=0;i
{

      var div = document.createElement('div');

        div.innerHTML= i.toString();

           document.body.appendChild(div);

>

querySelectorAll nécessite un paramètre, un sélecteur CSS, similaire à $() dans jquery. La NodeList qu'elle renvoie est une collection DOM ponctuelle et non dynamique.

Il existe également un querySelector, qui renvoie le premier élément correspondant. Pour plus de détails sur l'API HTML5, voir

http://www.w3.org/standards/techs/dom#w3c_all

https://developer.mozilla.org/zh-CN/docs/Web/API

De plus, je prépare également un blog spécifiquement sur l'API HTML5, alors restez à l'écoute.

Performances 9.DOM :

Ne faites pas des choses aussi stupides (je l'ai fait...)

Copier le code Le code est le suivant :

pour(var i=0;i<10;i )

{ 

document.querySelector('ul').innerHTML="" i "
";

>

L'attribution d'une valeur au innerHTML de l'objet appellera l'analyseur C intégré pour analyser la chaîne. Bien que ce soit très rapide, il est préférable de ne pas le faire car cela entraînerait une certaine perte de performances.

Mieux vaut faire ceci :

Copier le code Le code est le suivant :

var ih=null;

pour(var i=0;i<10;i )
{
ih ="

" je "

";
>
document.querySelector('ul').innerHTML=ih;

Certains autres sujets d'optimisation des performances seront mis à jour lorsque le temps sera venu.

Ce qui précède représente l’intégralité du contenu de cet article, j’espère que vous l’aimerez tous.