轻松弄懂var、let、const之间的区别（一看就懂）

ES6的好处
ES6的出现为我们前端带来了很多方便之处，以前用js几十行才实现的一个功能，ES6几行代码就能简单的实现，ES6新增的一些特性，改变了很多弊端之处，比如新出现的let、const，实现了块级作用域功能，减少了以前var的全局变量，箭头函数代替词法作用域的"this" 等等，在这里就不再做更多的举例子，想了解更多请参考 https://www.w3cschool.cn/ecmascript/pgms1q5d.html，今天主要跟大家一起了解一下var、let、const之间的区别

let
let是ES6新增的命令，用来声明变量，跟var声明变量一样。但是它俩有很大的区别。

let、const声明的变量仅在块级作用域内有效，var 声明变量是全局的，没有块级作用域功能
let 、const 不存在变量提升 , var 存在变量
let 、const不能在同一块级作用域内重复申请
用let定义变量，运行代码如下：

const arr = [1, 2, 3, 4]
for (let i = 0; i < arr.length; i++) {
console.log(arr[i])
}console.log(i);

1
2
3
4
5

以上报错i未定义，说明let定义变量i，只在所在的块作用域内起作用

var 定义变量，运行代码如下：

var arr = [1, 2, 3, 4]
for (var i = 0; i < arr.length; i++) {
console.log(arr[i])
}
console.log(i);
1
2
3
4
5

以上运行结果说明，var 定义变量没有块级作用域，i在块级作用域照样可以输出结果
其实var在函数内命名的变量是只在整个函数作用域内起作用，出了这个函数作用域就不能用了，例如下面

function testVar () {var i = 2console.log('函数内:' + i)}testVar()console.log('函数外:' + i)

1
2
3
4
5
6

很明显在函数外输出变量i的时候，报i未定义，var在函数内命名的变量是只在整个函数作用域内起作用

let不像var那样会发生“变量提升”现象。所以，变量一定要在声明后使用，否则报错。
运行代码如下：

console.log(arg1)
console.log(arg2)
var arg1 = 'test'
let arg2 = 'test2'

1
2
3
4

变量arg1用var命令声明，会发生变量提升，即脚本开始运行时，变量arg1已经存在了，但是没有值，所以会输出undefined。变量arg2用let命令声明，不会发生变量提升。这表示在声明它之前，变量arg2是不存在的，这时如果用到它，就会抛出一个错误。

var 重复申明变量的运行结果：

var arg1 = 'test'console.log('var第一次申明：' + arg1)var arg1 = 'test2'console.log('var第二次申明：' + arg1)

1
2
3
4

let 重复声明变量代码

let arg2 = ‘test’
console.log(‘let第一次申明：’ + arg2)
let arg2 = ‘test2’
console.log(‘let第二次申明：’ + arg2)
1
2
3
4

let在同一块作用域内不能重复声明变量，var 可以重复声明

const
const与let上面特点一样，但是也有不同点，let声明的是变量，const声明的是常量，只读，修改值会报错，const保存的是内存地址,可以给对象或数组添加属性或元素，但是不能重新复写。
————————————————
版权声明：本文为CSDN博主「前端岚枫」的原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/lfcss/article/details/103869080

轻松弄懂var、let、const之间的区别（一看就懂）相关推荐

轻松弄懂var、let、const之间的区别
ECMAScript 6(简称ES6)是JavaScript语言的下一代标准,于2015年6月正式发布,也称ECMAScript 2015. ES6的好处 ES6的出现为我们前端带来了很多方便之处,以 ...
const int a; int const a; const int *a; int * const a; int const * a const; 之间的区别
const int a; int const a; const int * a; int * const a; int const * const; 之间的区别 const int a; int co ...
腾讯面试题：char 和 varchar的最大长度是多少，以及他们之间的区别（看完你就能和面试官笑谈人生了）
title: 腾讯面试题:char 和 varchar的最大长度是多少,以及他们之间的区别(看完你就能和面试官笑谈人生了) tags: 面试常见题腾讯面试题:char 和 varchar的最大长度是 ...
win7原版镜像_告诉你Ghost系统和原版系统之间的区别，看完再装机也不晚
在安装电脑Win系统的时候,有非常多的版本可以选择,不少用户都会看花眼,经常出现的是ghost这个版本,ghost 是什么意思?和原版系统有什么区别呢?今天小编就跟大家介绍一下一下ghost系统和原版 ...
深入分析内连接、外连接、左连接、右连接、等值连接、自然连接和自连接之间的区别，看这篇就够了！
多表查询经常用到连接,各种连接之间的区别应该注意总结. 首先大概认识各种连接的关系和由来: 表之间的连接常有以下两种: 一.:在SELECT语句的WHERE子句中使用比较运算符给出连接条件,对表进行连 ...
Git：Rebase和Merge之间的区别，看完这篇文章你就懂了！
社区中长期以来一直在争论我们应该使用Merge还是Rebase. 有人会说Merge更好,因为它保留了最完整的工作历史.其他人则认为,Rebase变得更整洁,这使审阅者的生活更轻松,更高效.本文将解释 ...
7 张图带你搞懂二层和三层交换机之间的区别
公众号关注「奇妙的 Linux 世界」设为「星标」,每天带你玩转 Linux ! 导语:本文我们将学习和探讨OSI参考模型中二层和三层交换机的各种特性和应用,以及它们之间工作方式的区别. 这两种类 ...
`constexpr`和`const`之间的区别？
基本含义和语法这两个关键字都可以在对象声明和函数中使用.应用于对象的基本区别是: const声明一个对象为常量.这意味着一个保证,一旦初始化,该对象的值不会改变,编译器可以利用这个事实进行优化.它还 ...
const int *，const int * const和int const *之间的区别
文章目录 int const* int *const const int* const 记忆图参考文档 int const* int const* 是指向常量整数的指针. 这意味着被 ...

轻松弄懂var、let、const之间的区别（一看就懂）

轻松弄懂var、let、const之间的区别（一看就懂）相关推荐

最新文章

热门文章