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

    eval是一個函數,能夠接受一個參數,這個參數能夠做爲js語句被解釋性的執行,利用這個特性,eval和apply結合起來,能夠大大簡化代碼 
數組

     以下例子app

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

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

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

  若是直接實現功能的話,須要綁定三個click,或者是各類判斷,分別實現以下:對象

  直接實現                                                                                                                                                                                                    事件

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

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

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

  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.

相關文章
相關標籤/搜索