总目录

从C#到TypeScript - 变量

TypeScript的变量声明和ES6差不多,相比之前主要是多了letconst

为什么不用var

不管是TypeScript还是ES6都会兼容以前的javascript,所以在TypeScript里var也还是保留了。

虽然C#里也有var,但和JavaScript的可不一样,var在javascript里会有一些奇怪的表现,比如会置前,而且作用域是整个函数,可以不写var来声明变量,然后变量变成全局。

这些都可能会带了一些不容易注意到的问题。

比如经典的:

for (var i = 0; i < 10; i++) {
setTimeout(function() { console.info(i); }, 100);
}

结果并不是期望的0, 1, 2, 3...,跑出来的结果全是10,这是因为var出来的i的作用域是整个函数。

这就导致循环完成后i变成10,setTimeout内的函数才被执行,所以结果都是10了。

虽然可以用立即完成函数把重新构建一个作用域,但毕竟用起来麻烦,而且不符合人的思维,所以就有了let

使用let声明变量

let主要是对var的一个代替,用let更符合人思考的过程,这才和C#var的功能是差不多。

let的用法和var是一样的:

let str = 'string';

let的作用域是块级作用域,比如上面的循环,用let声明i的话就可心得到期望的值

for (let i = 0; i < 10; i++) {
setTimeout(function() { console.info(i); }, 100);
}

这里得到的结果就是0, 1, 2....9。

所以建议还是抛弃var,选择let

const

C#也有const,意义上差不多,都是常量,不想变量被改变。

const str = 'string';
str = 'new string'; // 编译不了

一般情况下,主张确定不变的变量用const声明来增加代码健壮性和可读性。

解构

所谓解构,就是把对象或数组里的成员分解出来。

比如数组:

let [first, second] = [1, '2', false];
console.info(`first: ${first}`);

这里就把数组的第一个成员和第二个成员分别用firstsecond解构出来,就省去了分别声明两个变量,并用下标取数组里的值来赋值了。

这也可以方便的提供一些功能,比如交换数组里的两个值,按以前的做法需要借助下中间变量,现在就不需要了:

let [first, second] = [second, first];

可以利用...扩展符号来解开数组,再并入其他数组。

let arr = [1, 2, 3];
let newArr = [...arr, 4, 5];
console.info(newArr); // 1, 2, 3, 4, 5

对象同样可以被解构:

class Test{
str = "string";
int = 1;
bool = false; func(){
console.info('func');
}
}
let {str, bool, func} = new Test(); //名字必须和类里的保持一致
let {str: newStr} = new Test(); //通过这种方式可以把str改为newStr
console.info(`${str}, ${bool}`);
func();

...符号同样可以用于对象,不过只能解开可枚举的变量,所以函数不会解出来。

延用上面的class:

let {str, ...other} = new Test();
console.info(other.int); // 输出1
console.info(other.func()); // 编译错误,...符号不能解出函数

还可以加上默认值,当解出来的值是undefined时会用上默认值

class Test{
empty;
str = '';
}
let {empty='empty', str='str'} = new Test();
console.info(`${empty}, ${str}`); // 输出 empty, ,因为str有值,所以用原始的''

以上就是常用的变量声明及赋值的使用方法,不过基本都是ES6的标准语法,TypeScript本身并没有在上面多做什么。

从C#到TypeScript - 变量的更多相关文章

  1. Typescript - 变量类型

    原文:TypeScript基本知识点整理 一.number let num1 : number = 20; let num2 : number = 175.5; let a1 : number = I ...

  2. Typescript变量声明

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

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

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

  4. TypeScript 变量声明(二)

    ES6 中,变量声明一共有6种,分别是var.function .let.const.class和import. let 基本语法:let 变量名 :类型.其中类型不是必须的. 1.用于声明变量,其用 ...

  5. C# vs TypeScript - 高级类型

    总目录 从C#到TypeScript - 类型 从C#到TypeScript - 高级类型 从C#到TypeScript - 变量 从C#到TypeScript - 接口 从C#到TypeScript ...

  6. 从C#到TypeScript - 接口

    总目录 从C#到TypeScript - 类型 从C#到TypeScript - 高级类型 从C#到TypeScript - 变量 从C#到TypeScript - 接口 从C#到TypeScript ...

  7. 从C#到TypeScript - 类

    总目录 从C#到TypeScript - 类型 从C#到TypeScript - 高级类型 从C#到TypeScript - 变量 从C#到TypeScript - 接口 从C#到TypeScript ...

  8. 从C#到TypeScript - function

    总目录 从C#到TypeScript - 类型 从C#到TypeScript - 高级类型 从C#到TypeScript - 变量 从C#到TypeScript - 接口 从C#到TypeScript ...

  9. 从C#到TypeScript - 装饰器

    总目录 从C#到TypeScript - 类型 从C#到TypeScript - 高级类型 从C#到TypeScript - 变量 从C#到TypeScript - 接口 从C#到TypeScript ...

随机推荐

  1. ELK 日志分析体系

    ELK   日志分析体系 ELK 是指 Elasticsearch.Logstash.Kibana三个开源软件的组合. logstash                       负责日志的收集,处 ...

  2. 有趣的keil MDK细节(转)

    源:有趣的keil MDK细节 1.MDK中的char类型的取值范围是? 在MDK中,默认情况下,char 类型的数据项是无符号的,所以它的取值范围是0-255.它们可以显式地声明为signed ch ...

  3. eclipse中安装配置maven

    1.首先说一下在windows中安装maven.非常简单... 到http://maven.apache.org/download.html中下载maven,截止笔者发文时,maven最新版本为mav ...

  4. X-003 FriendlyARM tiny4412 uboot移植之添加相应目录文件

    X-003 FriendlyARM tiny4412 uboot移植之添加相应目录文件 <<<<<<<<<<<<<< ...

  5. eclipse 完全智能提示

     1.添加智能提示 eclipse的代码提示是按”.”这个字符提示的,而如果想在其他的条件下触发,则需要按Alt + / 或者是 Ctrl + Space手动调用 (Ctrl + Space原先是Ec ...

  6. 写一篇 Bootstrap弹窗确认的文章。本周完成

    思路; 点击按钮,显示模态 点击确定,异步提交 根据结果,删除指定的记录

  7. ECSHOP中ajax的调用原理

    ECSHOP中ajax的调用原理 ecshop中ajax的调用原理. 1.首先ecshop是如何定义ajax对象的. ecshop中的ajax对象是在js/transport.js文件中定义的.里面是 ...

  8. DataTabel DataSet 对象 转换成json

    public class DataTableConvertJson    { #region dataTable转换成Json格式        /// <summary>         ...

  9. Django performance

    Reference: https://impythonist.wordpress.com/2016/02/21/building-high-performance-django-systems/ Th ...

  10. Python twisted article

    学习python twisted 的好文章 An Introduction to Asynchronous Programming and Twisted Reference: http://kron ...