首页
学习
活动
专区
圈层
工具
发布
    • 综合排序
    • 最热优先
    • 最新优先
    时间不限
  • 来自专栏全栈开发工程师

    TypeScript 4.5】004-第 4类型缩小

    TypeScript 4.5】004-第 4类型缩小 一、typeof 类型守卫 1、什么是类型缩小 含义 TypeScript 类型缩小就是从宽类型转化为窄类型的过程 类型缩小常用于处理联合类型变量的场景 fly } 五、instanceof 操作符缩小 1、概述 说明 JavaScript 使用 instanceof 操作符来检查一个值是否是另一个值的实例 instanceof 也是一个类型保护 TypeScript TypeScript 会查看赋值的右侧 并适当缩小左侧 代码示例 // let x: string | number let x = Math.random() < 0.5 ? PS D:\MyFile\VSCodeProjects\study-ts\第 4类型缩小\dist> node .\06-assignment.js number 1 string good morning console.log(typeof q) console.log(q) 执行结果 PS D:\MyFile\VSCodeProjects\study-ts\第 4类型缩小\dist> node

    41600编辑于 2025-01-06
  • 来自专栏前端学习教程

    TypeScript类型推断

    当我们在TypeScript中声明变量但没有明确指定其类型时,TypeScript会尝试根据变量的值进行类型推断。这样可以帮助我们避免手动指定所有类型,使代码更简洁,同时也提供了更好的类型安全性。 TypeScript 推断 y 为 string 类型let z = true; // TypeScript 推断 z 为 boolean 类型在这个例子中,我们没有显式地给变量x、y和z指定类型TypeScript "]; // TypeScript 推断 names 为 string[] 类型TypeScript会检查数组中所有元素的类型,并根据元素类型推断出数组的类型。 } 类型TypeScript会根据对象字面量中的键值对进行类型推断。 通过这些案例,你可以更好地理解TypeScript类型推断的过程和机制。类型推断使得代码更灵活、简洁,同时还增加了代码的可读性和类型安全性。

    1.1K00编辑于 2023-11-03
  • 来自专栏coldPlayer的前端专栏

    TypeScript类型守卫

    类型守卫在前几篇介绍了断言,在使用断言时我们已经确定了变量的类型,确定该类型时一定存在(否则则会欺骗编译,运行时报错),那么为什么还要类型守卫呢? 因为类型断言还是需要借助类型守卫的,类型守卫主要是用来判断未知类型是不是所需要的类型。 Student类型 if(val instanceof Student){ console.log('student' + val.study) }}4、自定义类型TS中有一个关键字 这种写法称作类型谓词,使用类型谓词的函数称为类型谓词函数,该函数的返回值必须的boolean类型。 (1)函数参数形式函数中的参数类型为多个类型,通过is关键字自定义类型,将函数参数精确到某种类型,然后再执行相应的逻辑。

    1.1K30编辑于 2023-11-20
  • 来自专栏前端学习教程

    TypeScript类型声明

    当我们使用TypeScript编写代码时,类型声明是非常重要的,它帮助我们定义变量、函数、类等的类型,从而提供更好的代码提示、类型检查和代码可读性。 以下是关于TypeScript类型声明的详细内容:基本类型声明在TypeScript中,我们可以使用以下关键字来声明基本类型:let num: number = 42;let str: string = (Type Assertion)类型断言允许我们手动指定变量的类型,并告诉TypeScript编译器我们知道更多关于变量的类型信息。 : number; readonly id: number;}以上是关于TypeScript类型声明的一些重要内容。通过合理使用类型声明,我们可以增强代码的可读性、类型安全性和可维护性。 类型声明是TypeScript的核心特性之一,可以帮助我们构建更健壮的代码和应用程序。我正在参与2023腾讯技术创作特训营第三期有奖征文,组队打卡瓜分大奖!

    89120编辑于 2023-11-06
  • 来自专栏全栈修仙之路

    TypeScript never 类型

    了解完底部类型的概念后,下面我们开始来介绍 TypeScript 中对应的底部类型 —— never 类型。 二、never 类型TypeScript 中,never 类型表示的是那些永不存在的值的类型。 通过这个示例,我们可以得出一个结论:使用 never 避免出现新增了联合类型没有对应的实现,目的就是写出类型绝对安全的代码。 而任意类型与 never 类型联合,则不会影响原有的类型: type T3 = number | never; // number type T4 = string | never; // string 同样,对于上面的运算结果,我们可以这样理解:若 type T = T3 | T4,则 T3 或 T4 类型的值可以赋给 T 类型的变量。

    4.8K10发布于 2020-03-05
  • 来自专栏全栈修仙之路

    TypeScript 元组类型

    阅读须知:本文示例的运行环境是 TypeScript 官网的 Playground,对应的编译器版本是 v3.8.3。 在 JavaScript 中是没有元组的,元组是 TypeScript 中特有的类型,其工作方式类似于数组。 元组可用于定义具有有限数量的未命名属性的类型。每个属性都有一个关联的类型。 针对这种情形,在 TypeScript 中就可以利用元组类型可选元素的特性来定义一个元组类型的坐标点,具体实现如下: type Point = [number, number?, number?] 六、只读的元组类型 TypeScript 3.4 还引入了对只读元组的新支持。我们可以为任何元组类型加上 readonly 关键字前缀,以使其成为只读元组。 Github - typescript-tuples

    2K20发布于 2020-03-11
  • 来自专栏appuploader使用操作流程

    TypeScript 基础类型

    TypeScript 基础类型 TypeScript 包含的数据类型如下表: 数据类型 关键字 描述 任意类型 any 声明为 any 的变量可以赋予任意类型的值。 **注意:**TypeScript 和 JavaScript 没有整数类型。 ---- Any 类型 任意值是 TypeScript 针对编程时类型不明确的变量使用的一种数据类型,它常用于以下三种情况。 ; // 字符串类型 x = false; // 布尔类型 改写现有代码时,任意值允许在编译时可选择地包含或移除类型检查,示例代码如下: let x: any = 4; x.ifItExists 而在TypeScript中启用严格的空校验(--strictNullChecks)特性,就可以使得null 和 undefined 只能被赋值给 void 或本身对应的类型,示例代码如下: // 启用

    1.1K10编辑于 2023-05-12
  • 来自专栏Web前端开发

    TypeScript 基础类型

    一、TypeScript 的安装及使用 1、安装 npm i typescript -g // ts 全局包 npm i ts-node -g // 使用 ts-node 直接运行 ts 文件 2、使用 将 TypeScript 转换为 JavaScript 代码: tsc test.ts 使用 node 命令来执行 test.js 文件: $ node test.js 二、TypeScript 基础类型 1、任意类型 any 声明为 any 的变量可以赋予任意类型的值 let any1: any = 4 console.log(any1); // 4 any1 = false console.log = `Hello, I am ${ name }`; 4、布尔类型 boolean 表示逻辑值:true 和 false let flag: boolean = true; 5、数组类型 声明变量为数组 ) let x: never; // 运行错误,数字类型不能转为 never 类型 x = 123;

    1.7K30发布于 2020-07-07
  • 来自专栏HueiFeng技术专栏

    TypeScript数组类型

    [类型+方括号] 在我们创建数组的时候同样我们可以定义数组内数据的类型,如下所示 var arr:number[]=[1,2,3] var arr2:string[]=["1","2","3"] var true] 接口形式 interface IArr{ [index:number]:number } var arrType3:IArr=[1,2,3] 通过如上代码我们限制了值只能为number类型 age:number } var arrType5:Array<IArrStudent>=[{ name:"Mr.A",age:18},{ name:"Mr.B",age:20}] 同样在这类型加方括号的形式也可以描述

    1.7K30发布于 2020-04-10
  • 来自专栏coldPlayer的前端专栏

    TypeScript交叉类型&联合类型

    一、交叉类型(Intersection types)什么事交叉类型呢?简单来说就是通过&符号将多个类型进行合并成一个类型,然后用type来声明新生成的类型。 这里分两种情况,如果同名属性的类型相同则合并后还是原本类型,如果类型不同,则合并后类型为never2.基本数据类型交叉any和number交叉结果是any类型,any和boolean交叉结果是any类型 = A & B & C;let abc: ABC = { inner: { d: false, e: 'className', f: 5 }};4. 键的类型是字面量类型或字面量联合类型字面量类型是可辨识的类型,当键的类型是不同的字面量类型,则交叉后类型为never类型。 二、联合类型(Union types)联合类型和交叉类型比较相似,联合类型通过|符号连接多个类型从而生成新的类型。它主要是取多个类型的交集,即多个类型共有的类型才是联合类型最终的类型

    1.8K21编辑于 2023-11-20
  • 来自专栏Web前端开发

    TypeScript 类型保护

    TypeScript 中使用联合类型经常会有下面的错误出现: ? ? 这时就需要用到类型保护,类型保护允许你使用更小范围下的对象类型,常见的类型保护如下: 一、类型断言的类型保护 ? 二、in 语法的类型保护 ? 三、typeof 类型保护 先来看另一种常见的错误: ? ? 通过 typeof 类型保护: ? 四、instanceof 类型保护 ?

    92800发布于 2020-08-05
  • 来自专栏iSharkFly

    TypeScript 类型系统

    针对 JavaScript 上面的问题,聪明的同学就想那我们就给 JavaScript 加个类型吧,和 Java 一样,能够对变量的类型进行定义,这个想法就是 TypeScript类型系统, 在很大程度上弥补了 从 TypeScript 的名字就可以看出来,「类型」是其最核心的特性,TypeScript 也主要致力于解决 JavaScript 的类型混乱问题。 TypeScript 是静态类型 类型系统按照「类型检查的时机」来分类,可以分为下面 2 种 动态类型 静态类型 动态类型是指在运行时才会进行类型检查,这种语言的类型错误往往会导致运行时错误。 TypeScript 在运行前需要先编译为 JavaScript,而在编译阶段就会进行类型检查,所以 TypeScript 是静态类型,这段 TypeScript 代码在编译阶段就会报错了: let foo 大部分 JavaScript 代码都只需要经过少量的修改(或者完全不用修改)就变成 TypeScript 代码,这得益于 TypeScript 强大的[类型推论][],即使不去手动声明变量 foo 的类型

    1.2K00发布于 2021-11-16
  • 来自专栏coldPlayer的前端专栏

    TypeScript类型声明

    前言本文主要讲解TypeScript的基本数据结构,主要包括JS基本数据类型以及TS特有的数据类型。 let arr:any[] = ['a',1,true,null]//或者这样声明let arrE:Array<any> = ['a',1,true,null](4)限制类型和长度的元祖数组tuple( 注意以下是错误用法,因为含有字符串值成员的枚举中不允许使用计算值enum Enum {A,B = 3*6,C = 'C',D = 'd',E = 9,F}(4)枚举成员的值的两种形式-计算值和常量枚举对象中成员的 五、unknow(未知类型)声明变量类型为unknow时安全性更高它用于描述类型不确定的变量,这与any类型相似,但更安全,因为对未知值做任何事情都是不合法的unknown类型只能赋值给any和unknown 具有以下特点:never类型是所有类型的子类型,即never类型可以赋值给任何类型。其他任何类型均不是never类型的子类型,即其他类型均不可赋值给never类型,除了never本身。

    1.2K30编辑于 2023-11-22
  • 来自专栏前端学习教程

    TypeScript】条件类型

    条件类型(Conditional Types)是TypeScript中一种强大的类型系统特性,它允许我们根据类型关系来推断和选择类型。 X : Y这表示如果类型T可以赋值给类型U,则条件类型为X,否则为Y。 ,它检查类型T是否为number类型。 根据条件的结果,返回不同的字符串类型。分布式条件类型条件类型还可以在联合类型上使用,这称为分布式条件类型。当我们传入一个联合类型的参数时,条件类型会遍历每个成员,并根据条件进行推断。 条件类型TypeScript类型系统的一个重要部分,它允许我们在类型级别上进行条件分支和类型选择。通过巧妙地组合泛型、联合类型和条件类型,我们可以定义出非常复杂且强大的类型

    70440编辑于 2023-11-07
  • 来自专栏HueiFeng技术专栏

    TypeScript函数类型

    # 声明式类型函数 通过如下代码我们实现了一个返回值为number类型的方法,同时我们也对返回值和参数进行了约束 ``` function funcType(name:string,age:number 对方法进行添加默认值 ``` function funcType2(name:string="张三",age:number=18):number{ return age; } ``` # 表达式类型函数 :string,age:number):numbe { return age; } ``` 如上代码片段是我们之前创建的函数 那么我们还可以对变量进行约束 ``` var funcType4: numbe } var funcType6:funcType5=function(name:string,age:number):number{ return age; } ``` # 联合类型重载 通过如下代码我们可以实现一个联合类型函数,当然这可以采用重载的方式 当我们的参数是number类型时我们的返回值是number类型,当我们的参数是string类型时我们的返回值是string类型,这一块具体在我们实际业务中可以根据实际需求进行相应修改

    1.3K20发布于 2020-04-09
  • 来自专栏全栈修仙之路

    TypeScript 枚举类型

    TypeScript支持数字的和基于字符串的枚举。 因为 JavaScript 中并没有存在枚举类型,因此为了能够在大多数浏览器中正常运行,上面定义的 RequestMethod 枚举会被编译成以下 ES5 代码: "use strict"; var RequestMethod RequestMethod[RequestMethod["Delete"] = 3] = "Delete"; RequestMethod[RequestMethod["Options"] = 4] 当一个表达式满足下面条件之一时,它就是一个常量枚举表达式: 一个枚举表达式字面量(主要是字符串字面量或数字字面量); 一个对之前定义的常量枚举成员的引用(可以是在不同的枚举类型中定义的); 带括号的常量枚举表达式 : const enum SlidingState { Disabled = 1 << 1, Enabled = 1 << 2, End = 1 << 3, Start = 1 << 4,

    2K10发布于 2020-03-05
  • 来自专栏HueiFeng技术专栏

    TypeScript数组类型

    类型+方括号 在我们创建数组的时候同样我们可以定义数组内数据的类型,如下所示 var arr:number[]=[1,2,3] var arr2:string[]=["1","2","3"] var arr3 true] 接口形式 interface IArr{ [index:number]:number } var arrType3:IArr=[1,2,3] 通过如上代码我们限制了值只能为number类型 age:number } var arrType5:Array<IArrStudent>=[{ name:"Mr.A",age:18},{ name:"Mr.B",age:20}] 同样在这类型加方括号的形式也可以描述

    1.3K40发布于 2020-04-09
  • 来自专栏HueiFeng技术专栏

    TypeScript类型断言

    什么是类型断言 类型断言是可以手动指定一个值得类型 类型断言 let num3:number|string="10" num3=20 console.log(num3.length) 通过如上代码,当我们获取 length的时候会报错因为我们赋值为20所以不存在属性length,那么我们就可以采用类型断言去做处理 <类型>值 function getAssert(name:string|number) { ).length; } 因为只有在我们为string类型的时候才有length属性,所以这一块我们要采用类型断言的方式进行处理. 通过如下代码我们可以发现会出现异常正如下方图片所示,因为他并非是强制类型转换,他只能断言联合类型中存在的类型.不存在的类型是不允许的. function getAssert(name:string|number ) { return (name as boolean).length; } [222bb8ff-e951-4b6b-b41f-ad22040275ff.png]

    85220发布于 2020-04-09
  • 来自专栏全栈修仙之路

    TypeScript 交叉类型

    一、简介 TypeScript 交叉类型是将多个类型合并为一个类型。 这让我们可以把现有的多种类型叠加到一起成为一种类型,它包含了所需的所有类型的特性。 这是因为混入后成员 c 的类型为 string & number,即成员 c 的类型既是 string 类型又是 number 类型。 由上图可知,在混入多个类型时,若存在相同的成员,且成员类型为非基本数据类型,那么是可以成功合并。目前我们已经介绍了 TypeScript 交叉类型相关的知识,最后我们再来举一个实际的使用示例。 当必填参数和可选参数有大部分参数是相同的情况下,我们就可以利用 TypeScript 交叉类型来解决复用问题。 三、参考资源 tslang-advanced-types typescript-intersection-type

    1.5K20发布于 2020-02-12
  • TypeScript——Record类型

    前言 阅读vue源码的时候再次看到了TS这个类型,之前整理TS的时候简单了解了下,只知道是TS的高级类型,当时因为其他的事情也并没有正儿八经的的梳理完TS的东西,这时候来填下坑吧; recordkeys-type try recordkeys-type 内容 Record类型 | 将一个类型的所有属性值都映射到另一个类型上并创造一个新的类型 | 2.1版本开始支持 示例 interface CatInfo { age: number; breed: string; } // 限制属性类型为string,属性值类型为CatInfo且包含age,breed字段 const cats: Record

    32710编辑于 2024-08-15
领券