Maison >interface Web >js tutoriel >Résumé des compétences d'apprentissage de la programmation JavaScript_compétences Javascript
Les exemples de cet article partagent des compétences d'apprentissage en programmation JavaScript pour votre référence. Le contenu spécifique est le suivant
.1.Conversion de variables
varmyVar="3.14159", str=""+myVar,//tostring int=~~myVar,//tointeger float=1*myVar,//tofloat bool=!!myVar,/*toboolean-anystringwithlength andanynumberexcept0aretrue*/ array=[myVar];//toarray
Cependant, vous devez utiliser le constructeur pour convertir les dates (new Date(myVar)) et les expressions régulières (new RegExp(myVar)). Lors de la création d'expressions régulières, utilisez des formulaires simplifiés tels que /pattern/flags.
2. Arrondissez et convertissez en valeur numérique en même temps
//字符型变量参与运算时,JS会自动将其转换为数值型(如果无法转化,变为NaN) '10.567890'|0 //结果:10 //JS里面的所有数值型都是双精度浮点数,因此,JS在进行位运算时,会首先将这些数字运算数转换为整数,然后再执行运算 //|是二进制或,x|0永远等于x;^为异或,同0异1,所以x^0还是永远等于x;至于~是按位取反,搞了两次以后值当然是一样的 '10.567890'^0 //结果:10 -2.23456789|0 //结果:-2
3. Convertir la date en valeur
//JS本身时间的内部表示形式就是Unix时间戳,以毫秒为单位记录着当前距离1970年1月1日0点的时间单位 vard=+newDate();//1295698416792
4. Convertir un objet de type tableau en tableau
vararr=[].slice.call(arguments) 下面的实例用的更绝 functiontest(){ varres=['item1','item2'] res=res.concat(Array.prototype.slice.call(arguments))//方法1 Array.prototype.push.apply(res,arguments)//方法2 }
5. Conversion entre bases
(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));
6. Supprimer les éléments du tableau
vara=[1,2,3,4,5]; a.splice(3,1);//a=[1,2,3,5]
Vous vous demandez peut-être pourquoi vous devriez utiliser splice au lieu de delete, car l'utilisation de delete laissera un trou dans le tableau et les indices suivants ne seront pas décrémentés.
7. Déterminez s'il s'agit d'IE
varie=/*@cc_on!@*/false;
Une phrase aussi simple peut déterminer si c'est le cas aussi. . .
En fait, il existe d'autres façons merveilleuses, veuillez voir ci-dessous
//edithttp://www.lai18.com //貌似是最短的,利用IE不支持标准的ECMAscript中数组末逗号忽略的机制 varie=!-[1,]; //利用了IE的条件注释 varie=/*@cc_on!@*/false; //还是条件注释 varie//@cc_on=1; //IE不支持垂直制表符 varie='v'=='v'; //原理同上 varie=!+"v1";
Au moment où j'ai appris cela, je me suis senti faible.
Utilisez autant que possible les méthodes natives
Pour trouver le nombre maximum dans un ensemble de nombres, on pourrait écrire une boucle, par exemple :
varnumbers=[3,342,23,22,124]; varmax=0; for(vari=0;i if(numbers[i]>max){ max=numbers[i]; } } alert(max);
En fait, il peut être implémenté plus facilement en utilisant des méthodes natives
varnumbers=[3,342,23,22,124]; numbers.sort(function(a,b){returnb-a}); alert(numbers[0]);
Bien sûr, la méthode la plus simple est :
Math.max(12,123,3,2,433,4);//returns433
C'est également possible maintenant
[xhtml]view plaincopy Math.max.apply(Math,[12,123,3,2,433,4])//取最大值 Math.min.apply(Math,[12,123,3,2,433,4])//取最小值
8. Générer des nombres aléatoires
Math.random().toString(16).substring(2);//toString()函数的参数为基底,范围为2~36。 Math.random().toString(36).substring(2);
Échangez les valeurs de deux variables sans utiliser de variables tierces
a=[b,b=a][0];
9. Délégation événementielle
le code js est le suivant :
//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(); }; })();
Utilisez la délégation d'événement pour écrire avec plus d'élégance :
(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(); } }; })();
10. Vérifiez la version
var_IE=(function(){ varv=3,div=document.createElement('div'),all=div.getElementsByTagName('i'); while( div.innerHTML='', all[0] ); returnv>4?v:false; }());
Détection de version javascript
Savez-vous quelle version de Javascript est prise en charge par votre navigateur ?
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"));
11. Déterminer si l'attribut existe
//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(); }
Parfois, nous avons des structures plus profondes et avons besoin d'inspections plus appropriées
//UGLY:wehavetoproofexistenceofevery //objectbeforewecanbesurepropertyactuallyexists if(window.oFoo&&oFoo.oBar&&oFoo.oBar.baz){ doSomething(); }
En fait, la meilleure façon de détecter si un attribut existe est :
if("opera"inwindow){ console.log("OPERA"); }else{ console.log("NOTOPERA"); }
12. Vérifiez si l'objet est un tableau
varobj=[]; Object.prototype.toString.call(obj)=="[objectArray]";
Ce qui précède représente l'intégralité du contenu de cet article. J'espère qu'il sera utile à tout le monde dans l'apprentissage de la programmation javascript.