首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

Typescript学习笔记,从入门到精通,持续记录

如果定义时候有赋值类型就会被推断为这个值得类型; 如果定义时候没有赋值,不管之后有没有赋值,都会被推断成 any 类型而完全不被类型检查 2.任意值(any) 如果是一个普通类型赋值过程改变类型是不被允许...当 TypeScript 不确定一个联合类型变量到底是哪个类型时候,我们只能访问此联合类型所有类型里共有的属性或方法 function getLength(something: string |...换句话说,可选参数后面不允许再出现必需参数了 6.2 参数默认值 ES6 ,我们允许给函数参数添加默认值,TypeScript 会将添加了默认值参数识别为可选参数,此时就不受「可选参数必须接在必需参数后面.../ TypeScript 核心库定义文件定义了所有浏览器环境需要用到类型,并且是预置 TypeScript 。...故当我们书写一个全局变量声明文件时,如果需要引用另一个库类型,那么就必须用三斜线指令 当我们需要依赖一个全局变量声明文件时,当我们需要依赖一个全局变量声明文件时,由于全局变量不支持通过 import

2K50
您找到你想要的搜索结果了吗?
是的
没有找到

TypeScript 官方手册翻译计划【二】:普通类型

代码中最常见一些数据类型,同时也会解释这些类型 TypeScript 对应描述方式。...类型注解总是跟在要声明类型东西后面。 不过,大多数情况下,注解并不是必需TypeScript 会尽可能地在你代码自动进行类型推断。...TypeScript 允许你指定函数输入和输出类型参数类型注解 当你声明一个函数时候,你可以每个参数后面添加类型注解,从而声明函数可以接受什么类型参数。... TypeScript 4.2 版本之前,类型别名名字可能会出现在报错信息,有时会代替等效匿名类型(可能需要,也可能不需要)。...上面的例子变量只有一个可能值,这是没有意义

2.2K20

TypeScript 官方手册翻译计划【三】:类型收缩

它会查看这些特殊检查语句(也就是“类型保护”)和赋值语句,并将声明类型精炼为更具体类型,这就是所谓类型收缩”。很多编辑器,我们可以观察到这些类型变化。...正如我们先前提到,当我们给任意变量赋值时候,TypeScript 会查看赋值语句右部,对左部变量类型进行合适收缩。...TypeScript 可以对这段代码进行分析,并发现函数体剩余部分(return padding + input;) padding 为 number 时候是不可。...任何时候,只要给 isFish 传递参数并调用它,TypeScript 就会在该类型兼容初始类型时候,将变量类型收缩为该具体类型。...当联合类型每个类型都包含一个字面量类型公共属性时候,TypeScript 会将其视为一个可辨识联合类型,并通过收缩确认类型联合类型某个成员。

2K20

TypeScript 演化史 — 第二章】基于控制流类型分析 和 只读属性

image.png 基于控制流类型分析 TypeScript 官网总结了基于控制流类型分析: TypeScript 2.0 实现了对局部变量参数控制流类型分析。...使用 TypeScript 2.0,类型检查器会分析语句和表达式所有可能控制流,在任何指定位置对声明为联合类型局部变量参数产生最可能具体类型(缩小范围类型)。...尽管如此,类型检查器在任何给定位置都为 command 变量使用最具体类型 分配了字符串 “pwd” 之后,command 变量不可能是字符串数组(联合类型惟一其他选项)。...严格 null 检查模式下,undefined 类型会自动添加到可选属性联合类型,因此我们不必显式将其写出。 明确赋值分析 基于控制流另一个新特性是明确赋值分析。...其思想是确保每个不可局部变量使用之前都已正确初始化。 只读属性 TypeScript 2.0 ,readonly 修饰符被添加到语言中。

2K10

TypeScript学习笔记(二)—— TypeScript基础

5.2、访问联合类型属性或方法 当 TypeScript 不确定一个联合类型变量到底是哪个类型时候,我们只能访问此联合类型所有类型里共有的属性或方法: function getLength(something...,可选参数必须接在必需参数后面。...9.2、类型断言用途 类型断言常见用途有以下几种: 9.2.1、将一个联合类型断言为其中一个类型 之前提到过,当 TypeScript 不确定一个联合类型变量到底是哪个类型时候,我们只能访问此联合类型所有类型中共有的属性或方法...9.2.4、将 any 断言为一个具体类型 日常开发,我们不可避免需要处理 any 类型变量,它们可能是由于第三方库未能定义好自己类型,也有可能是历史遗留或其他人编写烂代码,还可能是受到... Animal 类型 animal 了——就像面向对象编程我们可以将子类实例赋值类型为父类变量

5K20

TypeScript进阶

例如:将一个联合类型变量指定为一个更加具体类型(但不能指定为联合类型不存在类型): // 使用联合类型时,必须使用这些类型共有的属性才行,但使用类型断言使其确定为某一种类型,就没有了此限制。...可选参数 同接口可选属性一样,用 ? 表示可选参数。 可选参数必须接在必需参数后面,即可选参数后不能有必须参数。...联合类型使用 | 分隔每个类型,表示可以赋值为其中一种。...// 但访问 string 和 number 共有属性不会报错,如:return something.toString(); 当联合类型变量在被赋值时候,会根据类型推论规则推断出一个类型,此时访问该类型属性不会报错...参数默认值 ES6,允许给函数参数添加默认值,TS 会将添加了默认值参数识别为可选参数,因此可选参数可以不必须接在必需参数后面。

96020

如何利用 TypeScript Extract 提升类型定义与代码清晰度

一、TypeScript 联合类型简介 TypeScript 联合类型(Union Types)是一个非常重要特性,它允许单个变量持有多种类型值。...可以把联合类型想象成一个能根据不同情况戴上不同帽子变量。例如,一个变量某些情况下可能是字符串,而在另一些情况下可能是数字。...接下来,我们将继续深入探讨联合类型其他高级用法,以及如何利用 TypeScript 工具类型来进一步简化和优化我们代码。 二、 高级联合类型操作 联合类型不仅仅是为了声明可以拥有多种类型变量。...三、Extract 类型操作符 TypeScript 联合类型就像我们类型工具箱瑞士军刀——多功能且必不可少。然而,某些场景,我们需要却是一把手术刀:精确且锋利。...; // 错误用法,尝试使用非文本类型会导致 TypeScript 类型错误 handleText(42); // TypeScript 类型错误: 参数类型 'number' 不能赋值参数类型

5910

【Vue3+TypeScript】CRM系统项目搭建之 — 关于拥抱 TypeScript 这件事【下】

TypeScript 类型检测其实最主要针对并不是变量,而是函数。因为 JavaScript 函数时不考虑参数类型和个数。...可以直接使用字面量进行类型声明 let a: 10; a = 10; 这样就规定了其只可以 a 被 10 赋值 TypeScript 可以使用 | 来连接多个类型联合类型】 let c: boolean..."; d = true; 因此,一个变量设置类型为 any 后,相当于对该变量关闭了 TS 类型检测,TS 压根就不管这个变量了,TypeScript 不建议使用 any。...any 类型变量赋值给任意变量。...当一个 unknown 类型变量想要赋值给其它变量时候,可以赋值之前做一个类型判断。

7610

系统学习 TypeScript(五)——联合类型

[TypeScript] 前言 初步学习了 TypeScript 变量声明后,对它静态类型检查功能简直是爱不释手,但同时也发现一个问题:正常开发,一个变量类型有时可能不仅仅只限于 number...注意:对于指定了联合类型变量,其值类型必须只能是联合类型包含某一种,如果取了联合类型之外类型值,在编译过程中会报错。 指定了联合类型变量可以在运行过程中被赋予联合类型任一类型值。...函数传参 我们函数传参也可以使用联合类型来控制参数预期类型: function sayRes(res: number | string){ console.log(res); } sayRes...if (res.toString() === "12") { } } 类型推断 对于联合类型变量赋值后会根据值类型推断该变量类型。...总结 以上就是 TypeScript 联合类型相关知识,总结起来就是: 联合类型包含了变量可能所有类型; 对联合类型变量赋值联合类型之外值,会产生报错; 不能确定联合类型变量最终类型之前,只能访问联合类型所共有的属性和方法

1.1K20

TS 进阶 - 类型基础

TypeScript ,symbol 类型并不具有这一特性,多个具有 symbol 类型对象,它们 symbol 类型都是 TypeScript 同一个类型。...'; } # 联合类型 联合类型,代表一组类型可用集合,只要最终赋值类型属于联合类型一员,就可以通过类型检查。...为了简单,可以构造函数参数应用访问性修饰符。参数会被直接作为类成员(即实例属性),不需要再手动添加属性和赋值。...{} // foo, bar 都会被推导为 any 类型 any 类型变量几乎无所不能,它可以声明后再次接受任意类型值,同时可以被赋值给任意其他类型变量: let anyVal: any =...如果是要表达一个未知类型,考虑使用 unknown 类型 # unknown unknown 类型变量可以再次赋值为任意其他类型,但注意只能赋值给 any 或 unknown 类型变量: let

1.7K50

Typescript常看常新

写得超级详细,保证有很多你不知道小细节。 函数 如果变量赋值为一个函数,变量类型有两种写法。...const obj = {}; obj.prop = 123; // 报错 上面示例变量obj值是一个空对象,然后对obj.prop赋值就会报错。...Fn类型参数Type具体类型,需要函数id使用时提供。...所以,最后一行赋值语句不需要给出Type具体类型。 此外,第二种写法还有一个差异之处。那就是它类型参数定义某个方法之中,其他属性和方法不能使用该类型参数。...将Obj中所有属性对应类型都修改为了string类型,变成了一个新类型 in 运算符 TypeScript 语言类型运算,in运算符有不同用法,用来取出(遍历)联合类型每一个成员类型

16610

TypeScript基础常用知识点总结

变量类型声明是ts一个非常重要特点,通过类型声明可以指定当前ts变量数据类型。指定类型后,当为变量赋值时后,TS编译器会自动检查是否符合类型声明,符合则赋值,不符合则报错。...TypeScript—数组类型 TypeScript ,数组类型有多种定义方式,比较灵活。...TypeScript联合类型 联合类型(Union Types)表示取值可以为多种类型一种。...联合类型变量在被赋值时候,会根据类型推论规则推断出一个类型: let myFavoriteNumber: string | number; myFavoriteNumber = 'seven';...当 TypeScript 不确定一个联合类型变量到底是哪个类型时候,我们只能访问此联合类型所有类型中共有的属性或方法: interface Cat { name: string;

4.8K30

TypeScript 类型体操 - 基础操作

不同类型变量可做操作不同:number 类型可以做加减乘除等运算,boolean 就不可以,复合类型不同类型对象可用方法不同,比如 Date 和 RegExp,变量类型不同代表可以对该变量操作就不同...R : never; // 类型参数用于接受具体类型类型运算也相当于局部变量 type isNumber = T extends number ?...但其实也不能叫变量,因为它们是不可。想要变化就需要重新构造新类型,并且可以构造新类型过程对原类型做一些过滤和变换。...TypeScript 类型系统高级类型也同样支持递归,类型体操,遇到数量不确定问题,要条件反射想到递归。...当类型参数联合类型,并且条件类型左边直接引用该类型参数时候,TypeScript 会把每一个元素单独传入来做类型运算,最后再合并成联合类型,这种语法叫做分布式条件类型

1.8K60

TypeScript函数类型

{ return x+y; }; 这是可以通过编译,不过事实上,上面的代码只对等号右侧匿名函数进行了类型定义,而等号左边 mySum,是通过赋值操作进行类型推论而推断出来。...{ return x+y; }; 注意不要混淆了 TypeScript => 和 ES6 =>。... TypeScript 类型定义,=> 用来表示函数定义,左边是输入类型,需要用括号括起来,右边是输出类型。...==-1; } 采用函数表达式|接口定义函数方式时,对等号左侧进行类型限制,可以保证以后对函数名赋值时保证参数个数、参数类型、返回值类型不变。...参数默认值 ES6 ,我们允许给函数参数添加默认值,TypeScript 会将添加了默认值参数识别为可选参数: function buildName(firstName:string,lastName

2K30

TypeScript 基础教程

为什么需要使用TS *** 通过引入强类型系统,补充JS短板。原生JS类型灵活性导致实际环境可能会出现各种不确定bug。...: number; } let bar: Person = { name: 'bar', sex: "man", age: 18, } Typescript 函数类型声明 *** 函数声明主要涉及到函数参数类型声明以及函数返回值类型限定...: 定义:字面量类型使用竖线直接分割值(PS:联合类型是使用竖线联合类型,这里是值),此变量值只能从分隔值其中一个,使用 类型别名 type 搭配 |声明。...) as HTMLElement; } 类型推论: 定义:TypeScript 会通过变量或返回值等赋值时推导出这个值类型,如果在随后代码又进行了不同类型赋值,那么编译会报错: let foo...如果定义时候没有赋值,不管之后有没有赋值,都会被推断成 any 类型而完全不被类型检查 let foo; foo = 'bar'; foo = 18; //ok 特别对于联合类型时,类型推论会限制到只能访问联合类型类型共有属性

