Heim > Web-Frontend > js-Tutorial > Teilen Sie 9 Javascript-Programmierkenntnisse, die ich persönlich für wichtig halte_Javascript-Kenntnisse

Teilen Sie 9 Javascript-Programmierkenntnisse, die ich persönlich für wichtig halte_Javascript-Kenntnisse

WBOY
Freigeben: 2016-05-16 16:02:02
Original
1261 Leute haben es durchsucht

1. Setzen Sie Ihr Urteilsvermögen geschickt ein:

In js ist NaN, undefiniert, Null, 0, „“ falsch, wenn es in bool konvertiert wird, daher kann es so geschrieben werden.

Code kopieren Der Code lautet wie folgt:

if(!obj) {}

stellt dar, was ein Objekt tut, wenn es falsch ist, denn wenn obj eines der oben genannten ist, dann ist es falsch, !false ist wahr, daher besteht keine Notwendigkeit für if(obj==null || obj == NaN ....).

2. Operatoren geschickt einsetzen:

Es gibt einen ganz klassischen Trick, um den Zeitstempel zu erhalten.

Code kopieren Der Code lautet wie folgt:

var dataspan = new Date()*1;

Wir wissen, dass es sich bei js um eine schwach typisierte Sprache handelt. Die Verwendung dieser Zeichenfolge zum Ausführen arithmetischer Operationen führt zu einer Konvertierung, die den Zeitstempel des Ergebnisses darstellt.

3. Verwenden Sie reguläre Ausdrücke geschickt:

Code kopieren Der Code lautet wie folgt:

/.a/ig.exec('xsas')
// Entspricht dem Erstellen eines Reg-Objekts und dem Aufruf der Exec-Methode. Natürlich können auch andere Methoden aufgerufen werden, z. B. test (), match () usw.

4. Ermitteln Sie den Maximal- und Minimalwert des Arrays:

Code kopieren Der Code lautet wie folgt:

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

Rufen Sie Max.apply auf, setzen Sie das Objekt auf Math und übergeben Sie dann einen Wert, um den Maximalwert zu bestimmen.

5. Speicheroptimierung:

Code kopieren Der Code lautet wie folgt:
function p(){this.p='moersing'}; var p1 = new p(); p1.xx
p1.xx
…..
p1=null; //Nachdem die Operation ausgeführt wurde, geben Sie den Verweis auf p1 schließlich manuell frei.


6. Die beliebteste Art, Objekte zu erstellen (Prototyp-Modus):

Funktion c(){
This.name ='moersing';
This.age=18;
This.books=['Javascript Develop','C# Develop'];
}
c.prototype={
displayBookName:function (){
foreach(var t in this.books)
            {
              document.write(this.books[t]);
}
}
}


Der größte Nachteil des Prototyp-Konstruktionsmusters ist die gemeinsame Nutzung von Referenztypen. Definieren Sie daher den Referenztyp im Konstruktor und definieren Sie die allgemeine Methode im Prototyp mithilfe dieser Referenz.

7. Bereich und private Variablen auf Blockebene

In JavaScript gibt es keinen Bereich und keine privaten Variablen auf Blockebene, aber durch die Verwendung einiger Funktionen können Sie diese Effekte simulieren.

7.1 Geltungsbereich auf Blockebene:

(function(){
//Bereich auf Blockebene
}
)();


Fügen Sie eine Klammer um die anonyme Funktion hinzu, ich nenne sie „Funktionsstandardisierung“, das heißt, sie kann wie eine Standardfunktion aufgerufen werden, wie zum Beispiel:

Variablenname =function(){};
(name)();//Das wird normalerweise nicht so geschrieben;

Der Vorteil davon besteht darin, dass auf die Variablen in der Funktion nicht außerhalb von () zugegriffen werden kann und sie zu einem Bereich auf Blockebene wird. Diese Methode wird im Allgemeinen beim Schreiben von Plug-Ins verwendet und fügt dem globalen keine zusätzlichen Variablen hinzu . Variablen, und nachdem die Funktion ausgeführt wurde, werden ihre intern definierten Variablen zerstört, sodass es kein Problem mit der Abschlussfunktion gibt.

7.2 Private Variablen:

Code kopieren Der Code lautet wie folgt:

Funktion privat()
{
var name = 'moersing';
This.getName = function(){
Geben Sie diesen.Namen zurück;
}
}

Private Variablen verwenden tatsächlich den Funktionsumfang als Einschränkung (von außen nicht zugänglich) und definieren dann eine Methode, die die entsprechende Variable zurückgibt, und das war's.

8.DOM NodeList:

nodeList ist ein dynamisches Element. Wenn Sie also ein beliebiges Element zum Dokument hinzufügen, wird nodeList in Echtzeit aktualisiert, z. B.:

Code kopieren Der Code lautet wie folgt:

var alldiv = document.getElementsByTagName('div');
for(var i=0;i {
      var div = document.createElement('div');
        div.innerHTML= i.toString();
           document.body.appendChild(div);
}

Dieser Code verursacht eine Endlosschleife, die dann von der appendChild-Methode zum Hauptteil hinzugefügt wird. Dann werden alle alldivs sofort aktualisiert, sodass i

Code kopieren Der Code lautet wie folgt:

var alldiv = document.getElementsByTagName('div');
var len,i;
for(i=0,len=alldiv.length;i {
      var div = document.createElement('div');
        div.innerHTML= i.toString();
           document.body.appendChild(div);
}

Hier ist ein Vorschlag: Es ist am besten, NodeList nicht häufig zu verwenden, da jede Operation eine Abfrage des DOM-Baums ausführt.

Zusätzlich zu den oben vorgestellten Methoden kann auch die neu hinzugefügte API (Selektor-API Level1) von HTML5 dieses Problem lösen. Es ähnelt der Linq-Echtzeitabfrage von C# Ich werde den Blog in Zukunft aktualisieren, also bleiben Sie dran :

Code kopieren Der Code lautet wie folgt:

var allDiv= document.querySelectorAll('div');
for(var i=0;i {
      var div = document.createElement('div');
        div.innerHTML= i.toString();
           document.body.appendChild(div);
}

querySelectorAll erfordert einen Parameter, einen CSS-Selektor, ähnlich wie $() in jquery. Die zurückgegebene NodeList ist eine zeitnahe, nicht dynamische DOM-Sammlung.

Es gibt auch einen querySelector, der das erste übereinstimmende Element zurückgibt. Einzelheiten zur HTML5-API finden Sie unter

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

oder

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

Darüber hinaus bereite ich auch einen Blog speziell zur HTML5-API vor, also bleiben Sie dran.

9.DOM-Leistung:

Tu so dumme Dinge nicht (ich habe es getan...)

Code kopieren Der Code lautet wie folgt:

for(var i=0;i<10;i )
{
document.querySelector('ul').innerHTML="
  • " i "
  • ";
    }

    Das Zuweisen eines Werts zum innerHTML des Objekts ruft den integrierten C-Parser auf, um die Zeichenfolge zu analysieren. Dies ist zwar sehr schnell, es ist jedoch besser, dies nicht zu tun, da dies zu einem gewissen Leistungsverlust führt.

    Machen Sie besser Folgendes:

    Code kopieren Der Code lautet wie folgt:

    var ih=null;

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

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

    Einige andere Themen zur Leistungsoptimierung werden aktualisiert, wenn Zeit ist.

    Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, er gefällt Ihnen allen.

    Verwandte Etiketten:
    Quelle:php.cn
    Erklärung dieser Website
    Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
    Beliebte Tutorials
    Mehr>
    Neueste Downloads
    Mehr>
    Web-Effekte
    Quellcode der Website
    Website-Materialien
    Frontend-Vorlage