javascript：將函數分配爲回調函數和變量範圍

所以，這裏是交易。我使用的是一個onclick事件來觸發一個函數，所以每次點擊都會在div原始的innerHTML和另一個變量之間切換。當我將testfunction指定爲回調函數時，它可以工作。下面的代碼：javascript：將函數分配爲回調函數和變量範圍

var c = ''; 

function testfunction() 
{ 
    var a = this.innerHTML; 

    var b = 'blah'; 

    if (a !== b) 
    { 
     c = a; 
     return this.innerHTML = b; 
    } 
    else 
    { 
     return this.innerHTML = c; 
    } 

    window.onload = function() 
    { 
     document.getElementById('rightcontent').onclick = testfunction; 
    }

我瞭解，在C保留了它的價值，因爲它是全球範圍內。但我不明白的是爲什麼ç回來未定義當我把函數轉換成一個匿名的回調爲這樣：

windows.onload = function() 
    { 
    document.getElementById('rightcontent').onclick = function() 
    { 
     this.innerHTML = testfunction(); 
    } 
    }

沒有點任何的這個，我只是瞎搞。 ..但我想知道引擎蓋下發生了什麼。

對不起，如果這是其他地方，我已經通過一些帖子尋找我的答案，但我找不到它。

在此先感謝:-)

來源

2013-01-08 whosmav

搜索'[javascript] this scope'或類似。 – 2013-01-08 23:29:03

您是否在'testfunction'裏面設置'window.onload'？ –

@JustinMorgan：不，但我不知道爲什麼我應該或不應該。此外，我糾正了testfunction（），現在返回正確。 – whosmav

我瞭解，在C保留了它的價值，因爲它是全球範圍內。但我不明白的是爲什麼ç回來未定義當我把函數轉換成一個匿名的回調爲這樣：

在你的第二個片段，this不等於#rightcontent，它等於window。 window.innerHTML未定義，所以第一個分支在您的if/else區塊中。

c得到分配undefined，並且undefined被返回。

你可以調用的方法，並與call或apply指定一個特定的背景：

document.getElementById('rightcontent').onclick = function() { 
    this.innerHTML = testfunction.call(this); 
}

例子：http://jsfiddle.net/dySA5/

的原因，你的第一個片段不會出現此行爲是因爲瀏覽器在調用該方法時將this設置爲單擊的元素。

來源

2013-01-08 23:26:02

謝謝！我糾正了testfunction（）返回。幾件事情：testfunction（）的返回部分中的'this'是否也指向窗口？或者它已經移動到一旦被稱爲div的？有趣的是，當使用匿名回調方式時，您可以返回var，而不是this.innerHTML = var。這是爲什麼？此外，對於匿名回調，您可以使用返回this.innerHTML = var或只是返回= var，它會給出相同的結果......它應該是這樣嗎？ – whosmav

另外，當將testfunction（）分配給onclick時，我必須使用return this.innerHTML = var。 – whosmav

@whosmav：*當使用匿名回調方式時，您可以直接返回var，而不是this.innerHTML = var。爲什麼會這樣？*：因爲你在匿名回調中分配了返回值：'this.innerHTML = testfunction.call（this）;'。沒有什麼不可思議的，你只需要在不同的行上賦值。此外，FYI：http://www.quirksmode.org/js/this.html。 –

http://jsfiddle.net/2aDJS/4/

我清理和jQuerified你的榜樣，使之更容易一些閱讀：

var c = ''; 

function testfunction() { 
    console.log(this) 
    var a = this.innerHTML; 

    var b = 'blah'; 

    if (a !== b) { 
    c = a; 
    this.innerHTML = b; 
    } else { 
    this.innerHTML = c; 
    } 
} 

$(document).ready(function() { 
    $('#rightcontent').click(function() { 
    testfunction.call(this); 
    //testfunction(); 
    }); 

    //$('#rightcontent').click(testfunction); 
})

原因你看到內的函數調用被包裹在一個函數失敗是因爲當你這樣做時，範圍會發生變化。 this被解釋爲事件處理程序上的事件誘導元素。如果您在事件處理函數內部調用一個函數，並且希望它引用它，則this將保持不變，除非您使用function.call(scope)專門調用範圍。

來源

2013-01-08 23:48:49

javascript：將函數分配爲回調函數和變量範圍

回答

相關問題