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

Posted 2022-10-29 sefaultment

变量声明

变量声明方式

伴随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 这样的，编译器就会说，你这个名字用过了，要换个名字。

如果变量定义作用域有了同名的变量，解释器就会告诉你，你和别人重名了，需要换名字，有了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"

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

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

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

总结

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