在ES6以前,JavaScript的变量定义只有var一种方式。在ES6中新增了let和const两种定义变量的方式。
JavaScript es6中var、let以及const三者区别案例详解
var、let和const简介
在ES6以前,JavaScript的变量定义只有var一种方式。在ES6中新增了let和const两种定义变量的方式。
- var定义的是一个可变的变量,它在函数作用域或全局作用域内都是有效的,并且可以被重新赋值。
- let定义的是一个块级作用域的变量,它只在块级作用域内有效,并且可以被重新赋值。
- const定义的也是一个块级作用域的变量,不同的是它定义的是一个常量,值在定义之后就不能被修改。
在JavaScript中,尽量使用let和const来定义变量,避免使用var。
示例1:全局作用域和块级作用域中变量的差异
//定义一个全局变量
var globalVariable = 'globalVariable';
//定义一个函数
function test() {
//定义一个函数作用域中的变量
var localVariable = 'localVariable';
console.log(globalVariable);//可以输出全局变量
console.log(localVariable);//可以输出函数作用域中的变量
}
test();
console.log(globalVariable);//可以输出全局变量
console.log(localVariable);//不能输出函数作用域中的变量,会报错
//使用let定义变量
let a = 10;
if(true) {
//使用let定义块级作用域中的变量
let a = 20;
console.log(a);//可以输出20
}
console.log(a);//可以输出10
输出结果:
globalVariable
localVariable
globalVariable
Uncaught ReferenceError: localVariable is not defined
20
10
从结果可以看到,全局变量和函数作用域中的变量在任何地方都可以被访问到,而let定义的变量只在定义的块级作用域中有效。
示例2:const定义的常量
//定义一个常量
const PI = 3.1415926;
//尝试修改常量的值
PI = 3;
console.log(PI);
输出结果:
Uncaught TypeError: Assignment to constant variable.
从结果可以看到,使用const定义的变量在定义之后就无法修改。
结论
- var定义的变量可以被重新赋值,而let和const定义的变量都不能被重新赋值。
- var定义的变量在函数作用域或全局作用域中都是有效的,而let和const定义的变量只在块级作用域中有效。
- const定义的变量在定义之后就不能被修改,而var和let定义的变量可以被修改。
- 在JavaScript中,尽量使用let和const来定义变量,避免使用var。
织梦狗教程
本文标题为:JavaScript es6中var、let以及const三者区别案例详解


基础教程推荐
猜你喜欢
- Navigator sendBeacon页面关闭也能发送请求方法示例 2023-12-20
- echarts中X轴显示特定个数label并修改样式的方法详 2022-08-31
- php – 将html select form的值插入mysql数据库 2023-10-26
- JS中prototype的用法实例分析 2023-12-01
- JavaScript实现酷炫的鼠标拖尾特效 2023-08-12
- 整理HTML5移动端开发的常用触摸事件 2023-12-19
- 简单实现ajax拖拽上传文件 2023-02-14
- php – 我应该在我的数据库中使用哪种类型的html文本? 2023-10-26
- css列表标签list与表格标签table详解 2022-11-16
- Vue实现富文本功能 2023-10-08