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. }
  12. /**
  13. * 返回在源字符串中的满足正则表达式的全部的字串和位置信息.
  14. */
  15. function RegExpTest() {
  16.         var ver = Number(ScriptEngineMajorVersion() + "."
  17.                         + ScriptEngineMinorVersion())
  18.         var ans = '';
  19.         if (ver >= 5.5) { // 测试 JScript 的版本。   
  20.                 var src = "The rain in Spain falls mainly in the plain.";
  21.                 var re = /\w+/g; // 创建正则表达式模式。   
  22.                 var arr;
  23.                 while ((arr = re.exec(src)) != null)
  24.                         ans += arr.index + "-" + arr.lastIndex + arr + "\t";
  25.         } else {
  26.                 ans = "请使用 JScript 的更新版本";
  27.         }
  28.         return ans;
  29. }
  30. /**
  31. * 对源字符串进行正则表达式检查,看是不是符合正则表达式.  
  32. */
  33. function TestDemo() {
  34.         var s1;
  35.         var source = "abcdefg";
  36.         var regex = /\w+/g; // 创建正则表达式模式。  
  37.         if (regex.test(source))
  38.                 s1 = " contains ";
  39.         else
  40.                 s1 = " does not contain ";
  41.         return ("'" + source + "'" + s1 + "'" + regex.source + "'");
  42. }
  43. /**
  44. * 在源字符串中查找正则表达式的字串.
  45. * @return {}
  46. */
  47. function SearchDemo() {
  48.         var r, re;
  49.         var s = "The rain in Spain falls mainly in the plain.";
  50.         re = /falls/i;
  51.         r = s.search(re);
  52.         return (r);
  53. }
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. }
  9. add.call(sub,3,1);
  10. //这个例子中的意思就是用 add 来替换 sub,add.call(sub,3,1) == add(3,1) ,所以运行结果为:alert(4);
 

稍微复杂的例子:
 
  1. function Class1()
  2. {
  3.     this.name = "class1";
  4.     this.showNam = function()
  5.     {
  6.         alert(this.name);
  7.     }
  8. }
  9. function Class2()
  10. {
  11.     this.name = "class2";
  12. }
  13. var c1 = new Class1();
  14. var c2 = new Class2();
  15. c1.showNam.call(c2);
  16. //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. }
  8. function Class11()
  9. {
  10.     this.showAdd = function(a,b)
  11.     {
  12.         alert(a+b);
  13.     }
  14. }
  15. function Class2()
  16. {
  17.     Class10.call(this);
  18.     Class11.call(this);
  19. }
 

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


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

下面是另外一个例子,用来合并两个数组:
  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. 我们只能用一个循环去一个一个的push(当然也可以用arr1.concat(arr2),但是concat方法并不改变arr1本身)
  7. var arrLen=arr2.length
  8. for(var i=0;i<arrLen;i++){
  9.     arr1.push(arr2[i]);
  10. }
使用apply的话:
  1. Array.prototype.push.apply(arr1,arr2)

 

原文地址:https://www.cnblogs.com/leejersey/p/2294890.html