📅 最后修改于: 2021-01-11 12:20:43 🧑 作者: Mango
变量是存储位置，用于存储程序要引用和使用的值/信息。它充当代码中值的容器，必须在使用前声明。我们可以使用var关键字声明一个变量。在TypeScript中，变量遵循与JavaScript变量声明相同的命名规则。这些规则是-
在ES6中，我们可以使用let和const关键字定义变量。这些变量在变量声明和初始化方面具有相似的语法，但是作用域和用法不同。在TypeScript中，始终建议使用let关键字定义变量，因为它可以提供类型安全性。
let关键字在某些方面类似于var关键字，而const是let，它可以防止阻止重新分配给变量。
我们可以用以下四种方式之一声明变量：
1.在单个语句中声明类型和值
var [identifier] : [type-annotation] = value;
2.声明没有价值的类型。然后，变量将设置为undefined。
var [identifier] : [type-annotation];
3.声明其值而无需输入类型。然后该变量将被设置为any。
var [identifier] = value;
4.声明没有价值和类型。然后，变量将设置为any并使用undefined初始化。
var [identifier];
让我们一一理解所有三个变量关键字。
通常， 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声明获得了一些奇怪的作用域规则。在TypeScript中使用var关键字声明的变量具有函数作用域。该变量在声明它们的函数中具有全局作用域。共享相同作用域的任何函数也可以访问它。
例
function f()
{
var X = 5; //Available globally inside f()
if(true)
{
var Y = 10; //Available globally inside f()
console.log(X); //Output 5
console.log(Y); //Output 10
}
console.log(X); //Output 5
console.log(Y); //Output 10
}
f();
console.log(X); //Returns undefined because value cannot accesses from outside function
console.log(Y); //Returns undefined because value cannot accesses from outside function
注意：由于可以在其包含的模块，函数，全局作用域或名称空间中的任何位置访问var声明，因此有人将其称为var-scoping或function-scoping。参数也称为函数作用域。
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' doesn't exist here, so error will found
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; // it gives error: can't re-declare 'a' in the same scope
遮盖是在更嵌套的范围内引入新名称的行为。它声明一个已经在外部作用域中声明的标识符。这不是不正确的，但是可能会造成混淆。这将使外部标识符在循环变量对其进行遮盖的循环内不可用。如果发生意外的阴影，它可以自行引入错误，并且还有助于防止应用程序出现某些错误。
例
var currencySymbol = "$";
function showMoney(amount) {
var currencySymbol = "€";
document.write(currencySymbol + amount);
}
showMoney("100");
上面的示例具有一个全局变量名称，该名称与inner方法共享相同的名称。仅在该函数使用的内部变量以及所有其他函数将使用全局变量声明。
通常在编写更清晰的代码时避免使用阴影。在某些情况下，如果有合适的选择可以利用它，那么我们应该以最佳的判断来使用它。
提升是JavaScript的一种机制。在吊装中，在执行代码之前，将变量和函数声明移至其封闭范围的顶部。我们可以通过以下示例了解它。
注意：如果我们初始化变量，则不会进行吊装。
例
function get(x){
console.log(a); //printing x variable. Value is undefined
//declared variable after console hoisted to the top at run time
var a = x;
//again printing x variable. Value is 3.
console.log(a);
}
get(4);
输出：
undefined
4
不提升使用let关键字声明的变量。如果我们在声明之前尝试使用let变量，那么它将导致ReferenceError 。
例
{
//program doesn't know about variable b so it will give me an error.
console.log(b); // ReferenceError: b is not defined
let b = 3;
}
const声明用于声明永久值，以后不能更改。它具有固定值。 const声明遵循与let声明相同的作用域规则，但是我们无法为其重新分配任何新值。
注意：根据命名标准，const变量必须以大写字母声明。长期应遵循命名标准来维护代码。
例
function constTest(){
const VAR = 10;
console.log("Value is: " +VAR);
}
constTest();
输出：
Value is: 10
如果我们尝试在代码中重新分配现有的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.