javascript中apply和eval結合的強大用法

標籤：

    eval是一個函數，可以接受一個參數，這個參數可以作為js語句被解釋性的執行,利用這個特性，eval和apply結合起來，可以大大簡化代碼 

     如下例子

     <a class="click" data-click="first">firstClick<a>  //點擊後執行函數firstClick

     <a class="click" data-click="second">secondClick<a>//點擊後執行函數secondClick

     <a class="click" data-click="third">thirdClick<a>//點擊後執行thirdClick

　　如果直接實現功能的話，需要綁定三個click，或者是各種判斷，分別實現如下：

　　直接實現                                                                                                                                                                                                    

　　$("[data-click=first]").click(function(){firstClick($(this).text())});

　　$("[data-click=second]").click(function(){secondClick($(this).text())});

　　$("[data-click=third]").click(function(){thirdClick($(this).text())});

　　var firstClick=function(r){alert(r)}

　　var secondClick=function(r){alert(r)}

　　var thirdClick=function(r){alert(r)}

　　直接實現要綁定三次click事件，不好維護，如果click事件是10個，或者更多，這樣寫的話就太恐怖了

 

      判斷實現                                                                                                                                                                                                    

      $(".click").click(function(r){

       var _click=this.data("click");

　　 var _text=this.text();

       if(_click=="firstClick")

　　 {

 　　　　firstClick(_text);

　　 }

      else if(_click=="secondClick")

　　 {  

            secondClick(_text);

　 　}

      else

      {

　　　　thirdClick(_text);

      }});

　　var firstClick=function(r){alert(r)}

　　var secondClick=function(r){alert(r)}

　　var thirdClick=function(r){alert(r)}

      判斷data-click屬性來實現，雖然實現了，但是讓人感覺好噁心，那麼多次的判斷,更加難以維護。

 

　　apply結合eval實現                                                                                                                                                                                        

       $(".click").click(function(){

       var _click=$(this).data("click");

       var _text=$(this).text();

       var _func=eval(_click);

        _func.apply($(this),[_text]);

　　});

      apply 結合eval實現：eval直接將data-click值，定義為函數變數，再由這個變數來調用apply函數清晰易懂，但是這也不是絕對的，對於沒有掌握這個知識點的同學來說，實在是太痛苦了，因為根本看不懂，但是，這是js的基礎知識，也是很實用的知識，應該去掌握的，下面簡單介紹下eval函數和apply函數

  

 

      eval函數介紹：                                                                                                                                                                     

　　定義和用法

　　eval() 函數可計算某個字串，並執行其中的的 JavaScript 代碼。

　　文法

　　eval(string)

　　通過計算 string 得到的值（如果有的話）。傳回值

　　該方法只接受原始字串作為參數，如果 string 參數不是原始字串，那麼該方法將不作任何改變地返回。因此請不要為 eval() 函數傳遞 String 對象來作為參數。

　　如果試圖覆蓋 eval 屬性或把 eval() 方法賦予另一個屬性，並通過該屬性調用它，則 ECMAScript 實現允許拋出一個 EvalError 異常。

　　如果參數中沒有合法的運算式和語句，則拋出 SyntaxError 異常。

　　如果非法調用 eval()，則拋出 EvalError 異常。

　　如果傳遞給 eval() 的 Javascript 代碼產生了一個異常，eval() 將把該異常傳遞給調用者。

 

　　apply函數簡介                                                                                                                                                                      

　　apply很強大，知識點也很多，但是我認為，非常有用的東西也就是下面這些知識點

 

       Function.apply(obj,args)方法能接收兩個參數
　　 obj：這個對象將代替Function類裡this對象
　 　args：這個是數組，它將作為參數傳給Function（args-->arguments）

 這裡需要注意的是，args是個數組，但是Function中得參數是多個，他們和args是一一對應的，比方說args=[1,2,3],Function定義為 function(x)則調用時x的值為1，而不是[1,2,3]，若Function定義為function(x,y),則，x的值為1，y的值為2.

 

 

    

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

      

 

javascript中apply和eval結合的強大用法