[转] javascript基础知识大集锦(2)

1.关于cookie的函数: 
Js代码 
  1. /** 
  2.  * cookie操作工具. 
  3.  * 使用方法:保存值:CookieTool('name','1',{expires: 7})  //表示保存一个cookie值为1,键值为name,失效时间7天以后 
  4.  *         取值:CookieTool('name')                    //返回1 
  5.  * @param {} name 
  6.  * @param {} value 
  7.  * @param {} options 
  8.  * @return {} 
  9.  */  
  10. CookieTool = function(name, value, options) {  
  11.           if (typeof value != 'undefined') {  
  12.                     options = options || {};  
  13.                     if (value === null) {  
  14.                               value = '';   
  15.                               options.expires = -1;  
  16.                     }  
  17.                     var expires = '';  
  18.                     if (options.expires && (typeof options.expires == 'number' || options.expires.toUTCString)) {  
  19.                               var date;  
  20.                               if (typeof options.expires == 'number') {  
  21.                                         date = new Date();  
  22.                                         date.setTime(date.getTime() + (options.expires * 24 * 60 * 60 * 1000));  
  23.                               } else {  
  24.                                         date = options.expires;  
  25.                               }  
  26.                               expires = '; expires=' + date.toUTCString();  
  27.                     }  
  28.                     var path = options.path ? '; path=' + (options.path) : '';  
  29.                     var domain = options.domain ? '; domain=' + (options.domain) : '';  
  30.                     var secure = options.secure ? '; secure' : '';  
  31.                     document.cookie = [name, '=', encodeURIComponent(value), expires, path, domain, secure].join('');  
  32.           } else {  
  33.                     var cookieValue = null;  
  34.                     if (document.cookie && document.cookie != '') {  
  35.                               var cookies = document.cookie.split(';');  
  36.                               for (var i = 0; i < cookies.length; i++) {  
  37.                                         var cookie = trim(cookies[i]);  
  38.                                         if (cookie.substring(0, name.length + 1) == (name + '=')) {  
  39.                                                   cookieValue = decodeURIComponent(cookie.substring(name.length + 1));  
  40.                                                   break;  
  41.                                         }  
  42.                               }  
  43.                     }  
  44.                     return cookieValue;  
  45.           }  
  46. };  


2.关于一个可以查看js对象的js函数,很酷的方法: 
Js代码 
  1. /** 
  2.  * 用来查看一个对象的属性 
  3.  */  
  4. function debugObjectInfo(obj){  
  5.         traceObject(obj);  
  6.           
  7.         function traceObject(obj){   
  8.                 var str = '';  
  9.                 if(obj.tagName&&obj.name&&obj.id)  
  10.                 str="<table border='1' width='100%'><tr><td colspan='2' bgcolor='#ffff99'>traceObject   tag: &lt;"+obj.tagName+"&gt;   name = \""+obj.name+"\"   id = \""+obj.id+"\" </td></tr>";   
  11.                 else{  
  12.                         str="<table border='1' width='100%'>";   
  13.                 }  
  14.                 var key=[];   
  15.                 for(var i in obj){   
  16.                         key.push(i);   
  17.                 }   
  18.                 key.sort();   
  19.                 for(var i=0;i<key.length;i++){   
  20.                         var v= new String(obj[key[i]]).replace(/</g,"&lt;").replace(/>/g,"&gt;");   
  21.                         str+="<tr><td valign='top'>"+key[i]+"</td><td>"+v+"</td></tr>";   
  22.                 }   
  23.                 str=str+"</table>";   
  24.                 writeMsg(str);   
  25.         }   
  26.         function trace(v){   
  27.                 var str="<table border='1' width='100%'><tr><td bgcolor='#ffff99'>";   
  28.                 str+=String(v).replace(/</g,"&lt;").replace(/>/g,"&gt;");   
  29.                 str+="</td></tr></table>";   
  30.                 writeMsg(str);   
  31.         }   
  32.         function writeMsg(s){   
  33.                 traceWin=window.open("","traceWindow","height=600, width=800,scrollbars=yes");   
  34.                 traceWin.document.write(s);   
  35.         }   
  36. }  


3.正则表达式: 

