Heim > Artikel > Web-Frontend > Sieben Dinge, die Sie beim Erlernen von JavaScript beachten sollten [muss gelesen werden]_Grundkenntnisse
Wissensbeschreibung:
Achten Sie beim Erlernen von JavaScript auf die folgenden sieben Details, um unseren Code verständlicher und effizienter zu machen und gleichzeitig die gleiche Funktion zu erreichen.
1. Vereinfachter Code
Beispiel: Objekt erstellen
So war es schon einmal:
Var car = new object();
Car.color = „red“;
Car.wheels = 4;
Fahrzeugalter = 8;
Und jetzt kann es so geschrieben werden:
Var Auto = {Farbe:'rot', Räder:4, Alter:8🎜>
So war es schon einmal:
Var studentArray = new Array('zhangsan', 'lisi', 'zhaowu', 'wuliu');
Und jetzt kann es so geschrieben werden:
Var studentArray = {‘zhangsan’, ‘ lisi’, ‘zhaowu’, ‘wuliu’};
Beispiel: Verwenden Sie einen ternären Operator, um den Code zu vereinfachen
Die vorherige Schreibweise von
war:
Var result; if(x > 100) { Result = 1; }else{ Result = -1; }
Var result = x >100 ? 1 : -1;
2. Verwenden Sie JSON als Datenformat
Verwenden Sie das Json-Format zum Speichern von Daten:
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" }
<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>
e689660efc10baf32b3614d0f3fc8ed4
2cacc6d41bbb37262a98f745aa00fbf0
3. Versuchen Sie, native JavaScript-Funktionen zu verwenden
Zum Beispiel: Ermitteln Sie den Maximalwert in einem Datensatzvar maxData = Math.max(0,20,50,10);
alert(maxData); //Der zurückgegebene Maximalwert beträgt 50
Beispiel: Verwenden Sie JS, um einem Element einen Klassenstil hinzuzufügen. Der Codeausschnitt lautet wie folgt:
Function addClass(elm, newclass) { Var classes = elm.className.split(‘ ‘ ); Classes.push(newclass); Elm.className = classes.join(‘ '); }
4. Veranstaltungsdelegation
Zum Beispiel:
<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>
(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. Anonyme Funktionen
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 konfigurierbar
Wenn Sie möchten, dass der von Ihnen geschriebene Code für andere einfacher zu verwenden oder zu ändern ist, muss er konfigurierbar sein. Die Lösung besteht darin, dem von Ihnen geschriebenen Skript ein Konfigurationsobjekt hinzuzufügen. Die wichtigsten Punkte sind wie folgt:1. Fügen Sie Ihrem Skript ein Objekt namens „Konfiguration“ hinzu.
2. Speichern Sie im Konfigurationsobjekt alle Dinge, die andere möglicherweise ändern möchten, wie CSS-ID, Klassenname, Sprache usw.
3. Geben Sie dieses Objekt als öffentliche Eigenschaft zurück, damit andere es überschreiben können.
7. Code-Kompatibilität
Kompatibilität ist etwas, das Anfänger oft übersehen, wenn sie Javascript lernen, sie werden in einem festen Browser getestet, und dieser Browser ist sehr wahrscheinlich IE. Dies ist sehr fatal, da es heutzutage nur wenige der großen Mainstream-Browser gibt hat die schlechteste Unterstützung für Standards. Das für den Endbenutzer sichtbare Ergebnis kann sein, dass der von Ihnen geschriebene Code in einem bestimmten Browser nicht ordnungsgemäß ausgeführt werden kann. Sie sollten Ihren Code in allen gängigen Browsern testen. Dies kann zeitaufwändig sein, sollte aber durchgeführt werden.