Heim > Web-Frontend > js-Tutorial > Hauptteil

Zusammenfassung der Lernfähigkeiten der JavaScript-Programmierung_Javascript-Fähigkeiten

WBOY
Freigeben: 2016-05-16 15:14:25
Original
1204 Leute haben es durchsucht

Die Beispiele in diesem Artikel vermitteln Kenntnisse zum Erlernen der JavaScript-Programmierung als Referenz. Der spezifische Inhalt ist wie folgt

1. Variablenkonvertierung

varmyVar="3.14159",

str=""+myVar,//tostring

int=~~myVar,//tointeger

float=1*myVar,//tofloat

bool=!!myVar,/*toboolean-anystringwithlength

andanynumberexcept0aretrue*/

array=[myVar];//toarray
Nach dem Login kopieren

Sie müssen jedoch den Konstruktor verwenden, um Datumsangaben (new Date(myVar)) und reguläre Ausdrücke (new RegExp(myVar)) zu konvertieren. Verwenden Sie beim Erstellen regulärer Ausdrücke vereinfachte Formen wie /pattern/flags.

2. Runden und gleichzeitig in einen numerischen Wert umrechnen

//字符型变量参与运算时,JS会自动将其转换为数值型(如果无法转化,变为NaN)

'10.567890'|0

//结果:10

//JS里面的所有数值型都是双精度浮点数,因此,JS在进行位运算时,会首先将这些数字运算数转换为整数,然后再执行运算

//|是二进制或,x|0永远等于x;^为异或,同0异1,所以x^0还是永远等于x;至于~是按位取反,搞了两次以后值当然是一样的

'10.567890'^0

//结果:10

-2.23456789|0

//结果:-2
Nach dem Login kopieren

3. Datum in Wert umrechnen

//JS本身时间的内部表示形式就是Unix时间戳,以毫秒为单位记录着当前距离1970年1月1日0点的时间单位

vard=+newDate();//1295698416792

Nach dem Login kopieren

4. Array-ähnliches Objekt in Array konvertieren

vararr=[].slice.call(arguments)

下面的实例用的更绝

functiontest(){

varres=['item1','item2']

res=res.concat(Array.prototype.slice.call(arguments))//方法1

Array.prototype.push.apply(res,arguments)//方法2

}

Nach dem Login kopieren

5. Umrechnung zwischen Basen

(int).toString(16);//convertsinttohex,eg12=>"C"

(int).toString(8);//convertsinttooctal,eg.12=>"14"

parseInt(string,16)//convertshextoint,eg."FF"=>255

parseInt(string,8)//convertsoctaltoint,eg."20"=>16

将一个数组插入另一个数组指定的位置

vara=[1,2,3,7,8,9];

varb=[4,5,6];

varinsertIndex=3;

a.splice.apply(a,Array.prototype.concat(insertIndex,0,b));

Nach dem Login kopieren

6. Array-Elemente löschen

vara=[1,2,3,4,5];

a.splice(3,1);//a=[1,2,3,5]

Nach dem Login kopieren

Sie fragen sich vielleicht, warum Sie splice anstelle von delete verwenden sollten, da die Verwendung von delete eine Lücke im Array hinterlässt und die nachfolgenden Indizes nicht dekrementiert werden.
7. Bestimmen Sie, ob es sich um IE handelt

varie=/*@cc_on!@*/false;
Nach dem Login kopieren

So ein einfacher Satz kann auch bestimmen, ob es sich um ein Ie handelt. . .

Tatsächlich gibt es noch weitere wunderbare Möglichkeiten, siehe unten

//edithttp://www.lai18.com

//貌似是最短的,利用IE不支持标准的ECMAscript中数组末逗号忽略的机制

varie=!-[1,];

//利用了IE的条件注释

varie=/*@cc_on!@*/false;

//还是条件注释

varie//@cc_on=1;

//IE不支持垂直制表符

varie='v'=='v';

//原理同上
varie=!+"v1";
Nach dem Login kopieren

Als ich das erfuhr, fühlte ich mich schwach.

Verwenden Sie so oft wie möglich native Methoden

Um die maximale Zahl in einer Zahlenmenge zu finden, könnten wir eine Schleife schreiben, zum Beispiel:

varnumbers=[3,342,23,22,124];

varmax=0;

for(vari=0;i

if(numbers[i]>max){

max=numbers[i];

}

}

alert(max);

Nach dem Login kopieren

