Typescript学习笔记(三)变量声明及作用域
ts的变量声明有var,let和const,这尼玛完全跟es6一样嘛。就稍微介绍一下。
大多数js开发者对于var很熟悉了,原生js里没有块级作用域,只有函数作用域和全局作用域,还存在var的变量提升的问题,导致一些不熟悉js的开发者会发现一些怪异事件。点击查看关于es6的let与const
let声明
let声明和var一样的写法,大家看前面的博客里面相信也看到了。
拣重要的说,let和var的区别就是let使js实现了它的块级作用域,即词法作用域或块作用域。
而且它不存在变量提升。
function f(input: boolean) {
let a = 100;
if (input) {
// Still okay to reference 'a'
let b = a + 1;
return b;
}
// Error: 'b' doesn't exist here
return b;
}
内部块一样能访问外部块,反之就不行了。这一特性使for循环的计数器就比较好用了,
for(let i = 0; i < arr.length; i++){}
console.log(i)
//ReferenceError: i is not defined
// 报错
function () {
let a = 10;
var a = 1;
} // 报错
function () {
let a = 10;
let a = 1;
}
let是不允许重复声明的。
需要注意的是,现在的ts编译器都是吧let直接编译为var,所以let的特性在浏览器支持之前还是无法试用的。
在js里面输出10个10的例子,在let下就不一样了。
for (let i = 0; i < 10 ; i++) {
setTimeout(function() {console.log(i); }, 100 * i);
}
不仅是在循环里引入了一个新的变量环境,而是针对每次迭代都会创建这样一个新作用域。 这就是我们在使用立即执行的函数表达式时做的事。
他会和我们预想的一样输出1-10。
const
const和let基本一致,只是const声明的变量被赋值后不能再改变(所以对于const来说,只声明不赋值,就会报错),作用域同let。
const numLivesForCat = 9;
const kitty = {
name: "Aurora",
numLives: numLivesForCat,
} // Error
kitty = {
name: "Danielle",
numLives: numLivesForCat
}; // all "okay"
kitty.name = "Rory";
kitty.name = "Kitty";
kitty.name = "Cat";
kitty.numLives--;
const a = [];
a.push("Hello"); // 可执行
a.length = 0; // 可执行
a = ["Dave"]; // 报错
这个数组和对象本身是可写的,但是如果将另一个数组赋值给const变量,就会报错。
使用的法则:
所有变量除了你计划去修改的都应该使用const
Typescript学习笔记(三)变量声明及作用域的更多相关文章
- Typescript 学习笔记三:函数
中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...
- ES6学习笔记之变量声明let,const
最近用淘宝的weex做了个项目,最近稍微闲下来了.正好很久没有接触RN了,所以趁这个机会系统的学习一下ES6的相关知识. 孔子说:没有对比就没有伤害.所以我们要拿ES6和ES5好好对比的学习.这样才能 ...
- 批处理学习笔记3 - 变量声明和goto代替while循环
批处理中没有while循环,只能用goto代替.下面是代码 @echo off set /a i = 0 :again echo %i% set /a i= %i% + 1 if %i% lss 10 ...
- scala学习笔记:变量声明中的模式
先看个正常的写法: scala> val x = 1 x: Int = 1 体会一下元组的写法: scala> val (x,y,z)=(1,2,3) x: Int = 1 y: Int ...
- typescript学习笔记(三)---接口
关于第二章的学习笔记是变量声明. 接口:TypeScript的核心原则之一是对值所具有的结构进行类型检查. 它有时被称做“鸭式辨型法”或“结构性子类型化”. 在TypeScript里,接口的作用就是为 ...
- Typescript 学习笔记二:数据类型
中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...
- Typescript 学习笔记四:回忆ES5 中的类
中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...
- Typescript 学习笔记七:泛型
中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...
- Typescript 学习笔记六:接口
中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...
- Typescript 学习笔记五:类
中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...
随机推荐
- vue实现双向数据绑定之Object.defineProperty()篇
前言 vue.js中使用ES5的Object.defineProperty()实现数据的双向绑定 Object.defineProperty()原理 Object.defineProperty()可以 ...
- Vue+iview实现添加删除类
<style> .tab-warp{ border-bottom: solid 1px #e0e0e0; overflow: hidden; margin-top: 30px; posit ...
- jq简单仿上传文件
html: <div> <input id="lefile" type="file" style="display:none&quo ...
- Django 2.11 静态页面404 解决
在settings中配置 STATIC_URL = '/static/' STATICFILES_DIRS = ( os.path.join(BASE_DIR,"static"), ...
- 微信小程序支付功能
API:wx.requestPayment() { } https://blog.csdn.net/qishubiao/article/details/80804052
- vue循環語句
迭代數組: v-for="site in sites”,sites表示源數組名,site表示數組元素: 迭代對象: v-for=“value in Object”, v-for=" ...
- C-LODOP设置同一页面 手机电脑都打印
C-Lodop有四种角色,1:客户端本地打印方式客户端访问web,调用客户端本地的打印机进行打印,这时候调用的安装在客户端本地的c-lodop服务,实际调用的是http://Localhost:800 ...
- Lodop背景图无图片时显示放大叉号问题
正常情况下,如果指定图片路径中,图片不存在或指定错误的路径,会因为找不到图片显示叉号,Lodop背景图如果设置了背景图宽度高度控制,显示的叉号也会被相应的放大,形成放大的模糊的图案,看起来就像是黑色边 ...
- oracle逗号分隔函数
SELECT wm_concat(GZTYPE) str FROM TB_FDN_WORKKIND
- Visual Studio 2017 and Swagger: Building and Documenting Web APIs
Swagger是一种与技术无关的标准,允许发现REST API,为任何软件提供了一种识别REST API功能的方法. 这比看起来更重要:这是一个改变游戏技术的方式,就像Web服务描述语言一样WSDL( ...