月小泪的TypeScript学习笔记（一）

TypeScript学习笔记（一）

TypeScript（以下简称TS) 是 微软爸爸开发的JavaScript 的一个超集，支持 ES6编码风格（ES6编码风格将会在下一篇中给出介绍）。

设计目标是开发大型应用，可编译成纯 JS，编译完了的JS可以运行在任何一个服务器上。

 

TS 是一种给 JS 添加特性的语言扩展。增加的功能包括：

• 类型批注和编译时类型检查
• 类型推断
• 类型擦除
• 接口
• 枚举
• Mixin
• 泛型编程
• 名字空间
• 元组
• Await

 

 ？（问号）操作符

该部分参考地址：https://github.com/e2tox/blog/issues/9

在TS里4个地方会出现问号操作符

 

三元运算符

// 当 isTrue(input) 为 True 是返回 ? : 之间的部分； 
// isTrue(input) 为 False 时, 返回 : ; 之间的部分
const a = isTrue(input) ? input : '';

这部分用法与JAVA/Python等语言中用法类似   

参数

// 这里的 ？表示这个参数 field 是一个可选参数
function getUser(user: string, field?: string) {
}

 

成员

// 这里的？表示这个name属性有可能不存在
class A {
  name?: string
}

interface B {
  name?: string
}

 

安全链式调用

// 这里 Error对象定义的stack是可选参数，如果这样写的话编译器会提示
// 出错 TS2532: Object is possibly 'undefined'.
return new Error().stack.split('\n');

// 我们可以添加?操作符，当stack属性存在时，调用 stack.split。若stack不存在，则返回空
return new Error().stack?.split('\n');

// 以上代码等同以下代码, 感谢 @dingyanhe 的监督
const err = new Error();
return err.stack && err.stack.split('\n');

 

！（感叹号）操作符

在TS里有3个地方会出现感叹号操作符

 

一元运算符

// ! 就是将之后的结果取反，比如：
// 当 isNumber(input) 为 True 时返回 False； isNumber(input) 为 False 时返回True
const a = !isNumber(input);

这部分用法与JAVA/Python等语言中用法类似   

 

成员

// 因为接口B里面name被定义为可空的值，但是实际情况是不为空的，那么我们就可以
// 通过在class里面使用！，重新强调了name这个不为空值
class A implemented B {
  name!: string
}

interface B {
  name?: string
}

 

强制链式调用

// 这里 Error对象定义的stack是可选参数，如果这样写的话编译器会提示
// 出错 TS2532: Object is possibly 'undefined'.
new Error().stack.split('\n');

// 我们确信这个字段100%出现，那么就可以添加！，强调这个字段一定存在
new Error().stack!.split('\n');

当然这种方法一般很少使用

先码到这儿吧，持续更进中~~~~