1K20

【TS 演化史 -- 17】各文件JSX工厂 、有条件类型和映射类型修饰符

never类型TypeScript 底层类型,表示从未出现类型。 分布式有条件类型 那么,为什么e 条件类型和never类型组合是有用呢?它有效地允许咱们从联合类型删除组成类型。...咱们可以通过清除never类型来简化生成联合类型: type NonNullableUserPropertyKeys = "name"; User类型唯一不可为空属性键是“name”。...:User类型,只有name属性不可空。...TypeScript 一个长期存在特性要求是能够提取给定函数返回类型。下面是ReturnType类型简化版本,该类型lib.es5.d.ts预定义。...预定义有条件类型 TypeScript 2.8 lib.d.ts里增加了一些预定义有条件类型: Exclude -- 从T剔除可以赋值给U类型

2.5K20

TS核心知识点总结及项目实战案例分析

可选属性表示了接口里某些属性不是必需,所以可以定义也可以不定义.可读属性使得接口中某些属性只能读取而不能赋值....TypeScript里我们可以参数名旁使用 ?实现可选参数功能。具体案例如下: function createName(firstName: string, lastName?...高级类型 typescript高级类型里我们主要讲解如下核心知识点: 交叉类型 联合类型 多态 this类型 索引类型查询操作符 索引访问操作符 交叉类型是将多个类型合并为一个类型。...: 如果一个值是联合类型,我们只能访问此联合类型所有类型里共有的成员。...还有一种常见需求是, 我们实现自己类后,需要支持类方法链式调用, 这个时候我们应该返回this, typescript我们就需要了解多态 this类型.

1.6K10

TypeScript基础(一)基本类型类型运算

引言 -- TypeScript是一种开源编程语言,它是JavaScript超集,意味着所有的JavaScript代码都可以TypeScript运行。...以下是对常见类型运算符进行介绍: 1. 联合类型(Union Types) 使用 | 运算符将多个类型组合成一个联合类型。表示变量可以是多个类型任意一个。...然后将其用于声明变量p。 通过使用类型别名,我们可以将复杂类型定义简化为一个易于理解和使用名称。 类型约束 TypeScript,函数可以通过参数类型、返回值类型和函数重载等方式进行约束。...通过参数类型约束、返回值类型约束和函数重载等方式,我们可以TypeScript对函数进行更精确约束和定义,以提高代码可读性、可维护性和可靠性。...总结 -- 通过了解这些基本类型类型运算,开发者可以更好地定义变量、函数参数和返回值数据类型,并在编码过程捕获潜在错误。

19930
领券