Tatsächlich kann es mit nativen Methoden einfacher implementiert werden

varnumbers=[3,342,23,22,124];

numbers.sort(function(a,b){returnb-a});

alert(numbers[0]);

Nach dem Login kopieren

Die einfachste Methode ist natürlich:

Math.max(12,123,3,2,433,4);//returns433
Nach dem Login kopieren

Auch das ist jetzt möglich

[xhtml]view plaincopy

Math.max.apply(Math,[12,123,3,2,433,4])//取最大值

Math.min.apply(Math,[12,123,3,2,433,4])//取最小值

Nach dem Login kopieren

8. Zufallszahlen generieren

Math.random().toString(16).substring(2);//toString()函数的参数为基底,范围为2~36。

Math.random().toString(36).substring(2);

Nach dem Login kopieren

Tauschen Sie die Werte zweier Variablen aus, ohne Variablen von Drittanbietern zu verwenden

a=[b,b=a][0];
Nach dem Login kopieren

9. Veranstaltungsdelegation

JS-Code lautet wie folgt:

//Classiceventhandlingexample

(function(){

varresources=document.getElementById('resources');

varlinks=resources.getElementsByTagName('a');

varall=links.length;

for(vari=0;i

//Attachalistenertoeachlink

links[i].addEventListener('click',handler,false);

};

functionhandler(e){

varx=e.target;//Getthelinkthatwasclicked

alert(x);

e.preventDefault();

};

})();

Nach dem Login kopieren

Verwenden Sie die Ereignisdelegation, um eleganter zu schreiben:

(function(){

varresources=document.getElementById('resources');

resources.addEventListener('click',handler,false);

functionhandler(e){

varx=e.target;//getthelinktha

if(x.nodeName.toLowerCase()==='a'){

alert('Eventdelegation:'+x);

e.preventDefault();

}

};

})();

Nach dem Login kopieren

10. Überprüfen Sie die Version

var_IE=(function(){

varv=3,div=document.createElement('div'),all=div.getElementsByTagName('i');

while(

div.innerHTML='',

all[0]

);

returnv>4?v:false;

}());

Nach dem Login kopieren

JavaScript-Versionserkennung

Wissen Sie, welche Javascript-Version Ihr Browser unterstützt?

varJS_ver=[];

(Number.prototype.toFixed)?JS_ver.push("1.5"):false;

([].indexOf&&[].forEach)?JS_ver.push("1.6"):false;

((function(){try{[a,b]=[0,1];returntrue;}catch(ex){returnfalse;}})())?JS_ver.push("1.7"):false;

([].reduce&&[].reduceRight&&JSON)?JS_ver.push("1.8"):false;

("".trimLeft)?JS_ver.push("1.8.1"):false;

JS_ver.supports=function()

{

if(arguments[0])

return(!!~this.join().indexOf(arguments[0]+",")+",");

else

return(this[this.length-1]);

}

alert("LatestJavascriptversionsupported:"+JS_ver.supports());

alert("Supportforversion1.7:"+JS_ver.supports("1.7"));

Nach dem Login kopieren

11. Bestimmen Sie, ob das Attribut vorhanden ist

//BAD:Thiswillcauseanerrorincodewhenfooisundefined

if(foo){

doSomething();

}
//GOOD:Thisdoesn'tcauseanyerrors.However,evenwhen

//fooissettoNULLorfalse,theconditionvalidatesastrue

if(typeoffoo!="undefined"){

doSomething();

}
//BETTER:Thisdoesn'tcauseanyerrorsandinaddition

//valuesNULLorfalsewon'tvalidateastrue

if(window.foo){

doSomething();

}

Nach dem Login kopieren

Manchmal haben wir tiefere Strukturen und benötigen angemessenere Inspektionen

//UGLY:wehavetoproofexistenceofevery

//objectbeforewecanbesurepropertyactuallyexists

if(window.oFoo&&oFoo.oBar&&oFoo.oBar.baz){

doSomething();

}

Nach dem Login kopieren

Tatsächlich lässt sich am besten feststellen, ob ein Attribut vorhanden ist:

if("opera"inwindow){

console.log("OPERA");

}else{

console.log("NOTOPERA");

}

Nach dem Login kopieren

12. Überprüfen Sie, ob das Objekt ein Array ist

varobj=[];

Object.prototype.toString.call(obj)=="[objectArray]";
Nach dem Login kopieren

Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, dass er für alle beim Erlernen der Javascript-Programmierung hilfreich sein wird.

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