js回調函數

js回調函數是個什麼鬼？

一直感受回調函數很牛逼的樣子，可是一直弄不懂他是什麼鬼？看了一本有一本**js書籍長篇大論也沒看懂。而後一陣百度以後，在一個哥們的博客裏發現了些似曾相識的東西，原來我以前已經寫過回調函數的例子了。

來看一個例子：

//函數裏的回調函數
function fun(call){
    //code
    if(call){//   判斷是否傳參
        call();// 調用call
    }
}

function cb(){
    console.log("調用了cd");
}

fun(cb);//結果：調用了cd"

函數傳參能夠傳函數名！！（沒有報錯）

網友說，這個例子就是回調函數！！！我去，我以前常常這樣寫，我覺得這是js存在的bug！

哦原諒個人年少無知，js真是神奇的語言！！

通過一番測試以後發現還有其餘的寫法：

//函數裏的回調函數
function fun(call){
    //code
    if(call){//   判斷是否傳參
        call();// 調用call
    }
}
fun(function(){
    //code
    console.log("執行了回調函數");
});//結果：執行了回調函數

是否是很像jquery裏的事件？（obj.onclick(function(){})；）

太愛js了，到此咱們知道了在函數裏回調函數的用法，那麼對象裏的有怎麼用呢？

不急，用法差很少的，應爲js是種神奇的語言，函數就是對象！

好的看我裝逼：

//在對象裏使用回調函數
function objtest(callback){
    //code
    if(callback){//判斷是否傳參
        callback();//調用callback回調函數
    }
}
//實例化對象
var obj=new objtest(function(){
    //code
    console.log("執行了回調函數");
});
//結果：執行了回調函數

固然，在對象成員方法裏回調也是同樣的：

//在對象裏使用回調函數
function objtest(){
    //code
    //成員方法
    this.test=function(callback){
        if(callback){//判斷是否傳參
            callback();//調用callback回調函數
        }
    }
    
}
//實例化對象
var obj=new objtest();

obj.test(funciton(){
     console.log("執行了回調函數");
});
//結果：執行了回調函數

恩，就這樣，是否是感受js很奇怪？

哦，對了，不判斷是否傳參的話，在實例化（執行函數）時，若是不作回調處理的話會報錯的

因此仍是判斷一下是否傳參。

回調函數有什麼用?

    對於這個問題，我只能說用到時天然有用，用不到時，即便再牛逼也是擺設！

恩，看看個人一個使用例子：

1. 監控div尺寸的對象(監控div尺寸的對象，當div寬高變化時自動調用回調函數，並傳回相應寬高)

//監控盒子resize對象
jQuery.fn.resize=function(call){
	var that=$(this);
	var on=null;
	var data={
		"width":that.width(),
		"height":that.height(),
	}
	on=setInterval(function(){
		if(that.height()!=data.height||that.width()!=data.width){//寬高有變化時執行
			data.width=that.width();
			data.height=that.height();
			if(call)
			    call(data);//回調
		}
	},100);//刷新時間100毫秒
}

2.拖拽文件，若是存在文件數據時回調

/*
*	拖拽文件對象 Object
*	new dorp(obj,calbackfunction);
*	copyright by bluemoon
*	1752295326@qq.com
*	2015-1-9 11:56
*/
function dorpFile(obj,callback){
		this.obj=obj;
		this.obj.addEventListener("dragover",function(event){//
		event.stopPropagation();
		event.preventDefault();
		event.dataTransfer.dropEffect = 'copy';
		/*
		*preventDefault()	通知瀏覽器不要執行與事件關聯的默認動做。
		*stopPropagation()	再也不派發事件。
		*/
		},false);
		
		this.obj.addEventListener("drop",function(event){//釋放拖拽觸發事件
			event.stopPropagation();
			event.preventDefault();
			callback(event.dataTransfer.files);//回調函數，返回FileList
		},false);
}

恩，對於上面的例子我也不知道是否符合標準，既然瀏覽器沒有報錯，那我以爲用用沒事。

對了，我有個問題：如何在對象裏自定義事件呢？好比,ajax裏的onload,onerror等事件。但願有這方面研究的朋友告訴下。

恩，謝謝。