1. ホーム
  2. javascript

[解決済み] Javascriptの関数スコープとホイスト

2023-01-04 07:55:44

質問

私はちょうど次のような素晴らしい記事を読みました。 JavaScript のスコープとホイスティング by Ben Cherry に関する素晴らしい記事を読みました。その中で、彼は次のような例を挙げています。

var a = 1;

function b() {
    a = 10;
    return;

    function a() {}
}
b();
alert(a);

上記のコードを使用すると、ブラウザは "1"を警告します。

なぜ"1"が返ってくるのか、まだよくわかりません。彼が言うことの中には、次のようなものが思い浮かびます。 関数宣言はすべて一番上に吊り上げられる。関数を使って変数をスコープすることができる。 まだ、私には理解できません。

どのように解決するのですか?

Function hoistingとは、関数をスコープの先頭に移動させることです。つまり

function b() {  
   a = 10;  
   return;  
   function a() {} 
} 

は、インタプリタによって次のように書き換えられます。

function b() {
  function a() {}
  a = 10;
  return;
}

変だろう?

また、この例では

function a() {}

と同じ振る舞いをします。

var a = function () {};


要するに、このコードはこうなっているわけです。

var a = 1;                 //defines "a" in global scope
function b() {  
   var a = function () {}; //defines "a" in local scope 
   a = 10;                 //overwrites local variable "a"
   return;      
}       
b();       
alert(a);                 //alerts global variable "a"