Heim > Web-Frontend > js-Tutorial > Vollständige Analyse von JavaScript-Variablen_Grundkenntnisse

Vollständige Analyse von JavaScript-Variablen_Grundkenntnisse

WBOY
Freigeben: 2016-05-16 15:45:08
Original
1182 Leute haben es durchsucht

Variablenbereich ist der Bereich im Programm, in dem die Variable definiert ist.
Schauen wir uns zunächst ein Beispiel an:

/* Code 1 */

var scope = "global ";
function checkScope() {
 var scope = "local ";
 function childCheck() {
  var scope = "childLocal ";
  document.write(scope);
 }
 function childUndefined() {
  document.write(scope);
  var scope;
 }
 function childOverride() {
  scope = "childOverride ";
  document.write(scope);
 }
 document.write(scope); //输出"local"
 childCheck();   //输出"childLocal"
 childUndefined();  //输出"undefined"
 childOverride();  //输出"childOverride"
 document.write(scope); //输出"childOverride"
}
checkScope();    //输出"local childLocal undefinedchildOverride childOverride"
document.write(scope);  //输出"global "
Nach dem Login kopieren

Globaler Geltungsbereich und lokaler Geltungsbereich
Globale Variablen haben einen globalen Gültigkeitsbereich und werden überall in Javascript definiert. Variablen, die innerhalb einer Funktion deklariert werden, sind lokale Variablen und ihr Gültigkeitsbereich ist lokal und wird nur innerhalb des Funktionskörpers definiert. Die folgende Ausgabe sollte die Leser nicht überraschen.
/* Code 2 */

var scope = "global";
function checkScope() {
 var scope = "local";
 document.write(scope);
}
checkScope();   //输出"local"
document.write(scope); //输出"global"
Nach dem Login kopieren

Sie können Variablen im globalen Variablenbereich ohne die var-Anweisung verwenden, müssen jedoch die var-Anweisung verwenden, wenn Sie lokale Variablen deklarieren, da sie sonst als Verweis auf die globale Variable betrachtet werden. Schauen Sie sich den folgenden Code an:
/* Code 3 */

var scope = "global";
function checkScope() {
 scope = "local";
 document.write(scope);
}
checkScope();   //输出"local"
document.write(scope); //输出"local"
Nach dem Login kopieren

Kein Blockbereich
Javascript hat keinen Gültigkeitsbereich auf Blockebene und in einer Funktion deklarierte Variablen werden in der gesamten Funktion definiert. Der folgende Code könnte für unbekannte Leser überraschend sein:
/* Code 4 */

var scope = "global";
function checkScope() {
 document.write(scope); //语句4.1
 var scope = "local"; //语句4.2
 document.write(scope);
}
checkScope();   //输出"undefinedlocal"
Nach dem Login kopieren

Da die in Anweisung 4.1 (var Scope = „local“;) deklarierten Variablen innerhalb des gesamten checkScope-Funktionsbereichs gültig sind, bezieht sich der Bereich bei Ausführung von Anweisung 4.2 (document.write(scope);) auf lokale Variablen. Zu diesem Zeitpunkt ist der lokale Variablenbereich noch nicht definiert, daher wird „undefiniert“ ausgegeben. Daher besteht eine gute Programmierpraxis darin, alle Variablendeklarationen am Anfang der Funktion zu gruppieren.

Nachdem die Leser den obigen Inhalt verstanden haben, sollten sie nicht verwirrt sein, wenn sie sich Code 1 ansehen.
Attributvariablen des Objekts
Die Attributvariablen von Objekten sind relativ leicht zu verstehen. Leser, die sich den folgenden Code ansehen, sollten nicht verwirrt sein.
/* Code 5 */

var scope = "global ";
var obj = new Object();
obj.scope = "object ";
obj.checkScope = function () {
 var scope = "loacl ";
 document.write(scope);   //输出"loacl"
 document.write(this.scope);  //输出"object"
 document.write(window.scope); //输出"global"
}
obj.checkScope(); //输出"loacl object global"
Nach dem Login kopieren

Der sogenannte Bereich bezieht sich auf den gültigen Bereich dieser Variablen im Codeblock. Wenn Sie den JavaScript-Scoping nicht verstehen, kann es schwierig sein, Ihren Code zu debuggen.

Wenn Sie in einer Funktion var verwenden, um eine Variable zu deklarieren, ist der Gültigkeitsbereich der Variablen auf das Innere der Funktion beschränkt und Code außerhalb der Funktion kann nicht auf die Variable zugreifen. Wenn Sie innerhalb dieser Funktion eine Funktion deklarieren, kann die interne Funktion auch auf diese Variable zugreifen.

Umgekehrt ist der Gültigkeitsbereich dieser Variablen nicht auf diese Funktion beschränkt, wenn var beim Deklarieren einer Variablen nicht verwendet wird. Die JavaScript-Engine prüft, ob die Variable im globalen Bereich definiert wurde. Wenn die Variable nicht definiert wurde, wird sie als globale Variable definiert.

