您的位置：首页 > Web前端 > JavaScript

JavaScript 基础（004_作用域）

2016-09-18 10:40 260 查看

JavaScript 作用域：在 JavaScript 中，作用域为可访问变量、对象以及函数的集合。JavaScript has function scope: The scope changes inside functions.

JavaScript 局部作用域：在函数体内声明的变量，它的作用域为局部作用域。

示例代码：

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JavaScript Scope</title>
<script type="text/javascript">
// 局部作用域
function myFunction() {
var carName = "Volvo";
}

myFunction();

console.log(carName); // carName变量为局部作用域，只在函数体内是可访问的，因此，本行代码会报错：carName is not defined
</script>
</head>
<body>
<div class="content">
<pre>
// 局部作用域
function myFunction() {
var carName = "Volvo";
}

myFunction();

console.log(carName);
</pre>
</div>
</body>
</html>

JavaScript 全局作用域：在函数体外声明的变量，它的作用域为全局作用域。如果变量在函数体内没有声明（没有使用 var 关键字），该变量的作用域为全局作用域。

示例代码：

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JavaScript Scope</title>
<script type="text/javascript">
// 全局作用域
// var carName = "Volvo";
function myFunction() {
carName = "Volvo"; // 全局作用域（没有使用var关键字）
}

myFunction();

console.log(carName);
</script>
</head>
<body>
<div class="content">
<pre>
// 全局作用域
// var carName = "Volvo";
function myFunction() {
carName = "Volvo"; // 全局作用域（没有使用var关键字）
}

myFunction();

console.log(carName);
</pre>
</div>
</body>
</html>

Did You Know ?

Your global variables (or functions) can overwrite window variables (or functions).

Any function, including the window object, can overwrite your global variables and functions.

示例代码：

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JavaScript Scope</title>
<script type="text/javascript">
// 全局作用域
console.log(content); // content为Window对象的属性
</script>
</head>
<body>
<div class="content">
<pre>
// 全局作用域
console.log(content); // content为Window对象的属性
</pre>
</div>
</body>
</html>

现在，我们修改以上代码：

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JavaScript Scope</title>
<script type="text/javascript">
// 全局作用域
var content = "";
console.log(content); // content为Window对象的属性，即window.content
</script>
</head>
<body>
<div class="content">
<pre>
// 全局作用域
var content = "";
console.log(content); // content为Window对象的属性
</pre>
</div>
</body>
</html>

通过以上代码修改前后的执行结果可以看出，我们自定义的 content 变量重写了 window.content 属性（使用 Firefox 浏览器测试）。

参考网址：

http://w3schools.bootcss.com/js/js_scope.html

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： javascript

相关文章推荐

新的分享

章节导航