3.9笔记

Javascript异步编程的4种方法

一、回调函数

function f1(callback){
　　　　setTimeout(function () {
　　　　　　// f1的任务代码
　　　　　　callback();
　　　　}, 1000);
}
f1(f2)
//先执行f1的主要逻辑，将耗时的操作延迟执行

二、事件监听

f1.on('done', f2);
function f1(){
setTimeout(function () {
    　　　// f1的任务代码
　　　　　f1.trigger('done');
　　　}, 1000);
}

三、发布/订阅

jQuery.subscribe("done", f2);
function f1(){
　　　　setTimeout(function () {
　　　　　　// f1的任务代码
　　　　　　jQuery.publish("done");
　　　　}, 1000);
　　}

四、Promises对象

f1().then(f2);
function f1(){
　　　　var dfd = $.Deferred();
　　　　setTimeout(function () {
　　　　　　// f1的任务代码
　　　　　　dfd.resolve();
　　　　}, 500);
　　　　return dfd.promise;
　　}

mouseover和mouseenter的区别

• 不论鼠标指针穿过被选元素或其子元素，都会触发 mouseover 事件。
• 只有在鼠标指针穿过被选元素时，才会触发 mouseenter 事件。
• 注意冒泡！！！

mouseout和mouseleave的区别

• 不论鼠标指针离开被选元素还是任何子元素，都会触发 mouseout 事件。
• 只有在鼠标指针离开被选元素时，才会触发 mouseleave 事件。
  ## relatedTarget ##

getRelatedTarget: function (event) {
   if (event.relatedTarget) {
       return event.relatedTarget;
   } else if (event.toElement) {
       return event.toElement;
   } else if (event.fromElement) {
       return event.fromElement;
   } else {
       return null;
   }
}

浮点数加法

将浮点数转换成整数后再加

function floatMul(m,n,sum){
var _m=m.split('.')
var _n=n.split('.')
var maxFloatNum=Math.max(parseInt(_m[1].length),parseInt(_n[1].length))
console.log(maxFloatNum)
var multiple=(parseFloat(m)*Math.pow(10,maxFloatNum)+parseFloat(n)*Math.pow(10,maxFloatNum))/Math.pow(10,maxFloatNum)
return multiple.toFixed(sum)
    }

cookie封装的方法

(function(global){
11     //获取cookie对象，以对象表示
12     function getCookiesObj(){
13         var cookies = {};
14         if(document.cookie){
15             var objs = document.cookie.split('; ');
16             for(var i in objs){
17                 var index = objs[i].indexOf('='),
18                     name = objs[i].substr(0, index),
19                     value = objs[i].substr(index + 1, objs[i].length);    
20                 cookies[name] = value;
21             }
22         }
23         return cookies;
24     }
25     //设置cookie
26     function set(name, value, opts){
27         //opts maxAge, path, domain, secure
28         if(name && value){
29             var cookie = encodeURIComponent(name) + '=' + encodeURIComponent(value);
30             //可选参数
31             if(opts){
32                 if(opts.maxAge){
33                     cookie += '; max-age=' + opts.maxAge; 
34                 }
35                 if(opts.path){
36                     cookie += '; path=' + opts.path;
37                 }
38                 if(opts.domain){
39                     cookie += '; domain=' + opts.domain;
40                 }
41                 if(opts.secure){
42                     cookie += '; secure';
43                 }
44             }
45             document.cookie = cookie;
46             return cookie;
47         }else{
48             return '';
49         }
50     }
51     //获取cookie
52     function get(name){
53         return decodeURIComponent(getCookiesObj()[name]) || null;
54     }
55     
56     //清除某个cookie
57     function remove(name){
58         if(getCookiesObj()[name]){
59             document.cookie = name + '=; max-age=0';
60         }
61     }
62     
63     //清除所有cookie
64     function clear(){
65         var cookies = getCookiesObj();
66         for(var key in cookies){
67             document.cookie = key + '=; max-age=0';
68         }
69     }
70     //获取所有cookies
71     function getCookies(name){
72         return getCookiesObj();
73     }
74     //解决冲突
75     function noConflict(name){
76         if(name && typeof name === 'string'){
77             if(name && window['cookie']){
78                 window[name] = window['cookie'];
79                 delete window['cookie'];
80                 return window[name];
81             }
82         }else{
83             return window['cookie'];
84             delete window['cookie'];
85         }
86     }
87     global['cookie'] = {
88         'getCookies': getCookies,
89         'set': set,
90         'get': get,
91         'remove': remove,
92         'clear': clear,
93         'noConflict': noConflict
94     };
95 })(window);

原生ajax

function createXHR(){
    if(typeof XMLHttpRequest!='undefined'){
        return new XMLHttpRequest()
    }else if(typeof ActiveXObject!='undefined'){
        var versions=['MSXML2.XMLHttp.6.0','MSXML2.XMLHttp.3.0','MSXML2.XMLHttp'],i,len
        for(var i=0,len=versions.length;i<len;i++){
            try{
                new ActiveXObject(versions[i])
                arguments.callee.activeXString=versions[i]
                break;
            }catch(e){

            }
        }
        return new ActiveXObject(arguments.callee.activeXString)
    }else{
        throw new Error('no xhr object available')
    }
}
var xhr=createXHR()
xhr.onreadyStateChange=function(){
    if(xhr.readyState==4){
        if(xhr.status>=200&&xhr.status<300||xhr.status=304){
            alert(response.text)
        }else{
            alert('request was unsuccessful'+xhr.status)
        }
    }
}
xhr.open('get','example',true)
xhr.setRuquestHeader('myHeader','myValue')
xhr.send(null)