2016-10-27 10 views
3

明らかモジュールパターンの内側、外側の変数のミスマッチ

<html><body><button>setSpeed</button> 
 
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> 
 
<script> 
 

 
$(document).ready(function(){ 
 
    $('button').on('click', function(){ 
 
    _.setSpeed(); 
 
    console.log('_.slow: ' + _.slow); 
 
    }); 
 
}); 
 

 
var _ = (function(){ 
 
    var slow = 4; 
 
    
 
    function setSpeed(){ 
 
    if (slow == 4) { 
 
     slow = 1; 
 
    } else if (slow == 1){ 
 
     slow = 16; 
 
    } else { 
 
     slow = 4; 
 
    } 
 
    console.log('slow: '+ slow); 
 
    } 
 
    return { slow: slow, setSpeed: setSpeed }; 
 

 
})(); 
 

 
</script></body></html>

遅いと_.slowためにconsole.logが一致しない理由を私は理解していませんか?私は何が欠けていますか?

IIEFでvar slowとfunction setSpeedの両方を返すと、一致するはずです。

答えて

1

あなたがこれを行うと:

return { slow: slow, setSpeed: setSpeed }; 

次の2つのプロパティ、slowsetSpeedを持つ新しいオブジェクトを作成しています。 slowの値はvar slowから割り当てられます。これはプリミティブ型(参照値ではない)なので、slow(4)の現在の値のコピーが得られます。

setSpeedを呼び出すと、var slowが1に変更されます。これは_.slowには影響しません(参照ではないため)。

+0

ゆっくりと内部の値をチェックしたい場合は、ゲッター機能を追加してみてください。 'function getSlow(){ return slow; あなたの 'return'部分に' return {getSlow:getSlow、setSpeed:setSpeed}; " "のいずれかのgetter関数をバインドすることができます。 (https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Functions/get) –

関連する問題