从项目中理解let和const为什么如此重要

变量声明

变量声明方式

伴随js诞生的var

// 语法  var varName = value
var a = 1  // 这样子你就得到了一个变量

var缺陷场景分析

var specialUser = "cj"; // 在A文件定义
 
var specialUser = "fk"; // A文件很大,你没去寻找是否定义此变量,直接定义

getImportantInformation(specialUser); // 在B文件定义

我们在定义一个变量,通常是跳过检查是否已经定义了此变量,尤其在编写局部代码时,这就更加容易导致了命名引起的重复定义,导致一些核心变量被覆盖,造成系统重大破坏,在上面的例子,就会因为spcialUser变量导致系统使用到该变量的地方全部行为异常,人要学会偷懒,是否定义此变量,编译器能够知道,为什么要我们程序员去定义变量前,还要在项目文件下查找此变量是否定义呢,代码编译时,如果有此变量的定义,直接告诉我们冲突,我们根据需要更换就好

js规范为了操碎了心,let的诞生了

其实上述覆盖掉了核心变量,我是在业务上遇到过的,估计不少程序猿遇到这种事情,然后ECMAScript官方就出来了,所有js语言的解释器,必须实现新的变量声明方式,帮助我们省下覆盖变量的操心。

let name = "cj"; // 无论在何处定义
let name = "cj"; // 如果此变量在此作用域找了let name 这样的,编译器就会说,你这个名字用过了,要换个名字。

nDrJln.png

如果变量定义作用域有了同名的变量,解释器就会告诉你,你和别人重名了,需要换名字,有了let从此就不用再担心原先的变量被覆盖了,放心定义变量即可,很舒服。

不止如此,var反常行为

在我们学习变量时,老师就会说,变量要先定义再访问,我们不服输,尝试一下先访问再定义

console.log(name)  // 咦? 为什么不会报错
var name = "cj"

嗯?此时js与老师的教导出现了冲突,没错,是老师错了,js可是个反常识的东西,当初为啥这样设计呢,不得而知,但是这里,可是增加了变量的使用成本,为什么这样说呢

code 1
code 2  //

var name = 1 // code 2 定义的变量,

有一天我们想在code1引用这个变量,也许会去搜索这个变量是否在code1前定义的,这是为了code1能够正常访问name,好的,你没猜错,我们又可以让编译器这个工具帮我们处理这件事,如果我们在定义变量之前访问变量,让编译器通知我们这里不能访问

console.log(name)  
let name = "cj"

nDshD0.png

看到这熟悉的提示,喔,原来我们在定义变量之前访问了变量,这时候我们就修改一下代码调用顺序,其实,这种机制也保证了代码的显式调用顺序的健壮

console.log(name)   // 嗯? 不行?
let name = "cj"

console.log(name)  // 这样才对
let name = "cj"

不受控制的var

由于程序少则几百行,我们公司大就几十万行,这就出现了人的名字的管理问题,如何解决重名问题呢,在此基础上拓展新的标识是一个不错的方法,比如中国很多重名的,地址就是一个额外标记的好东西,我们程序也在内存里分块,但是这不是重点,在内存上一层的抽象,语言有一个叫做作用域的东西,相当于把程序分成不同的城市一般来说变量被限制在这些块里,通过这种方式,我们很多通用的变量名得以大量使用而不冲突,因为它们不属于一个块,想象一下,如果中国只有一个城市,那么同名的人就可能得叫支付宝-1 支付宝-2了,变量在这种情况下也是一样,需要大量前缀,所以作用域的作用可想而知,当然作用域的设计来源复杂多,嘻嘻,以后有空研究下,

if(condition) {
  var a = 11;
}
var a = 33  // 此时我想在if外面的作用域定义了一个变量,却以不小心覆盖了if内部的变量a,导致程序异常

上述代码还有致命问题,一般来说,我们在不同作用域定义变量是互不影响的,但是上面的代码却违反了这个规则,倒置变量可能的异常,上述代码在同步场景下,基本没什么影响,在异步场景就会因为后者定义覆盖的问题导致程序异常

if(true) {
  var a = 3
    setTimeout(  () =>  {
      console.log(a) //  5而不是3
    }, 0)
}
var a = 5

let 就使得js拥有了真正的块作用域

if(true) {
  let a = 3
    setTimeout(  () =>  {
      console.log(a) //  3
    }, 0)
}
let a = 5

let遗漏的场景

let PI = 3.14

PI = 3.14132

有时候我们需要定义一个变量,在很多地方使用,但是由于这个变量很重要,所以后续有对它的修改,都是会对程序造成破坏,我们不希望,但是,当我们对一个变量赋值时,怎么知道其是不能修改的呢,嗯,只能阅读源码,确定其重要性,这样费事费力,能让我们的工具人编译器帮助我们吗,是的,它做到了

const PI = 3.14
PI = 3.14132

nDcZ4S.png

在我们想修改一些值时,如果作者有使用const标记为不可修改变量,那么我们修改时,编译器就会告诉我们,嘿,兄弟,动了这个变量系统就会挂掉,真是棒极了。

总结

在新的语法大环境下,大家尽可能使用let 去定义变量,在这基础上,如果是不需要改变的变量,可以使用const去定义,一方面可以避免别人修改,一方面也可以提升编译器效率。

posted @ 2019-09-14 08:45  兴趣使然的Geek  阅读(863)  评论(0编辑  收藏  举报