ES6 中,变量声明一共有6种,分别是varfunction 、letconstclassimport

let

基本语法:let 变量名 :类型。其中类型不是必须的。

1、用于声明变量,其用法似于var。

let name = 'Sunny'

2、所有声明的 let 变量仅在let命令所在的代码块(块级作用域)内有效。

function f(input: boolean) {
let a = 100;
if(input) {
let b = a + 1; // 运行正确
return b;
}
return b; // 错误, b没有被定义
}

3、在同样的作用域中,let 不允许变量被重复声明

// 报错
function () {
let a = 10;
var a = 1;
} // 报错
function () {
let a = 10;
let a = 1;
}

4、不能在它的声明之前被读取或赋值。

function funA(x) {
let x = 100; // 报错,x已经在函数入参声明
} // 增加了判断条件组成的新的块级作用域
function funB(condition, x) {
if(condition) {
let x = 100; // 运行正常
return x;
}
return x;
} funB(false, 0); // 返回 0
funB(true, 0); // 返回 100

let 和bar 的区别:

  • 作用不同,let是有严格的块作用域。
  • 在块中,不能重复声明,要先声明后使用。

const声明

const 声明与 let 声明相似,它与 let 拥有相同的作用域规则。但 const 声明的是常量,常量不能被重新赋值。但是如果定义的常量是对象,对象里的属性值是可以被重新赋值的

const msg = "This is a message";
msg = "xx" // 编译报错 const person = {
name: "Aurora",
age: 20
} person = {}; // 编译报错 person.name = "tom" // OK
person.age = 10 // OK

 解构数组

最简单的解构莫过于数组的解构赋值:

let input = [1, 2];
let [first, second] = input;
console.log(first); // outputs 1
console.log(second); // outputs 2

作用与函数参数:

function f([first, second]: [number, number]) {
console.log(first);
console.log(second);
}
f(input);

在数组里使用...语法创建剩余变量:

let [first, ...rest] = [1, 2, 3, 4];
console.log(first); // outputs 1
console.log(rest); // outputs [ 2, 3, 4 ]

忽略不需要的元素:

let [first] = [1, 2, 3, 4];
console.log(first); // outputs 1 let [, second, , fourth] = [1, 2, 3, 4];

对象解构

let o = {
a: "foo",
b: 12,
c: "bar"
};
let { a, b } = o;

通过 o.a and o.b 创建了 a 和 b 。 注意,如果你不需要 c 你可以忽略它。

就像数组解构,你可以用没有声明的赋值:

({ a, b } = { a: "baz", b: 101 });

注意,我们需要用括号将它括起来,因为Javascript通常会将以 { 起始的语句解析为一个块。

在对象里使用...语法创建剩余变量:

let { a, ...passthrough } = o;
let total = passthrough.b + passthrough.c.length;

函数声明

解构也能用于函数声明。 看以下简单的情况:

type C = { a: string, b?: number }
function f({ a, b }: C): void {
// ...
}

TypeScript 变量声明(二)的更多相关文章

  1. Typescript变量声明

    let 和 const 是 javascript 里面最新的变量声明方式,let 与 var 很相似,而 const 是 let 的增强,能阻止对一个变量的再次赋值. var 声明 弱类型:var 声 ...

  2. typescript变量声明(学习笔记非干货)

    var a=10; function f(){ var message="hello,world"; return message; } function f(){ a=10; r ...

  3. TypeScript的变量声明

    1.全新的变量声明方式 let和const是JavaScript ES6中新添加的变量声明方式.let在很多方面与var是相似的,但是它可以避免一些在JavaScript里常见一些问题. 而const ...

  4. TypeScript 素描-变量声明

    博文读自 TypeScript 官方文档而来,不具有学习性,仅是本人学习时记录以供日后翻阅 ,有学习TypeScript的朋友还请去看更为详细的官方文档 /* 变量声明在之前的js中一直是使用var关 ...

  5. devi into python 笔记(二)元组 变量声明 和列表解析

    元组tuple: 类似list,只是tuple是不可变的list.类似java的String都是不可改变的.注意:tuple没有方法(有待考证),不可以像list那样那个list.pop 或者list ...

  6. Typescript学习笔记(三)变量声明及作用域

    ts的变量声明有var,let和const,这尼玛完全跟es6一样嘛.就稍微介绍一下. 大多数js开发者对于var很熟悉了,原生js里没有块级作用域,只有函数作用域和全局作用域,还存在var的变量提升 ...

  7. Typescript 学习笔记二:数据类型

    中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...

  8. js 碎片整理(变量声明,函数作用域)

    1.变量声明: 在非严格模式下,函数可以对未声明的变量赋值,而这样赋值的结果就是该变量就会变成全局变量. (function(){ var a = 1; })(); console.log(a) ; ...

  9. 变量声明---let,const,解构

    let在很多方面与var是相似的,但是可以帮助大家避免在JavaScript里常见一些问题. const是对let的一个增强,它能阻止对一个变量再次赋值. 块作用域 当用let声明一个变量,它使用的是 ...

随机推荐

  1. cookie、localStorage和sessionStorage区别

    三者区别见下表: 说明: cookie的处理过程为: 服务器向客户端发送cookie 浏览器将cookie保存 之后每次http请求浏览器都会将cookie发送给服务器端 对于 cookie,我们还需 ...

  2. SpringMVC学习小结

    配置web.xml: <servlet> <servlet-name>dispatcherServlet</servlet-name> <servlet-cl ...

  3. SSH限制ip登陆

    linux限制IP访问ssh   在/etc/hosts.allow输入   (其中192.168.10.88是你要允许登陆ssh的ip,或者是一个网段192.168.10.0/24)   sshd: ...

  4. java基础讲解04-----数据类型和运算符

    1.java的基本数据类型 1.数值型  { 整数型   byte  , short  ,int  ,long 浮点型   float , double } 2.字符型 3.布尔型 2.运算符 1.赋 ...

  5. Python selenium -- cookie处理

    转自:http://www.cnblogs.com/fnng/p/3269450.html 本节重点: driver.get_cookies() 获得cookie信息 add_cookie(cooki ...

  6. Android 自己定义ViewGroup手把手教你实现ArcMenu

    转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/37567907 逛eoe发现这种UI效果,感觉非常不错,后来知道github上有这 ...

  7. unity, iterate immediate children and iterate all children

    遍历所有直接子节点(immediate children): foreach (Transform child in transform) { // do whatever you want with ...

  8. PHP的CURLOPT_POSTFIELDS参数使用数组和字符串的区别

    手册上解释: CURLOPT_POSTFIELDS  全部数据使用HTTP协议中的"POST"操作来发送.要发送文件,在文件名前面加上@前缀并使用完整路径.这个参数可以通过urle ...

  9. 点滴积累【JS】---JS小功能(onmousedown实现鼠标拖拽div移动)

    效果: 思路: 利用onmousedown事件实现拖拽.首先获得鼠标横坐标点和纵坐标点到div的距离,然后当鼠标移动后再用可视区的距离减去横纵坐标与div的距离.然后在判断不让DIV移出可视区,然后再 ...

  10. Ubuntu 启动项、菜单 改动 防止隐藏

    因为电脑有多个系统,默认的grub引引导菜单是隐藏的,须要略微改动下方可显示 不要直接改动boot/grub/grub.cfg  要直接改动/etc/default/grub,然后update-gru ...