const & let

or0fun 发布于2019-08-23 14:33 / 3084人阅读

摘要：前世在还未出现前，的世界一直是的统治在中用于变量声明的关键字。的出现给带来了块级作用域，解决了变量提升，禁止了重复声明变量，让少了很多疑惑的地方。时代已经过去了，各种特性用起来。

前世

在 const & let 还未出现前，JS 的世界一直是 var的统治

var：在JS中用于变量声明的关键字。

特点：

变量提升

只有函数作用域或者全局作用域，没有块级作用域

重复声明变量

循环体重的闭包会出现问题

…….

变量提升

function test(tag) {
    console.log(a,b);   // a,b在下面声明，但是会打印出undefined，不会报错
    
    if(10 >= tag) {
        var a = tag + 1;
    } else {
        var b = tag - 1;
    }
}

在浏览器预解析机制中，加载函数的时候，此时的作用域为函数作用域，函数作用域中JS会先将所有的声明置顶。

function test(tag) {
    var a,b;            // 将声明置顶，但是赋值并不会
    console.log(a,b);   // a,b在下面声明，但是会打印出undefined，不会报错
    
    if(10 >= tag) {
        var a = tag + 1;
    } else {
        var b = tag - 1;
    }
}

只有函数作用域以及全局作用域，没有块级作用域

function test(tag) {
    console.log(a,b);   // a,b在下面声明，但是会打印出undefined，不会报错
    
    if(10 >= tag) {
        var a = tag + 1;
    } else {
        var b = tag - 1;
    }
    
    console.log(a);        // 9
}

test(8)  // 9

按照其他语言规则 if 是一个程序块，在 if 中声明的变量作用域只能在 if 中，但是 JS 因为只有函数作用域和全局作用域，所以才会导致在 if 判断外还可以访问 if 的变量

重复声明变量

var a = 1;
var a = 2;

console.log(a); // 2

在使用var的时候允许重复声明变量也是令人头痛的事情，也许因为这个机制，可能就会出现bug

循环体重的闭包会出现问题

var arr = [];
for(var i = 0; i < 3; i++) {
    arr.push(function () {
        return i;
    })
}

for(var j = 0; j < 3; j++) {
    console.log(arr[j]());    // 3,3,3
}

将var -> let
将会打印出 0,1,2

因为缺乏块作用域所以导致问题出现

今生

如今距离ES6规范的出现已经过去了4年多了，在项目中也早已开始大量使用ES6规范编写代码了。var也不再是JS世界的唯一了，

JS 世界出现了const & let。

const & let 的出现给JS带来了块级作用域，解决了变量提升，禁止了重复声明变量，让JS少了很多疑惑的地方。

let & const

相同点：

具有块级作用域

禁止重复声明变量

不会产生变量提升

区别：

let

使用let声明的基本类型变量是可以改变值

let a = 12;
a = 13;
return a;    // 13

使用let声明引用类型的变量是可以改变引用的

let info = {
    name: "ming995",
    age: 25,
    sayHi: function() {
        console.log(`Hi I"m ${this.name}`)
    }
};

let heInfo = {};

heInfo = info;

heInfo.name = "Jack";

console.log(heInfo);

const

使用const声明的基本类型变量是不可以改变值

const a = 13;
a = 14;
return a; // 报错

使用const声明引用类型的变量是不可以改变引用的

const info = {
    name: "ming995",
    age: 25,
    sayHi: function() {
        console.log(`Hi I"m ${this.name}`)
    }
};

const heInfo = {};

heInfo = info;        // 报错
    
heInfo.name = "Jack";

console.log(heInfo);

但是我们可以操作const声明的引用类型的属性值

const info = {
    name: "ming995",
    age: 25,
    sayHi: function() {
        console.log(`Hi I"m ${this.name}`)
    }
};

info.language = "js";

console.log(info);

总结

之前对于const的理解有偏差，所以就写这篇文章。var时代已经过去了，ES6各种特性用起来。

私有云 idc机房托管 Lets Let const const 断言

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

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

JS中let与const命令如何使用

　　本篇文章主要讲述JS中let与const命令使用，通过代码展示给各位。　　let命令　　基本使用　　在ES6中，let命令是新增的声明变量，与var的差异在于let无法重复声明，且let有效只是在其命令的代码块内，let禁止变量出现变量提升现象，let的特点就是通过暂时性死区的方式来避免程序上的错误　　代码块：使用{}包括起来的内容　　声明变量：分配一个存储空间　　不可重复声明：let声明过后...

3403771864 2022-10-08 22:00 评论0 收藏0
ES6笔记之 let &amp;&amp; const

摘要：声明的变量只在其所在的代码块内有效。只要在声明之前使用这些变量，就会报错。在语法上称为暂时性死区有时候，会不经间遇到比较隐蔽的死区，不太容易被发现。不允许重复声明不允许在相同的作用域内声明同一个变量。一旦声明，其值就不能再改变。 let && const let let声明的变量只在其所在的代码块内有效。 { let a = 10; } console.log(a) //R...

aristark 2019-08-19 17:33 评论0 收藏0
es6必会之let &amp;&amp; const

摘要：副作用，无副作用可执行和关键词。和不能像一样同一个下声明多次和不会像一样变量声明提升原因是，存在因此不能，赋值前使用变量。 showImg(https://segmentfault.com/img/bVbhPlD?w=1271&h=715); 关键词： let ，const， blocking scope ，temporal dead zone，redeclaration，reassi...

ygyooo 2019-08-23 12:14 评论0 收藏0
通过JavaScript实现扑克牌游戏的示例代码

　　我们说下想要实现，一副牌里有54张，我们可以知道 3 - 2 的牌总共有13张，这分为4个花色是 ♠️ ♥️ ♣️ ♦️ 另外加上2个大小王！第一步：形成一个数组，就要写一个函数，利用牌数量和花色，这样可以用来形成一个双重循环将 number 里面的内容和 flower 里面的内容进行一个循环嵌入？最后在用 push 生成一个对象放到数组的后面？再到最后放入大小王。　　constnu...

3403771864 2022-09-23 21:35 评论0 收藏0
JS前端千万级弹幕数据循环优化示例

大数据中时常都会有优化，这篇文章要和大家降的就是如何按照特定的条件删除一个数组？　　1、如何删除数组中的元素　　场景：有一个数组，需要删除满足条件的数组。　　示例：　　constarr=[1,2,3,4,5,6,7,8]　　删除小于5的元素,删除后的元素为　　constarr2=[5,6,7,8]　　代码实现：　　constarr=[1,2,3,4,5,6,7,8] 　　for(leti=0,le...

3403771864 2022-09-07 22:52 评论0 收藏0