让你的javascript代码高大上
1,创造简短的写法
你可以这么写:
1 var slice = Array.prototype.slice; 2 slice.call(arguments); //转化成数组
也可以这么写:(ie9+)
1 var unboundSlice = Array.prototype.slice; 2 var slice = Function.prototype.call.bind(unboundSlice); 3 slice(arguments);//转化成数组
还可以这么写:
1 (function(slice){ 2 slice(); //可以直接调用该方法 3 })(Array.prototype.slice);
2,原型方法扩展:
你可以这么写:
1 function A(){}; 2 A.prototype.fn1=function(){}; 3 A.prototype.fn2=function(){};
也可以这么写:
1 function A(){}; 2 A.prototype={ 3 constructor:A, 4 fn1:function(){}, 5 fn2:function(){} 6 };
还可以这么写:
1 function A(){}; 2 $.extend(A.prototype,{ 3 fn1:function(){}, 4 fn2:function(0{} 5 });
3,返回一个由数组拼合成的字符串
你可以这么写:
1 function A(){ 2 var a=[]; 3 4 a.push("str1"); 5 a.push("str2"); 6 a.push("str3"); 7 8 return a.join(""); 9 };
也可以这么写:
1 function A(){ 2 return [ 3 "str1", 4 "str2", 5 "str3" 6 ].join(""); 7 };
4,逗号表达式
你可以这么写:
1 var a; 2 var b; 3 var c;
也可以这么写:
1 var a,b,c;
5,巧用&&
你可以这么写:
1 if(a){ 2 b(); 3 };//如果a为真,则执行函数b
也可以这么写:
1 a && b();
6,巧用||
你可以这么写:
1 if(!a){ 2 c(); 3 };//如果a为假,则执行函数c
也可以这么写:
1 !a || c();
7,巧用三元表达式
你可以这么写:
1 if(a){ 2 b(); 3 }else{ 4 c(); 5 }//如果a为真,则执行函数b,否则执行函数c;
也可以这么写:
1 a ? b():c();
8,同一个对象上绑定多个事件
你可以这么写:
1 1 $(obj).click(function (){}); 2 2 $(obj).focus(function (){}); 3 3 $(obj).blur(function (){});
也可以这么写:
1 $(obj).bind({ 2 click:function(){}, 3 foucus:function(){}, 4 blur:function:(){} 5 });
9,缓存对象属性,防止每次都去读取属性
你可以这么写:
1 for(var i =0 ;i < obj.length; i++){};
也可以这么写:
for(var i=0, len=obj.length; i < len; i++){};
10,数组拼合
你可以这么写:
1 var a=[1,2,3]; 2 var b=[4,5,6]; 3 var a=a.concat(b);//a=[1,2,3,4,5,6]
也可以这么写:
1 var a=[1,2,3]; 2 var b=[4,5,6]; 3 a.push.apply(a,b);//a=[1,2,3,4,5,6]
这个地方不能不call哦,apply的参数必须是数组,此处正是利用了这一点!
11,没有库时,应该做简易的封装
你可以这么写:
1 var dom1 = document.getElementById("id1"); 2 var dom2 = document.getElementById("id2");
也可以这么写:
1 function D(id){ 2 return document.getElementById(id); 3 } 4 5 var dom1=D("id1"); 6 var dom2=D("id2");
12,善于使用正则:
你可以这么写:
1 if(document.readyState==="loaded" || document.readyState==="complete"){}
也可以这么写:
1 if (/loaded|complete/.test(document.readyState)){}
13,利用js内部的自我转换
你要将number和string转换,可以这么做:
1 //number转化成string 2 var num=123; 3 var str=num.toString(); //"123" 4 5 //string转化成number 6 var str="123"; 7 var num = parseInt(str,10); //123
也可以这么写:
1 //number转化成string 2 var num=123; 3 var str=num+""; //"123" 4 5 //string转化成number 6 var str="123"; 7 var num = str-""; //123
14,使用原型进行批量复制:
你可以这么写:
1 function f(x){ 2 x!=null && this.x=x; 3 }; 4 var a = []; 5 for(var i = 0; i<100; i++){ 6 a[i]=new f(10); //把实例分别存入数组 7 };
也可以这么写:
function f(x){ x!=null && this.x=x; }; var a = []; function temp = {}; temp.prototype=new f(10); for(var i = 0; i<100; i++){ a[i]=new temp(); //把实例分别存入数组 };
假如你想修改数组的值,只需要修改类f的原型即可。
开心一刻: