settimeout的執行函數作用域問題

今天在做一個項目的時候,遇到了一個小問題,可把我糾結了半天,問題如下:

Base.prototype.move_over=function(arr,_time){
    for(var i=0;i<this.elements.length;i++){
    var _this=this;
    var _thisElements=this.elements[i];
    _thisElements.οnmοuseοver=function(){
            action();
            var next=0;
            function action(){
            if(next<arr.length){
                _this.css('backgroundImage','url('+arr[next]+')')
                next++;
            }
            alert(this);
            setTimeout('action()',_time);
            
            
            }
        
        }
    }
    return this;
    }

我是寫了一個setTimeout函數來執行action()函數,以達到圖片更換的目的,但是發現控制檯action報錯not defined,搞得我一頭霧水,難道action函數不能被執行嗎?

想了半天終於想通了原因,原來是因爲setTimeout執行過後,作用域已經變成了window,而不是依然在函數內部執行,而setTimeout的延遲是在後臺被掛起運行,等到延遲一到,再執行的環境就是window了,然後執行的時候就在window下尋找可以執行的函數action(),未找到便出現了這樣報錯的結果。那麼怎麼去解決這一事情呢。

steTimeout函數機制就是用eval執行第一個參數'action()"字符串,既然action()字符串不存在,那麼我把它換成了一個對象action進行測試,更換代碼如下:

setTimeout(action,_time)

運行,測試成功。

發佈了36 篇原創文章 · 獲贊 30 · 訪問量 8萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章