g 代表全局匹配 
m 代表可以进行多行匹配 
i 代表不区分大小写匹配 
^ 匹配输入字符串的开始位置 
$ 匹配输入字符串的结束位置 
* 匹配前面的子表达式零次或多次. 等价于{0,} 
+ 匹配前面的子表达式一次或多次. 等价于{1,} 
? 匹配前面的子表达式零次或一次. 等价于[0,1} , 当该字符跟在任何一个其他限制符(*, +, ?, {n}, {n,}, {n,m}) 后面时,匹配模式是非贪婪的。非贪婪模式尽可能少的匹配所搜索的字符串,而默认的贪婪模式则尽可能多的匹配所搜索的字符串。例如,对于字符串 "oooo",'o+?' 将匹配单个 "o",而 'o+' 将匹配所有 'o'。 

\d 匹配一个数字字符. 等价于 [0-9] 
\D 匹配一个非数字符. 等价于 [^0-9] 
\w  ,等价于 "[A-Za-z0-9_]" 
\W 匹配任何非单词字符,等价于 "[^A-Za-z0-9]" 
\s 匹配任何空白字符, 包括空格 制表符 换页符 等等. 等价于[\f\n\r\t\v] 
\S 匹配任何非空白字符. 等价于 [^\f\r\n\t\v] 
\b 匹配一个单词边界,也就是指单词和空格间的位置。 
\B 匹配非单词边界。 

正则表达式常用js方法: 
Js代码 
  1. /** 
  2.  * 在源字符串中查找满足要求的子串.  
  3.  * @return {} 
  4.  */  
  5. function MatchDemo() {  
  6.     var r, re; // 声明变量。     
  7.     var s = "The rain in Spain falls mainly in the plain";  
  8.     re = new RegExp("ain""g"); // 创建正则表达式对象。     
  9.     r = s.match(re); // 在字符串 s 中查找匹配。     
  10.     return (r);  
  11. }  
  12.   
  13. /** 
  14.  * 返回在源字符串中的满足正则表达式的全部的字串和位置信息.  
  15.  */  
  16. function RegExpTest() {  
  17.     var ver = Number(ScriptEngineMajorVersion() + "."  
  18.             + ScriptEngineMinorVersion())  
  19.     var ans = '';  
  20.     if (ver >= 5.5) { // 测试 JScript 的版本。     
  21.         var src = "The rain in Spain falls mainly in the plain.";  
  22.         var re = /\w+/g; // 创建正则表达式模式。     
  23.         var arr;  
  24.         while ((arr = re.exec(src)) != null)  
  25.             ans += arr.index + "-" + arr.lastIndex + arr + "\t";  
  26.     } else {  
  27.         ans = "请使用 JScript 的更新版本";  
  28.     }  
  29.     return ans;  
  30. }  
  31.   
  32. /** 
  33.  * 对源字符串进行正则表达式检查,看是不是符合正则表达式.   
  34.  */  
  35. function TestDemo() {  
  36.     var s1;  
  37.     var source = "abcdefg";  
  38.     var regex = /\w+/g; // 创建正则表达式模式。    
  39.     if (regex.test(source))  
  40.         s1 = " contains ";  
  41.     else  
  42.         s1 = " does not contain ";  
  43.     return ("'" + source + "'" + s1 + "'" + regex.source + "'");  
  44. }  
  45.   
  46. /** 
  47.  * 在源字符串中查找正则表达式的字串.  
  48.  * @return {} 
  49.  */  
  50. function SearchDemo() {  
  51.     var r, re;  
  52.     var s = "The rain in Spain falls mainly in the plain.";  
  53.     re = /falls/i;  
  54.     r = s.search(re);  
  55.     return (r);  
  56. }  


4.很值得学习并要使用好的方法,call(): 
call([thisObj[,arg1[, arg2[, [,.argN]]]]]) 
参数 
thisObj 
可选项。将被用作当前对象的对象。 
arg1, arg2, , argN 
可选项。将被传递方法参数序列。 
说明 
call 方法可以用来代替另一个对象调用一个方法。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。 

简单的例子: 
Js代码 
  1. function add(a,b)  
  2. {  
  3.     alert(a+b);  
  4. }  
  5. function sub(a,b)  
  6. {  
  7.     alert(a-b);  
  8. }  
  9.   
  10. add.call(sub,3,1);   
  11. //这个例子中的意思就是用 add 来替换 sub,add.call(sub,3,1) == add(3,1) ,所以运行结果为:alert(4);  


稍微复杂的例子: 
Js代码 
  1. function Class1()  
  2. {  
  3.     this.name = "class1";  
  4.   
  5.     this.showNam = function()  
  6.     {  
  7.         alert(this.name);  
  8.     }  
  9. }  
  10.   
  11. function Class2()  
  12. {  
  13.     this.name = "class2";  
  14. }  
  15.   
  16. var c1 = new Class1();  
  17. var c2 = new Class2();  
  18.   
  19. c1.showNam.call(c2);  
  20. //call 的意思是把 c1 的方法放到c2上执行,原来c2是没有showNam() 方法,现在是把c1 的showNam()方法放到 c2 上来执行,所以this.name 应该是 class2,执行的结果就是 :alert("class2");  


多重继承的例子: 
Js代码 
  1. function Class10()  
  2. {  
  3.     this.showSub = function(a,b)  
  4.     {  
  5.         alert(a-b);  
  6.     }  
  7. }  
  8.   
  9. function Class11()  
  10. {  
  11.     this.showAdd = function(a,b)  
  12.     {  
  13.         alert(a+b);  
  14.     }  
  15. }  
  16.   
  17.   
  18. function Class2()  
  19. {  
  20.     Class10.call(this);  
  21.     Class11.call(this);  
  22. }  


5.apply函数: 
Function.apply(obj,args)方法能接收两个参数 
    obj:这个对象将代替Function类里this对象 
    args:这个是数组,它将作为参数传给Function(args-->arguments) 
实现类似call的继承的效果: 
Js代码 
  1. function Person(name,age){   //定义一个类,人类    
  2.     this.name=name;     //名字    
  3.     this.age=age;       //年龄   
  4.     this.sayhello=function(){alert("hello")};  
  5. }   
  6. function Print(){            //显示类的属性   
  7.     this.funcName="Print";   
  8.     this.show=function(){        
  9.         var msg=[];  
  10.         for(var key in this){   
  11.             if(typeof(this[key])!="function"){  
  12.                 msg.push([key,":",this[key]].join(""));  
  13.             }  
  14.         }   
  15.         alert(msg.join(" "));  
  16.     };  
  17. }   
  18. function Student(name,age,grade,school){    //学生类   
  19.     Person.apply(this,arguments);  
  20.     Print.apply(this,arguments);  
  21.     this.grade=grade;                //年级   
  22.     this.school=school;                 //学校   
  23. }   
  24. var p1=new Person("jake",10);  
  25. p1.sayhello();  
  26. var s1=new Student("tom",13,6,"清华小学");  
  27. s1.show();  
  28. s1.sayhello();  
  29. alert(s1.funcName);  


使用apply进行数组参数的函数的优化,很酷的方法: 
Js代码 
  1. Math.max后面可以接任意个参数,最后返回所有参数中的最大值。  
  2.   
  3. 比如   
  4. alert(Math.max(5,8))   //8  
  5. alert(Math.max(5,7,9,3,1,6))   //9  
  6.   
  7. 但是在很多情况下,我们需要找出数组中最大的元素。  
  8. var arr=[5,7,9,1]  
  9. alert(Math.max(arr))    // 这样却是不行的。一定要这样写  
  10.   
  11. function getMax(arr){  
  12.     var arrLen=arr.length;  
  13.     for(var i=0,ret=arr[0];i<arrLen;i++){  
  14.         ret=Math.max(ret,arr[i]);         
  15.     }  
  16.     return ret;  
  17. }  
  18.   
  19. 用 apply呢,看代码:  
  20. function getMax2(arr){  
  21.     return Math.max.apply(null,arr);  
  22. }  


下面是另外一个例子,用来合并两个数组: 
Js代码 
  1. 再比如数组的push方法。  
  2. var arr1=[1,3,4];  
  3. var arr2=[3,4,5];  
  4. 如果我们要把 arr2展开,然后一个一个追加到arr1中去,最后让arr1=[1,3,4,3,4,5]  
  5. arr1.push(arr2)显然是不行的。 因为这样做会得到[1,3,4,[3,4,5]]  
  6.   
  7. 我们只能用一个循环去一个一个的push(当然也可以用arr1.concat(arr2),但是concat方法并不改变arr1本身)  
  8. var arrLen=arr2.length  
  9. for(var i=0;i<arrLen;i++){  
  10.     arr1.push(arr2[i]);  
  11. }  

使用apply的话: 
Js代码 
  1. Array.prototype.push.apply(arr1,arr2)  
posted @ 2011-01-18 20:41  zhangh  阅读(197)  评论(1)    收藏  举报