Typescript学习笔记（三）变量声明及作用域

比眉伴天荒 2022-04-22 02:06 358阅读 0赞

ts的变量声明有var，let和const，这尼玛完全跟es6一样嘛。就稍微介绍一下。

大多数js开发者对于var很熟悉了，原生js里没有块级作用域，只有函数作用域和全局作用域，还存在var的变量提升的问题，导致一些不熟悉js的开发者会发现一些怪异事件。点击查看关于es6的let与const

let声明

let声明和var一样的写法，大家看前面的博客里面相信也看到了。

拣重要的说，let和var的区别就是let使js实现了它的块级作用域，即词法作用域或块作用域。

而且它不存在变量提升。

复制代码

  1. function f(input: boolean) {
  2.     let a = 100;
  4.     if (input) {
  5.         // Still okay to reference 'a'
  6.         let b = a + 1;
  7.         return b;
  8.     }
  10.     // Error: 'b' doesn't exist here
  11.     return b;
  12. }

复制代码

内部块一样能访问外部块，反之就不行了。这一特性使for循环的计数器就比较好用了，

  1. for(let i = 0; i < arr.length; i++){}
  3. console.log(i)
  4. //ReferenceError: i is not defined

复制代码

  1. // 报错
  2. function () {
  3.   let a = 10;
  4.   var a = 1;
  5. }
  7. // 报错
  8. function () {
  9.   let a = 10;
  10.   let a = 1;
  11. }

复制代码

let是不允许重复声明的。

需要注意的是，现在的ts编译器都是吧let直接编译为var，所以let的特性在浏览器支持之前还是无法试用的。

在js里面输出10个10的例子，在let下就不一样了。

  1. for (let i = 0; i < 10 ; i++) {
  2.     setTimeout(function() {console.log(i); }, 100 * i);
  3. }

不仅是在循环里引入了一个新的变量环境，而是针对每次迭代都会创建这样一个新作用域。 这就是我们在使用立即执行的函数表达式时做的事。

他会和我们预想的一样输出1-10。

const

const和let基本一致，只是const声明的变量被赋值后不能再改变（所以对于const来说，只声明不赋值，就会报错），作用域同let。

复制代码

  1. const numLivesForCat = 9;
  2. const kitty = {
  3.     name: "Aurora",
  4.     numLives: numLivesForCat,
  5. }
  7. // Error
  8. kitty = {
  9.     name: "Danielle",
  10.     numLives: numLivesForCat
  11. };
  13. // all "okay"
  14. kitty.name = "Rory";
  15. kitty.name = "Kitty";
  16. kitty.name = "Cat";
  17. kitty.numLives--;

复制代码

  1. const a = [];
  2. a.push("Hello"); // 可执行
  3. a.length = 0;    // 可执行
  4. a = ["Dave"];    // 报错

这个数组和对象本身是可写的，但是如果将另一个数组赋值给const变量，就会报错。

使用的法则：

所有变量除了你计划去修改的都应该使用const

发表评论

表情：
评论列表 （有 0 条评论，358人围观）

还没有评论，来说两句吧...

相关阅读