JavaScriptのスコープ


スコープでアクセス可能な変数のコレクション。

JavaScript スコープ

JavaScript では、オブジェクトと関数も変数です。

JavaScript では、スコープはアクセス可能な変数、オブジェクト、関数のコレクションです。

JavaScript 関数のスコープ: スコープは関数内で変更されます。

JavaScript ローカル スコープ

変数は関数内で宣言され、変数はローカル スコープになります。

ローカル変数: 関数内でのみアクセスできます。

インスタンス

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<p>局部变量在声明的函数内可以访问。</p>
<p id="demo"></p>
<script>
myFunction();
document.getElementById("demo").innerHTML =
	"我可以显示 " +  typeof carName;
function myFunction() 
{
    var carName = "Volvo";
}
</script>

</body>
</html>

インスタンスの実行 »

「インスタンスの実行」ボタンをクリックしてオンラインインスタンスを表示します

ローカル変数は関数内でのみ機能するため、異なる関数で同じ名前の変数を使用できます。

ローカル変数は関数の実行開始時に作成され、関数の実行後に自動的に破棄されます。

JavaScript グローバル変数

関数の外で定義された変数はグローバル変数です。

グローバル変数にはグローバル スコープがあります: Web ページ内のすべてのスクリプトと関数を使用できます。

インスタンス

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<p>全局变量在任何脚本和函数内均可访问。</p>
<p id="demo"></p>
<script>
var carName = "Volvo";
myFunction();
function myFunction() 
{
    document.getElementById("demo").innerHTML =
		"我可以显示 " + carName;
}
</script>

</body>
</html>

インスタンスの実行 »

「インスタンスの実行」ボタンをクリックしてオンラインインスタンスを表示します

関数内で変数が宣言されていない場合(varキーワードが使用されていない場合)、変数はグローバル変数です。

次の例では、carName は関数内にありますが、グローバル変数です。

インスタンス

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<p>
如果你的变量没有声明，它将自动成为全局变量：
</p>
<p id="demo"></p>
<script>
myFunction();
document.getElementById("demo").innerHTML =
	"我可以显示 " + carName;
function myFunction() 
{
    carName = "Volvo";
}
</script>

</body>
</html>

インスタンスの実行 »

「インスタンスの実行」ボタンをクリックしてオンラインインスタンスを表示します

JavaScript変数のライフサイクル

JavaScript変数のライフサイクルは、宣言時に初期化されます。

ローカル変数は関数の実行後に破棄されます。

グローバル変数はページが閉じられると破棄されます。

関数パラメータ

関数パラメータは関数内でのみ機能し、ローカル変数です。

HTML のグローバル変数

HTML では、グローバル変数はウィンドウ オブジェクトです。すべてのデータ変数はウィンドウ オブジェクトに属します。

インスタンス

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<p>
在 HTML 中, 所有全局变量都会成为 window 变量。
</p>
<p id="demo"></p>
<script>
myFunction();
document.getElementById("demo").innerHTML =
	"我可以显示 " + window.carName;
function myFunction() 
{
    carName = "Volvo";
}
</script>

</body>
</html>

インスタンスの実行»

オンラインインスタンスを表示するには、[インスタンスの実行]ボタンをクリックしてください

ご存知ですか?


Noteグローバル変数、または function は、ウィンドウ オブジェクトの変数または関数をオーバーライドできます。
ウィンドウ オブジェクトを含むローカル変数は、グローバル変数や関数をオーバーライドできます。