三、变量声明
var声明
主要特点： - var是函数作用域，只针对函数声明 - 可以多次声明同一个变量不会报错 - 捕获变量怪异之处
function fnVar(flag: boolean) {if(flag) {var x = 10;}return x;
}
fnVar(true); // 10
fnVar(false); // undefinedvar isDone: boolean = false;
var isDone: boolean = true;
// 打印结果：10，10，10，10...
for(var i = 0; i < 10; i++){setTimeout(function() { console.log(i) }, 100 * i)
}let声明
能够解决var声明产生的问题，主要特点： - 使用词法作用域或者块作用域 - 他们不能在被声明之前读或者写，虽然变量存在于他们的作用域里，但是直到声明他的代码之前的区域都属于 ”暂时性死区“ - 不允许在同一作用域中同时定义两个相同的变量
function fnLet(input: boolean){let a = 100;if(input){let b = a + 1;return b;}// 此处会报错b未定义return b;
}
a++; // 会报错
let a;
// 下面这种方式ts是允许的
function letFoo() {return forward;
}
letFoo();
let forward;块级作用域变量的获取： - var声明变量时，每次进入一个作用域时，他创建了一个变量的环境，就算作用域内代码已经执行完毕，这个环境与其捕获的变量依然存在（所以在循环setTimeout中使用自执行函数的目的就是重新创建一个新的变量环境） - let会在每一个作用域中都声明一个新的变量环境（所以针对循环setTimeout中把var换成let声明时就可以达到理想的输出效果）
// 块级作用域变量的获取: var
function citySleeps() {let getCity;if(true) {let city = 'Seattle';getCity = function() {return city;}}// 已经在city环境里获取到了city，所以就算if语句执行结束仍然可以访问return getCity();
}
// 块级作用域变量的获取：let
// 打印结果：1,2,3,4,5...
for(let i = 0; i < 10; i++){setTimeout(function() { console.log(i) }, 100 * i)
}const声明
定义：被赋值以后不能被改变 特点： - 拥有与let相同的作用域规则 - const定义一些常量场景多一些
const data = 123;
data = 444; // error解构
// 数组解构
let input = [1, 2];
let [first, second] = input;
// 作用于函数参数
function fnInput([first, second]: [number, number]){return first + second;
}
let result = fnInput([first, second]);
// 在数组中使用...语法创建剩余变量
let [fist, ...rest] = [1,2,3,4];
// 对象解构
let objInput = {a: 'foo',b: 12,c: false
}
let { a, b } = objInput;
// 用...语法创建剩余变量
let { c, ...others } = objInput;
let total = others.a + others.b;
// 属性重命名
let { a: newName1, b: newName2 } = objInput;
console.log(newName1);
// 指定类型
let { a: objA, b: objB }: { a: string, b: number } = objInput;
// 设置默认值
function keepObject(obj: { a: string, b?: number }){let { a, b = 1001 } = obj;
}
