const & let

宿世

在 const & let 还未涌现前,JS 的天下一直是 var的统治

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

特征:

  1. 变量提拔
  2. 只要函数作用域或许全局作用域,没有块级作用域
  3. 反复声明变量
  4. 轮回体重的闭包会涌现题目

    …….

变量提拔

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

相同点:

  1. 具有块级作用域
  2. 制止反复声明变量
  3. 不会发生变量提拔

区分:

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种种特征用起来。

    原文作者:JameHou
    原文地址: https://segmentfault.com/a/1190000017797738
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