作用域是可访问变量的集合.
在 JavaScript 中, 对象和函数同样也是变量.
在 JavaScript 中, 作用域可访问变量, 对象, 函数的集合.
作用域在函数内可以修改.
JavaScript 局部作用域
变量在函数内声明, 变量为局部变量(局部作用域)
局部变量: 只能在函数内部访问.
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="UTF-8">
- <title>Insert title here</title>
- </head>
- <body>
- <button onclick="myFunction(1,2)">试一试</button>
- <p id="demo"></p>
- </body>
- <script type="text/javascript">
- function name() {
- // 在此处声明一个变量
- var a = 10;
- // 函数内可以调用 a
- }
- // 此处 (函数外) 不能调用变量 a
- // 因为局部变量只作用于函数内, 所以不同的函数可以使用相同名称的变量名
- // 局部变量在函数开始执行时创建, 函数执行完毕后, 变量会自动销毁
- </script>
- </html>
JavaScript 全局变量
变量在函数外定义, 即为全局变量.
全局变量有全局作用域, 网页中所有脚本和函数都可使用.
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="UTF-8">
- <title>Insert title here</title>
- </head>
- <body>
- <button onclick="myFunction(1,2)">试一试</button>
- <p id="demo"></p>
- </body>
- <script type="text/javascript">
- /* 在此处声明一个全局变量 */
- var a = 10;
- function name() {
- // 函数内可以调用 a
- }
- // 此处也能调用变量 a
- </script>
- </html>
如果变量在函数内没有声明 (没有使用 var 关键字声明) 改变量为全局变量.
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="UTF-8">
- <title>Insert title here</title>
- </head>
- <body>
- <button onclick="myFunction(1,2)">试一试</button>
- <p id="demo"></p>
- </body>
- <script type="text/javascript">
- function name() {
- /* 在此处声明一个变量 */
- a = 10;
- /* a 没有使用 var 关键字声明, 则默认为全局变量 */
- }
- </script>
- </html>
JavaScript 变量生命周期
变量的生命周期在它的声明时初始化. 局部变量在函数执行完毕后销毁. 全局变量在页面关闭后销毁.
函数参数
函数参数只在函数内起作用, 是局部变量.
HTML 中的全局 变量
在 HTML 中, 全局变量是 window 对象, 所有数据变量都属于 window 对象.
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="UTF-8">
- <title>Insert title here</title>
- </head>
- <body>
- <button onclick="myFunction(1,2)">试一试</button>
- <p id="demo"></p>
- </body>
- <script type="text/javascript">
- function name() {
- a = 10;
- }
- // 此处可使用 window.a 调用变量 a
- </script>
- </html>
全局变量或者函数可以覆盖 window 对象的变量或者函数. 局部变量包括 window 对象, 可以覆盖全局变量和函数.
在 es6 中提供了 let 关键字和 const 关键字
let 的声明方式与 var 相同, 用 let 来代替 var 声明变量, 就可以把当前变量限制在代码块中.
使用 const 声明的是常量, 其值一旦被设置便不可被更改.
------------------------ end -----------------------