看了很多解释,感觉还是这个说的最透彻。
转自 https://blog.csdn.net/hot_cool/article/details/78302673
首先,ECMAScript和JavaScript关系:
ECMAScript是一个国际通过的标准化脚本语言。JavaScript由ECMAScript和DOM、BOM三者组成。可以简单理解为:ECMAScript是JavaScript的语言规范,JavaScript是ECMAScript的实现和扩展。
1. 块作用域{ }
JS中作用域有:全局作用域、函数作用域。没有块作用域的概念。ECMAScript 6(简称ES6)中新增了块级作用域。
块作用域由 { } 包括,if语句和for语句里面的{ }也属于块作用域。
<script type="text/javascript"> { var a = 1; console.log(a); // 1 } console.log(a); // 1 // 可见,通过var定义的变量可以跨块作用域访问到。 (function A() { var b = 2; console.log(b); // 2 })(); // console.log(b); // 报错, // 可见,通过var定义的变量不能跨函数作用域访问到 if(true) { var c = 3; } console.log(c); // 3 for(var i = 0; i < 4; i ++) { var d = 5; }; console.log(i); // 4 (循环结束i已经是4,所以此处i为4) console.log(d); // 5 // if语句和for语句中用var定义的变量可以在外面访问到, // 可见,if语句和for语句属于块作用域,不属于函数作用域。 </script>
2. var、let、const的区别
- var定义的变量,没有块的概念,可以跨块访问, 不能跨函数访问。
- let定义的变量,只能在块作用域里访问,不能跨块访问,也不能跨函数访问。
- const用来定义常量,使用时必须初始化(即必须赋值),只能在块作用域里访问,而且不能修改。
<script type="text/javascript"> // 块作用域 { var a = 1; let b = 2; const c = 3; // c = 4; // 报错 var aa; let bb; // const cc; // 报错 console.log(a); // 1 console.log(b); // 2 console.log(c); // 3 console.log(aa); // undefined console.log(bb); // undefined } console.log(a); // 1 // console.log(b); // 报错 // console.log(c); // 报错 // 函数作用域 (function A() { var d = 5; let e = 6; const f = 7; console.log(d); // 5 console.log(e); // 6 (在同一个{ }中,也属于同一个块,可以正常访问到) console.log(f); // 7 (在同一个{ }中,也属于同一个块,可以正常访问到) })(); // console.log(d); // 报错 // console.log(e); // 报错 // console.log(f); // 报错 </script>
=====================下面这个解释感觉有局限性,可不看======================
1、const定义的变量不可以修改,而且必须初始化。
const b = 2;//正确 // const b;//错误,必须初始化 console.log('函数外const定义b:' + b);//有输出值 b = 5; console.log('函数外修改const定义b:' + b);//无法输出
2、var定义的变量可以修改,如果不初始化会输出undefined,不会报错。
var a = 1; // var a;//不会报错 console.log('函数外var定义a:' + a);//可以输出a=1 function change(){ a = 4; console.log('函数内var定义a:' + a);//可以输出a=4 } change(); console.log('函数调用后var定义a为函数内部修改值:' + a);//可以输出a=4
3、let是块级作用域,函数内部使用let定义后,对函数外部无影响,如果不初始化会输出undefined,不会报错。
扫描二维码关注公众号,回复:
1100310 查看本文章
let c = 3; // let c; console.log('函数外let定义c:' + c);//输出c=3 function change(){ let c = 6; // c = 6; 这样不行,函数外会改变 console.log('函数内let定义c:' + c);//输出c=6 } change(); console.log('函数调用后let定义c不受函数内部定义影响:' + c);//输出c=3