Typescript入门|青训营笔记定义： TypeScript 是 JavaScript 的超集，扩展了 JavaSc

这是我参与「第四届青训营」笔记创作活动的的第6天

一，重点内容：

typscipt与javascipt的区别
tyscipt基础数据类型
对象类型
函数类型
数组类型
泛型

二，详细知识点

typescipt 定义：

TypeScript 是 JavaScript 的超集，扩展了 JavaScript 的语法，因此现有的 JavaScript 代码可与 TypeScript 一起工作无需任何修改，TypeScript 通过类型注解提供编译时的静态类型检查。 js:动态类型

ts 静态类型

基础数据类型

js 转 ts，如图

//字符串类型
const q='str'          const q:string='str'
//数字类型
const w = 1;            const w:number=1
//布尔值
const e =true;      const e：boolean =true;

对象类型

key的类型是string 就是有了这个key 我们可以定义任意不在这个接口里的属性了，但属性的值必须是string类型

eg:

在JavaScript中我们很容易给对象动态添加属性

let developer = {}
developer.name = 'frontender'

以上代码在 JavaScript 中可以正常运行, 但在 TypeScript 中, 编译器会提示以下异常信息

Property 'name' does not exist on type '{}'.ts(2339)

使用索引签名

{}类型表示一个没有包含成员的对象, 所以该类型没有包含name属性. 为了解决这个问题, 我们可以声明一个 LooseObject类型

interface LooseObject {
  [key: string]: any
}

let developer: LooseObject = {}
developer.name = 'finder'

该类型使用索引签名的形式描述 LooseObject 类型可以接收 key 类型是字符串, 值的类型是any类型的字段. 有了LooseObject类型之后, 我们就可以通过上述代码解决动态添加属性的问题
对于 LooseObject 类型来说, 它的约束是很宽松的. 在一些应用场景中, 我们除了希望能支持动态的属性之外, 也希望能够声明一些必选和可选的属性.
比如对于一个表示开发者的 Developer 接口来说, 我们希望它的 name 属性是必填, 而 age 属性是可选的, 此外还支持动态地设置字符串类型的属性. 针对这个需求我们可以这样做

interface LooseStaticObject {
  name: string
  age?: number
  [key: string]: any
}

let coder: LooseStaticObject = { name: 'semlinker' }
coder.age = 30
coder.city = 'Dalian'

TypeScript: 如何为对象动态分配属性 - 知乎 (zhihu.com)

函数类型：

function add(x:number,y:number):number{
    return x+y;
}
const mult v= (x,y) =>x*y //匿名函数的写法

函数重载

数组类型

回调函数

直接传递一个类A的回调函数func到另一个类B中，执行这个回调函数时，this不一定指向A类对象了，如果想确保指向的还是那个A类对象的话，需要在传递那个函数时，先调用bind(this)。在调用回调函数时不要直接用func，而是改成func.call()。

接口

接口声明是命名对象类型的一种类型

interface If{
    name:string
	age?:number
}
const if1:If={
    name:'cidier',
    age:20
}
info.age
info.name

Typescript泛型

定义： 在定义函数时，不决定函数的参数类型，而是让调用者以参数的形式告知，函数的参数应该是什么样的类型。*

function iden <T, U>(value: T, message: U) : T {
  console.log(message);
  return value;
}

<T> 内部的 T 被称为类型变量，它是我们希望传递给 iden函数的类型占位符，同时它被分配给 value 参数用来代替它的类型：此时 T 充当的是类型，而不是特定的 Number 类型。其中 T 代表 「Type」，在定义泛型时通常用作第一个类型变量名称。但实际上 T 可以用任何有效名称代替。除了 T 之外，

常见泛型变量：

1, K（Key）：表示对象中的键类型；

2, V（Value）：表示对象中的值类型；

3, E（Element）：表示元素类型。

Typescript入门|青训营笔记

一， 重点内容：