[英]Variable shadowing and testing for existence before assignment in javascript
In the following code snippet I declare a global variable and then check for its presence inside a function. 在下面的代码片段中,我声明了一个全局变量,然后检查它在函数内的存在。
<script>
x = 5;
$(function() {
var x = x || 3;
console.log(x); // prints 3
});
</script>
This behaves differently: 这表现不同:
<script>
x = 5;
$(function() {
var y = x || 3;
console.log(y); // prints 5
});
</script>
I expect that in the first example, the variable declaration in the inner scope will detect that x already exists in the global scope, and take its value. 我希望在第一个示例中,内部作用域中的变量声明将检测到x已经存在于全局作用域中,并获取其值。 Why does the first example 3?
为什么第一个例子3?
Specifically I recently wrote some code that checks var _gaq = _gaq || []
具体来说,我最近编写了一些检查
var _gaq = _gaq || []
代码 var _gaq = _gaq || []
in a jQuery ready scope and was confused when nothing was getting pubbed to Analytics. var _gaq = _gaq || []
在一个jQuery就绪范围内,当没有任何东西被发布到Analytics时就感到困惑。
You're looking for x
in the wrong scope. 您正在寻找错误范围内的
x
。 Due to variable hoisting, var x
has actually defined a local x
variable with a value of undefined
before your x || 3
由于变量提升,
var x
实际上在x || 3
之前定义了一个值为undefined
的局部x
变量 x || 3
check happens: x || 3
检查发生:
var x = x || 3;
is actually: 实际上是:
var x = undefined;
x = x || 3;
Simply change it to look for x
on the window
object: 只需更改它以在
window
对象上查找x
:
var x = window.x || 3;
The first example logs 3 because any variable that is initialized inside a function using the var keyword will have a local scope. If a variable is initialized inside a function without var, it will have a global scope.
第一个示例记录3,因为
any variable that is initialized inside a function using the var keyword will have a local scope. If a variable is initialized inside a function without var, it will have a global scope.
any variable that is initialized inside a function using the var keyword will have a local scope. If a variable is initialized inside a function without var, it will have a global scope.
So in the first case, when the local x
is assigned, since it is uninitialized, it gets assigned 3. 因此,在第一种情况下,当分配本地
x
时,由于它未初始化,因此它被分配3。
While in the second case, x
refers to the global variable x
as there is no declaration of x
inside the function. 而在第二种情况下,
x
指的是全局变量x
因为函数内部没有x
声明。
Instead, if you try this 相反,如果你试试这个
<script>
x = 5;
$(function() {
x = x || 3;
console.log(x);
});
</script>
OR 要么
<script>
x = 5;
$(function() {
var x = window.x || 3;
console.log(x);
});
</script>
you will get the expected result 5
. 你会得到预期的结果
5
。
Additionally, unlike C and its family (which has block-level scope ), JavaScript has function-level scope . 此外,与C及其系列(具有块级范围 )不同,JavaScript具有功能级范围 。 Blocks, such as if statements, do not create a new scope.
块(例如if语句)不会创建新范围。 Only functions create a new scope.
只有函数才能创建新范围。
So if I were to write something like 所以,如果我要写类似的东西
#include <stdio.h>
int main() {
int x = 1;
printf("%d, ", x); // 1
if (1) {
int x = 2;
printf("%d, ", x); // 2
}
printf("%d\n", x); // 1
}
OUTPUT: 1,2,1 输出: 1,2,1
as compared to 相比于
var x = 1;
console.log(x); // 1
if (true) {
var x = 2;
console.log(x); // 2
}
console.log(x); // 2
OUTPUT: 1,2,2 输出: 1,2,2
Go through this excellent blog post on JavaScript Scoping and Hoisting to understand it better. 阅读这篇关于JavaScript范围和提升的优秀博客文章,以便更好地理解它。
The var x
in the function declares x to be local to the function, so in x || 3
函数中的
var x
声明x是函数的局部函数,因此在x || 3
x || 3
x not the global x and thus is undefined since it hasn't been initialized. x || 3
x不是全局x,因此未定义,因为它尚未初始化。
In var y = x || 3;
在
var y = x || 3;
var y = x || 3;
x is the global x as there is no x local the function. x是全局x,因为没有x本地函数。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.