ホームページ >ウェブフロントエンド >jsチュートリアル >javascript_javascriptスキルでローカル変数とグローバル変数の違いを詳しく解説

javascript_javascriptスキルでローカル変数とグローバル変数の違いを詳しく解説

WBOY
WBOYオリジナル
2016-05-16 16:12:441901ブラウズ

JavaScript には、ローカル変数とグローバル変数の 2 種類の変数があります。もちろん、私たちの記事は、これら 2 つの変数を正確に区別できるようにすることを目的としています。

まず第一に、ローカル変数は、この変数が宣言されている関数内でのみ呼び出すことができます。グローバル変数は、コード全体で呼び出すことができる変数です。もちろん、文字通りに理解するのは決して明確ではありません。以下に詳しく紹介します。
ご存知のとおり、変数は var キーワードを使用して宣言する必要があります。ただし、変数は JavaScript で暗黙的に使用することもできます。つまり、変数を宣言せずに直接使用することもできます。さらに、JavaScript は常に暗黙的に宣言された変数をグローバル変数として使用することに注意してください。
例:

コードをコピーします コードは次のとおりです:

function myName() {
i = '元建航';
}
myName();
関数sayName() {
アラート(i);
}
SayName();

出力結果は次のとおりです:yuanjianhang

上記のコードを次のように変更すると、変数 i がグローバル変数であることがわかります。

コードをコピーします コードは次のとおりです:
function myName() {
var i='元建航';
}
myName();
関数sayName() {
アラート(i);
}
SayName();

この時点では、ブラウザには出力結果はありません。i は関数 myName で定義されているため、myName のローカル変数にすぎず、外部から呼び出すことはできません。


ここで次のコードを見てください:

コードをコピーします コードは次のとおりです:
function myName() {
i = '元建航';
}
myName();
関数sayName() {
アラート(i);
}
SayName();

次に、いくつかの変更を加えて myName(); を削除しましょう。コードは次のとおりです。

コードをコピーします コードは次のとおりです:
function myName() {
i = '元建航';
}
関数sayName() {
アラート(i);
}
SayName();

現時点では、ブラウザは応答しません。 i はグローバル変数ですが、関数 myName() は呼び出されていないため、i を宣言しても i に値を代入しないことと同等であるため、出力はありません。

同様に、上記の例を次のように変更すると、


コードをコピー コードは次のとおりです:
function myName() {

i = '元建航';
}
関数sayName() {
アラート(i);
}
SayName();
myName();

この場合、結果は出力されません。sayName() 関数が呼び出されるとき、関数 myName の値がチェックされます。まだ実行されていない、つまり i にはまだ値が割り当てられていないため、結果は出力されません。


皆さんの理解を深めるために、別の例を示します:

コードをコピーします コードは次のとおりです:
var i = '元建航';
function myloveName() {
i = 'guanxi';
}
myloveName();
function myName() {
アラート(i);
}
myName();

今回の結果はどうなったでしょうか?

答えは guanxi
まず、i の元の値はyuanjianhang ですが、myloveName() 関数を呼び出した後、i の値は guanxi に変更されるため、最終的な出力結果は guanxi になります。

コードを次のように変更すると、

コードをコピーします コードは次のとおりです:
var i = '元建航';
function myloveName() {
var i = 'guanxi';
}
myloveName();
function myName() {
アラート(i);
}
myName();

このときの結果は、コード内の 2 つの i が異なり、1 つはグローバル、もう 1 つはローカルであるため、このように理解することもできます。同じ名前の人間が二人いるのと同じように、名前は同じでも同一人物ではありません。

コードを次のように変更すると、

コードをコピーします コードは次のとおりです:

var i = '元建航';
function myloveName() {
i = 'guanxi';
}
function myName() {
アラート(i);
}
myName();
myloveName();

結果は自分で計算できると思いますが、結果は元建行です。

グローバル変数は関数内で呼び出すことができるので、次のような場合はどうでしょうか:

コードをコピーします コードは次のとおりです:

var i = '元建航';
function myloveName() {
i = 'guanxi';
アラート(i);
}
myloveName();

このときの変数の値はいくらでしょうか?

分析してみましょう:

まず、グローバル変数 i に値、yuanjianhang が割り当てられます。

次に、myloveName() 関数が呼び出され、グローバル変数 i に新しい値 guanxi が再割り当てされます。

したがって、結果は次のようになります: guanxi。

次のようにアラートを進めてみるとどうなるでしょうか:

コードをコピーします コードは次のとおりです:

var i = '元建航';
function myloveName() {
アラート(i);
i = 'guanxi';
}
myloveName();

現時点での結果はどうなっているでしょうか?
検証結果は次のとおりです: 未定義
コードが次のような場合はどうなるでしょうか:

コードをコピーします コードは次のとおりです:

var i = '元建航';
function myloveName() {
アラート(i);
}
myloveName();

この時点での i の結果は次のとおりです: yuanjianhang

上記の未定義の状況はなぜ発生するのでしょうか? コードの実行順序は上から下であり、i が出力される前に i が定義されていないためです。ここから、コードを使用する場合、同様の問題を避けるために変数の宣言をコードの先頭に配置する必要があることがわかります。

同様に:

コードをコピーします コードは次のとおりです:

var i = '元建航';
function myloveName() {
アラート(i);
var i = 'guanxi';

}
myloveName();

この場合、次の出力も行われます: unknown

変数についてはこれだけしか説明しませんでしたので、誰でも理解できると思います。コードがどのようにコピーされても、そのコアは変わりません。

上記がこの記事の全内容です。JavaScript のローカル変数とグローバル変数の違いについてはさらに深く理解できましたか? 新年明けましておめでとうございます。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。