var let const

JaysonWang 发布于2019-08-26 12:14 / 1843人阅读

摘要：和没有变量提升类似这些功能主要是为了减少程序运行时的错误使代码更加规范不允许重复声明同一个作用域内不允许重复声明同一个变量。

let 和 var

相信有很多前端工程师除了在声明函数时会用到 function 其余的变量声明一律使用 var, 不过随着浏览器对es6逐渐支持我们应该学着使用 let 和 const 而不是使用存在诸多弊端的 var

var 存在着哪些弊端呢？

没有块级作用域，很容易声明全局变量

变量提升

可以重复声明

典型的面试题

var arr = [];
for (var i = 0; i < 10; i++) {
    arr[i] = function () {
        console.log(i);
    }
}

arr[6](); // 期望输出 6 实际输出 10
arr[7](); // 期望输出 7 实际输出 10
arr[8](); // 期望输出 8 实际输出 10

在ES6诞生之前我们的解决方法基本是这样的

var arr = [];
for (var i = 0; i < 10; i++) {
    (function (i) {
        arr[i] = function () {
            console.log(i);
        }
    }(i))
}

arr[6](); // 6
arr[7](); // 7
arr[8](); // 8

ES6诞生以后呢

let arr = [];
for (let i = 0; i < 10; i++) {
    arr[i] = function () {
        console.log(i);
    }
}

arr[6](); // 6
arr[7](); // 7
arr[8](); // 8

是不是简单了很多, 这一切都要归功于let的块级作用域, 这里使用 var 声明的i是全局变量, 当for循环执行完成以后, i的值已经变成了10, 而在 console.log(i) 的时候访问的同样是全局下的 i 因此我们会发现无论执行哪个函数 i 的值都是10;
而使用 let 呢, 因为 let 声明的变量只在 let 命令所在的代码块内有效, 所以每一次循环的i其实都是一个新的变量, 而当执行 console.log(i) 时, js会沿着作用域链首先找到最近的 i 并输出, 因此会输出我们所期望的 i 值.

除了存在块级作用域相对于 var 不同之处还有

不存在变量提升

console.log(a); // undefined;
var a = 1;

console.log(b); // b is not defined
let b = 2;

这里用 var 声明变量时, 因为存在变量提升, 在声明之前访问该变量会输出 undefined 并不会报错, 而使用 let 声明的变量在声明之前访问则会报错, 这样更符合人的常规逻辑.

暂时性死区

var a = 123;

if (true) {
  a = "abc"; // a is undefined;
  let a;
}

暂时性死区规定在声明之前就使用这些变量，就会报错。和没有变量提升类似, 这些功能主要是为了减少程序运行时的错误, 使代码更加规范.

不允许重复声明

let c = 2;
let c = 3; // Identifier "c" has already been declared

同一个作用域内不允许重复声明同一个变量。

不会成为全局对象(window)的属性

var a = 3;
console.log(window.a); // 3
let b = 4;
console.log(window.b); // undefined;

const

除了 let 有时候我们也许更需要 const

const 和 let 的唯一区别就是，const 不可以被更改，所以当声明变量的时候，尤其是在声明容易被更改的全局变量的时候，尽量使用 const。

云服务器 GPU云服务器 Lets Let const const 断言

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/108286.html

javascript 声明变量var、let、const详解及示例

摘要：概述发布前，只能通过声明变量的方式，常量块级变量函数变量这些概念的差别都不能很好的体现出来，于此同时，加入你要使用或者提供一个，声明的变量可随时被修改和重新分配的问题，会让你时刻担心代码是否能正常运行。 1. var、let、const概述 ES6发布前，Javascript只能通过var声明变量的方式，常量、块级变量、函数变量这些概念的差别都不能很好的体现出来，于此同时，加入你要使用...

tuomao 2019-08-22 18:07 评论0 收藏0
var和let/const的区别

showImg(https://segmentfault.com/img/remote/1460000017757580); let和const是 ES6 新增的命令，用于声明变量，这两个命令跟 ES5 的var有许多不同，并且let和const也有一些细微的不同，再认真阅读了阮一峰老师的文档后，发现还是有一些不知道的细节... 博客、前端积累文档、公众号、GitHub 内容： var和let...

SHERlocked93 2019-08-23 14:28 评论0 收藏0
javascript中var、let、const声明的区别

摘要：声明的变量存在变量提升，声明的变量不存在变量提升。声明的变量允许重新赋值，声明的变量不允许重新赋值。注意跨脚本声明重复变量也会报错。中出现的任何元素在声明中出现，语法错误。中的是如此的怪异。对中的声明进行实例化。我在上一篇文章javascript中词法环境、领域、执行上下文以及作业详解中的最后稍微提到了有关var、let、const声明的区别，在本篇中我会重点来分析它们之间到底有什么...

Yujiaao 2019-08-21 17:51 评论0 收藏0
深入理解ES6 - var-let-const

摘要：声明变量不存在变量提升。临时死区，而且不能在声明之前访问它。禁止重复声明相同的变量，否则报错。不存在变量提升，一旦执行快外就会立即销毁。声明不允许修改绑定，但允许修改值，也就是说用创建对象后，可以修改该对象的属性值。知识点 var 声明变量： 1、存在变量提升，实际上var无论在哪里声明，都会被当做当前的作用域顶部声明变量。 2、可以重复声明，后声明的变量会覆盖前声明的变量。 let...

alexnevsky 2019-08-22 17:34 评论0 收藏0
ES6精解：let、const、块级作用域

摘要：命令新增了命令，跟类似，都是用来声明变量的不允许重复声明报错不存在变量提升报错正确写法为既要先定义，后面才能有这个值，否则会报错，如果改成会提示未定义，但是就直接报错了暂时性死区只要在块级作用域里面存在则它所声明的变量就绑定在这个块级作用域 let命令 ES6新增了let命令，跟var类似，都是用来声明变量的 1.不允许重复声明 { let a = 1; let a =...

BWrong 2019-08-22 18:20 评论0 收藏0
ES6 系列之 let 和 const

摘要：块级作用域存在于函数内部块中字符和之间的区域和块级声明用于声明在指定块的作用域之外无法访问的变量。和都是块级声明的一种。值得一提的是声明不允许修改绑定，但允许修改值。这意味着当用声明对象时没有问题报错临时死区临时死区，简写为。块级作用域的出现通过 var 声明的变量存在变量提升的特性： if (condition) { var value = 1; } console.lo...

PascalXie 2019-08-22 17:25 评论0 收藏0