TypeScript 变量

变量是用于存储程序引用和使用的值/信息的存储位置。它在代码中作为值的容器，必须在使用之前声明。我们可以使用var关键字声明变量。在TypeScript中，变量遵循与JavaScript变量声明相同的命名规则。这些规则是：

• 变量名称必须是字母或数字。
• 变量名称不能以数字开头。
• 变量名称不能包含空格和特殊字符，除了下划线(_)和美元符号($)。

在ES6中，我们可以使用let和const关键字定义变量。这些变量具有类似的变量声明和初始化语法，但在范围和用法上有所不同。在TypeScript中，始终建议使用let关键字定义变量，因为它提供了类型安全性。

let关键字在某些方面类似于var关键字，而const是一个let，它防止对变量的重新赋值。

变量声明

我们可以用以下四种方式之一声明变量：

1.在单个语句中声明类型和值

var [identifier]: [type-annotation] = value;

2.声明无值的类型。然后变量将设置为未定义。

var [identifier]: [type-annotation];

3.声明其值而不带类型。然后变量将设置为任何值。

var [identifier] = value;

4.不带值和类型声明。然后变量将设置为任何并初始化为未定义。

var [identifier];

让我们逐一理解这三个变量关键字。

var关键字

通常，var关键字用于在JavaScript中声明变量。

var x = 50;

我们也可以在函数内部声明变量：

function a() {
     var msg = " Welcome to JavaTpoint !! ";
     return msg;
}
a();

我们还可以使用其他函数访问一个函数的变量：

function a() {
    var x = 50;
    return function b() {
         var y = x+5;
         return y;
    }
}
var  b = a();
b();       //returns '55'

作用域规则

对于其他语言程序员来说，在JavaScript中使用var关键字声明有一些奇怪的作用域规则。使用var关键字在TypeScript中声明的变量具有函数作用域。这个变量在它们被声明的函数中具有全局范围。它也可以被任何共享相同作用域的函数访问。

注意：由于var声明可以在包含模块、函数、全局作用域或命名空间的任何地方访问，因此有些人称之为var作用域或函数作用域。参数也称为函数作用域。

let声明

let关键字与var关键字类似。var声明在解决程序中存在一些问题，因此ES6引入了let关键字来在TypeSript和JavaScript中声明变量。与var关键字相比，let关键字在作用域方面有一些限制。

let关键字可以增强我们的代码可读性，并减少编程错误的机会。

let语句的语法与var语句相同：

    var declaration: var b = 50;
    let declaration: let b = 50;

var和let之间的主要区别不在语法上，而是在语义上不同。使用let关键字声明的变量的作用域仅限于最近的封闭块，该块可以比函数块小。

块级作用域

使用let关键字声明的变量会使用块级作用域或词法作用域。与使用var关键字声明的变量不同，后者的作用域会泄露到其包含的函数中，而块级作用域的变量不能在其所在块的外部可见。

function f(input: boolean) {
    let x = 100;
    if (input) {
        // "x" exists here      
        let y = x + 1;
        return y;
    }
    // Error: "y" doesn't exist here
    return y;
}

这里有两个本地变量x和y。 x的范围仅限于函数f()的主体，而y的范围仅限于包含if语句块的区域。

注意 – 在try-catch子句中声明的变量也具有类似的作用域规则。例如：

try {
    throw "Hi!!";
}catch (e) {
    console.log("Hello");
}
// 这里不存在'e'，因此会出现错误
console.log(e);

重新声明和屏蔽

使用var声明，无论我们声明变量多少次都没有关系。我们只得到一个。在下面的示例中，所有对x的声明都引用同一个x，这是完全有效的。但是有一些错误，可以通过let声明找到。

不使用let关键字的示例：

function f(a) {
    var a;
    var a;
    if (true) {
        var a;
    }
}

使用let关键字的示例：

let a = 10;
let a = 20; // 它会报错：在相同的范围内无法重新声明'a'

屏蔽是在更嵌套的作用域中引入新名称的行为。它声明了已在外部作用域中声明的标识符。这不是不正确的，但可能会引起混淆。它将使外部标识符在循环变量在其中进行屏蔽的循环中不可用。它可以在意外屏蔽的情况下引入错误，同时还有助于防止应用程序出现某些错误。

示例

var currencySymbol = "$";
function showMoney(amount) {
  var currencySymbol = "€";
  document.write(currencySymbol + amount);
}
showMoney("100");

上面的示例具有与内部方法相同名称的全局变量名称。内部变量仅在该函数中使用，并且所有其他函数都将使用全局变量声明。

通常在编写更清晰的代码时避免使用Shadowing。虽然在某些情况下，如果可能利用它，我们应该最好地使用它。

提升

var提升

提升是JavaScript的机制。在提升中，在代码执行之前，变量和函数声明被移动到其封闭作用域的顶部。我们可以通过以下示例来理解它。

注意：如果我们初始化变量，则不会发生提升。

示例

function get(x){   
  console.log(a);  // 打印x变量。值为undefined     
  //运行时在控制台hoisted之后声明变量  
  var a = x;      
  //再次打印x变量。值为3。
  console.log(a);  
}  
get(4);

输出：

undefined
4

let提升

使用let关键字声明的变量不会被提升。如果我们在声明之前尝试使用let变量，则会导致ReferenceError。

示例

{
  //程序不知道变量b，所以它会给我一个错误。
  console.log(b); // ReferenceError: b is not defined
  let b = 3;
}

const声明

const声明用于声明永久值，它不能稍后更改。它具有固定的值。const声明遵循与let声明相同的作用域规则，但我们无法将任何新值重新分配给它。

注意：根据命名标准，必须在大写字母中声明const变量。应遵循命名约定以维护长期运行的代码。

示例

function constTest(){
  const VAR = 10;
  console.log("Value is: " +VAR);
}
constTest();

输出:

Value is: 10

当我们尝试重新分配const变量时会发生什么？

如果我们在代码中尝试重新分配现有的const变量，代码将抛出错误。因此，我们无法为现有的const变量重新分配任何新值。

示例

function constTest(){
  const VAR = 10;
  console.log("Output: " +VAR);  // Output: 10
  const VAR = 10;
  console.log("Output: " +VAR);  //Uncaught TypeError: Assignment to constant variable
}
constTest();

输出:

SyntaxError: Identifier 'VAR' has already been declared.