JavaScriptのパラメータの受け渡しとsetTimeout関数、setInterval関数の呼び出し

JavaScriptのパラメータの受け渡しとsetTimeout関数、setInterval関数の呼び出し_基礎知識

WBOY

リリース： 2016-05-16 15:11:06

オリジナル

1300 人が閲覧しました

setTimeout と setInterval にパラメータを渡す方法
次のコードを見てください:

var str = 'aaa'; 
var num = 2; 
function auto(num){ 
  alert(num); 
} 
setTimeout('auto(num)',4000);

ログイン後にコピー

このように書くと正常に動作しますが、これはパラメータの受け渡しと言うより、直接使用されるグローバル変数と言った方が適切です。したがって、通常はローカル変数をパラメータとして渡します。

コードを変更します:

//var str = 'aaa'; 
var num = 2; 
function test(){ 
  var str = 'bbb'; 
  setTimeout('auto(str)',4000); 
} 
function auto(a){ 
  alert(a); 
} 
test();

ログイン後にコピー

この書き方では str のグローバル宣言のコメントを解除するとエラーが報告され、 aaa が出力されます。つまり、関数は引き続きグローバル変数を呼び出します。
以下のコードを見てください:

//var str = 'aaa'; 
var num = 2; 
function test(){ 
  var str = 'bbb'; 
  setTimeout('auto("str")',4000); 
} 
function auto(a){ 
  alert(a); 
} 
test();

ログイン後にコピー

上記の str に注意してください。このように書くと「str」が出力されます。これは、タイマーが関数を呼び出した後、str がパラメーターとして直接使用されることを意味します。この方法で渡されるパラメータは常に文字列です。これは私たちが望む結果ではありません。

文字列以外のパラメータを渡すには、クロージャを使用できます。次のコードを参照してください:

//var str = 'aaa'; 
var num = 2; 
function test(){ 
  var str = 'bbb'; 
  setTimeout(auto(str),4000); 
} 
function auto(str){ 
  return function(){ 
    alert(str); 
  } 
} 
test();

ログイン後にコピー

出力結果は「bbb」です。 auto(str) に引用符を追加すると、エラーも報告されます。
もちろん、次のように書くのも良いです:

var num = 2; 
function test(){ 
  var str = 'bbb'; 
  //setTimeout(auto(str),4000); 
  setTimeout(function(){alert(str)},4000); 
} 
function auto(str){ 
  return function(){ 
    alert(str); 
  } 
} 
test();

ログイン後にコピー

最後に注意すべきことは、パラメーターを渡すためにクロージャーを使用しない場合、タイマーによって呼び出される関数を引用符で囲む必要があることです。引用符を追加しないと、エラーが報告されます。上記の状況は setInterval()

にも適しています。

setTimeout および setInterval での関数呼び出し
には次のコードがあります:

var num = 2; 
function auto(){ 
  alert(num); 
} 
setTimeout(auto(),4000);

ログイン後にコピー

このプログラムでは、テスト時にすぐにポップアップ警告ボックスが表示されます。つまり、上記の方法で関数を参照した場合、タイマーは動作しません。

同様に、上記の setInterval の書き込みメソッドは、プログラムが警告ボックスを一度だけポップアップ表示して、その後エラーを報告することができます。
タイマーを

に変更します

setInterval('auto()',4000); 
setTimeout('auto()',4000);

ログイン後にコピー

プログラムは正常に動作します。

auto() を使用せずに auto のみを使用して関数を呼び出すと、どうなるでしょうか?

var str = 'aaa'; 
var num = 2; 
function auto(){ 
  alert(num); 
} 
//setInterval(auto,4000); 
setTimeout(auto,4000);

ログイン後にコピー

この方法で作成されたプログラムはすべて正常に動作します。

自動に引用符を追加する場合

//setInterval('auto',4000); 
setTimeout('auto',4000);

ログイン後にコピー

どちらも正しく動作しません。