Funktionen können auf Variablen im gleichen Bereich zugreifen:

var foo = 'hello';

var sayHello = function() {
 console.log(foo);
};

sayHello();   // logs 'hello'
console.log(foo); // also logs 'hello'

Nach dem Login kopieren
Nach dem Login kopieren

Code außerhalb des Gültigkeitsbereichs der Variablen kann nicht auf die Variable zugreifen:

var sayHello = function() {
 var foo = 'hello';
 console.log(foo);
};

sayHello();   // logs 'hello'
console.log(foo); // doesn't log anything

Nach dem Login kopieren
Nach dem Login kopieren

Verwenden Sie im Gültigkeitsbereich keine Variablen mit demselben Namen, die aber unterschiedliche Werte haben:

var foo = 'world';

var sayHello = function() {
 var foo = 'hello';
 console.log(foo);
};

sayHello();   // logs 'hello'
console.log(foo); // logs 'world'

Nach dem Login kopieren
Nach dem Login kopieren

Nachdem die Funktion definiert ist, können Sie die Änderungen in den Variablenwerten in der Funktion sehen:

var myFunction = function() {
 var foo = 'hello';

 var myFn = function() {
  console.log(foo);
 };

 foo = 'world';

 return myFn;
};

var f = myFunction();
f(); // logs 'world' -- haha

Nach dem Login kopieren
Nach dem Login kopieren

Zielfernrohre traversieren auch – Abschlüsse

// 一个自执行的匿名函数
(function() {
 var baz = 1;
 var bim = function() { alert(baz); };
 bar = function() { alert(baz); };
})();

console.log(baz); // 在函数外面不能访问 baz

bar(); // 声明 bar 的时候并没有用 var
  // 所以 bar 是一个全局变量; 但是,
  // bar 和 baz 在相同的作用域内被定义,
  // 所以 bar 可以访问 baz
  // 其实 bar 是个闭包函数

bim(); // bim 的作用域只限于匿名函数内部,
  // 所以这里不能调用
Nach dem Login kopieren

Umfassend

Der sogenannte Bereich bezieht sich auf den gültigen Bereich dieser Variablen im Codeblock. Wenn Sie den JavaScript-Scoping nicht verstehen, kann es schwierig sein, Ihren Code zu debuggen.

Wenn Sie in einer Funktion var verwenden, um eine Variable zu deklarieren, ist der Gültigkeitsbereich der Variablen auf das Innere der Funktion beschränkt und Code außerhalb der Funktion kann nicht auf die Variable zugreifen. Wenn Sie innerhalb dieser Funktion eine Funktion deklarieren, kann die interne Funktion auch auf diese Variable zugreifen.

Umgekehrt ist der Gültigkeitsbereich dieser Variablen nicht auf diese Funktion beschränkt, wenn var beim Deklarieren einer Variablen nicht verwendet wird. Die JavaScript-Engine prüft, ob die Variable im globalen Bereich definiert wurde. Wenn die Variable nicht definiert wurde, wird sie als globale Variable definiert.

Funktionen können auf Variablen im gleichen Bereich zugreifen:

var foo = 'hello';

var sayHello = function() {
 console.log(foo);
};

sayHello();   // logs 'hello'
console.log(foo); // also logs 'hello'

Nach dem Login kopieren
Nach dem Login kopieren

Code außerhalb des Gültigkeitsbereichs der Variablen kann nicht auf die Variable zugreifen:

var sayHello = function() {
 var foo = 'hello';
 console.log(foo);
};

sayHello();   // logs 'hello'
console.log(foo); // doesn't log anything

Nach dem Login kopieren
Nach dem Login kopieren

Verwenden Sie im Gültigkeitsbereich keine Variablen mit demselben Namen, die aber unterschiedliche Werte haben:

var foo = 'world';

var sayHello = function() {
 var foo = 'hello';
 console.log(foo);
};

sayHello();   // logs 'hello'
console.log(foo); // logs 'world'

Nach dem Login kopieren
Nach dem Login kopieren

Nachdem die Funktion definiert ist, können Sie die Änderungen in den Variablenwerten in der Funktion sehen:

var myFunction = function() {
 var foo = 'hello';

 var myFn = function() {
  console.log(foo);
 };

 foo = 'world';

 return myFn;
};

var f = myFunction();
f(); // logs 'world' -- haha

Nach dem Login kopieren
Nach dem Login kopieren

Zielfernrohre traversieren auch – Abschlüsse

// 一个自执行的匿名函数
(function() {
 var baz = 1;
 var bim = function() { alert(baz); };
 bar = function() { alert(baz); };
})();

console.log(baz); // 在函数外面不能访问 baz

bar(); // 声明 bar 的时候并没有用 var
  // 所以 bar 是一个全局变量; 但是,
  // bar 和 baz 在相同的作用域内被定义,
  // 所以 bar 可以访问 baz
  // 其实 bar 是个闭包函数

bim(); // bim 的作用域只限于匿名函数内部,
  // 所以这里不能调用

Nach dem Login kopieren

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage