javascript基础知识大全(2)

 javascript基础知识大全(2)

1.关于cookie的函数：

    /**

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

 

2.关于一个可以查看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: <"+obj.tagName+">　　 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,"<").replace(/>/g,">");
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,"<").replace(/>/g,">");
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方法：

复制代码运行代码

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. }
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. }
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. }
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 指定的新对象。

简单的例子：

 

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

 

稍微复杂的例子：

 

1. function Class1()
2. {
3.     this.name = "class1";
5.     this.showNam = function()
6.     {
7.         alert(this.name);
8.     }
9. }
11. function Class2()
12. {
13.     this.name = "class2";
14. }
16. var c1 = new Class1();
17. var c2 = new Class2();
19. c1.showNam.call(c2);
20. //call 的意思是把 c1 的方法放到c2上执行，原来c2是没有showNam() 方法，现在是把c1 的showNam()方法放到 c2 上来执行，所以this.name 应该是 class2，执行的结果就是 ：alert（"class2"）;

 

多重继承的例子：

1. function Class10()
2. {
3.     this.showSub = function(a,b)
4.     {
5.         alert(a-b);
6.     }
7. }
9. function Class11()
10. {
11.     this.showAdd = function(a,b)
12.     {
13.         alert(a+b);
14.     }
15. }
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的继承的效果：

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);

复制代码运行代码

Powered by W3Cfuns.com

使用apply进行数组参数的函数的优化，很酷的方法：

复制代码运行代码

1. Math.max后面可以接任意个参数，最后返回所有参数中的最大值。
3. 比如
4. alert(Math.max(5,8))   //8
5. alert(Math.max(5,7,9,3,1,6))   //9
7. 但是在很多情况下，我们需要找出数组中最大的元素。
8. var arr=[5,7,9,1]
9. alert(Math.max(arr))    // 这样却是不行的。一定要这样写
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. }
19. 用 apply呢，看代码：
20. function getMax2(arr){
21.     return Math.max.apply(null,arr);
22. }

复制代码运行代码

Powered by W3Cfuns.com

下面是另外一个例子，用来合并两个数组：

复制代码运行代码

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]]
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的话：

1. Array.prototype.push.apply(arr1,arr2)