TypeScript

最新推荐文章于 2024-04-05 00:33:37 发布
最新推荐文章于 2024-04-05 00:33:37 发布
阅读量457 收藏 4
点赞数
文章标签： typescript javascript 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_49866713/article/details/126563964
版权

安装命令：npm i -g typescript
验证是否安装成功，查看版本号：tsc -v

在这里插入图片描述


安装命令：npm i -g ts-node

在这里插入图片描述
这里并不会像上面那样生成或者说是更新这个js文件，只是将ts转换为js再执行而已


类型注解

在这里插入图片描述

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

类型别名

在这里插入图片描述

函数类型

单独指定参数，返回值类型
在这里插入图片描述

同时指定参数，返回值类型
在这里插入图片描述


void类型

在这里插入图片描述


函数可选参数

在这里插入图片描述


对象类型

在这里插入图片描述


对象可选属性

在这里插入图片描述


接口

在这里插入图片描述


接口和类型别名的对比

在这里插入图片描述


接口继承

在这里插入图片描述


元组

在这里插入图片描述

类型推论

在这里插入图片描述




在这里插入图片描述

类型断言

在这里插入图片描述
在这里插入图片描述



获取as后面是那个单词的方法
① 按下F12，在Elements(元素)中单击这个元素，会有个$0
②在Console中输入 console.dir($0),会出现一个对象，在对象的最下边就出来了
在这里插入图片描述


字面量类型

在这里插入图片描述
在这里插入图片描述


枚举类型

在这里插入图片描述


枚举成员的值以及数字枚举

在这里插入图片描述


字符串枚举

在这里插入图片描述


枚举的特点及原理

在这里插入图片描述


any类型

在这里插入图片描述


TypeScript中 typeof 运算符

在这里插入图片描述


class的基本使用

在这里插入图片描述

在这里插入图片描述


class的构造函数

在这里插入图片描述


class实例方法

在这里插入图片描述


class继承（extends）

在这里插入图片描述


class继承 (implements)

在这里插入图片描述
例子：
在这里插入图片描述


class类的可见性修饰符 — public

在这里插入图片描述


class类的可见性修饰符 — protected

在这里插入图片描述


class类的可见性修饰符 — private

在这里插入图片描述


readonly 只读修饰符


类型兼容性的说明

在这里插入图片描述


对象之间的类型兼容性

在这里插入图片描述


接口之间的类型兼容性

在这里插入图片描述


函数之间的类型兼容性（1函数参数)

在这里插入图片描述


函数之间的类型兼容性（2函数参数)

在这里插入图片描述


在这里插入图片描述


函数之间的类型兼容性(3返回值)

在这里插入图片描述

交叉类型

在这里插入图片描述


交叉类型和接口之间的对比说明

在这里插入图片描述


泛型的基本使用

在这里插入图片描述



在这里插入图片描述

在这里插入图片描述


简化泛型函数调用

在这里插入图片描述


泛型约束

在这里插入图片描述


在这里插入图片描述


泛型约束 — extends 添加约束

在这里插入图片描述


多个泛型变量的情况

在这里插入图片描述


泛型接口

在这里插入图片描述


数组是泛型接口

在这里插入图片描述


泛型类

在这里插入图片描述




在这里插入图片描述

有省略的方式
在这里插入图片描述


泛型工具类型(1Partial)

在这里插入图片描述




在这里插入图片描述


泛型工具类型(2Readonly)

在这里插入图片描述


泛型工具类型(3Pick)

在这里插入图片描述


泛型工具类型(4Record)

在这里插入图片描述


索引签名类型

在这里插入图片描述



在这里插入图片描述




在这里插入图片描述


映射类型

在这里插入图片描述


映射类型(keyof)

在这里插入图片描述


分析泛型工具类型Partial的实现

在这里插入图片描述


索引查询类型(基本使用)

在这里插入图片描述


索引查询类型(同时查询多个)

在这里插入图片描述


类型声明文件概述

在这里插入图片描述


TS中的两种文件类型

在这里插入图片描述


使用已有的类型声明文件（内置类型声明文件）

在这里插入图片描述


使用已有的类型声明文件（第三方库的类型声明文件）

在这里插入图片描述



在这里插入图片描述


创建自己的类型声明文件(项目内共享类型)

在这里插入图片描述

导出
在这里插入图片描述

导入
在这里插入图片描述


创建自己的类型声明文件(为已有JS文件提供类型声明的概述）

在这里插入图片描述


创建自己的类型声明文件(为已有JS文件类型提供说明）

在这里插入图片描述


在React中使用Typescript概述


使用CRA创建支持TS的项目





























野野男
关注
  • 0
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
第二天：TypeScript的InterFace接口、类、修饰符、抽象类、implements
chad_xu的博客
08-30 451
第二天：TypeScript的InterFace接口、类、修饰符、抽象类、implements
TypeScript 中的 implements 和 extends
夏狗花花的博客
09-01 9135
类和接口 常见的面向对象语言中，接口是不能继承类的，但是在 TypeScript 中可以。 在声明 class Point 时，除了会创建一个名为 Point 的类之外，同时也创建了一个名为 Point 的类型（实例的类型）（不包含构造函数和静态成员，这些不是实例的东西）。 所以我们既可以将 Point 当做一个类来用， 也可以将 Point 当做一个类型来用。 extends（继承）和 implements（实现） 因为类可以作为接口使用，或者说因为类同时实现了接口，所以 TypeScript 中可以有如
typescript
webprevious的博客
03-13 694
介绍 typescript是一门由微软公司发布的开源编程语言，目前主流的前端框架vue、react、angular都支持使用typescript来进行开发，typescript被认为是JavaScript的超集，主要提供了类型系统和对es6的支持 typescript的优势 提供了类型系统，使得代码比如函数一眼就可以看出如何使用，便于代码的维护和语义化。有了类型系统使得很多问题在编译的时候就...
typescript implements
dfwohbl8515的博客
03-29 1945
interfaceClockInterface { currentTime:Date; setTime(d:Date); } classClockimplementsClockInterface { currentTime:Date; h:number; s:number; setTime(d:Date) { this.currentTime = d; } constructor(h:...
TypeScript:接口 interface implement
最新发布
ZMN0057的博客
04-05 257
interface implement
Typescript
03-28
**TypeScript 深度解析** TypeScript 是一种由微软开发的开源编程语言，它是 JavaScript 的超集，旨在解决 JavaScript 在大型项目中所面临的一些问题，如类型安全性、代码可维护性和开发效率。TypeScript 提供了...
typeScript
03-08
**TypeScript：超越JavaScript的强类型编程语言** TypeScript，简称为TS，是由微软开发的一种开源的编程语言，它是JavaScript的一个超集，旨在为大型、复杂项目提供更强大的静态类型检查和面向对象特性。TypeScript...
Typescript类型脚本课件.pptx
06-19
Typescript类型脚本课件 Typescript是一种静态类型检查的JavaScript超集语言，由Microsoft开发，代码开源于GitHub上。Typescript的主要特点是提供了类型系统和对JS新标准的支持（ES6/7/8）。 Typescript可以帮助...
TypeScript手册
12-14
《TypeScript手册》是一本全面介绍TypeScript的指南，适合有一定编程基础并希望学习或查阅TypeScript知识的开发者。通过阅读这本书，读者可以： 1️⃣了解TypeScript的起源、发展历程及其在当前技术生态中的地位，...
TypeScript.docx
08-18
TypeScript是一种静态类型的强类型编程语言，它是JavaScript的超集，这意味着任何有效的JavaScript代码也是有效的TypeScript代码。TypeScript的设计目标是提供工具来提高开发效率，通过在编译阶段检查类型错误，帮助...
TypeScript.zip
06-23
TypeScript是一种强大的静态类型编程语言，它是JavaScript的超集，为开发者提供了更丰富的语法和工具支持，以提高代码质量和可维护性。对于TypeScript初学者来说，了解并掌握其核心概念和特性至关重要。 首先，从...
typescript-doc
03-31
**typescript-doc** 在深入探讨`typescript-doc`之前，让我们先理解一下核心概念——TypeScript。TypeScript是由微软开发的一种开源的编程语言，它是JavaScript的超集，为开发者提供了静态类型系统、面向对象的特性...
Typescript泛型与implements子句
执笔丶画苍生的博客
09-09 1136
与extends的区别泛型可以理解为宽泛的类型，通常用于类和函数。使用的时候我们再指定类型泛型不仅可以让我们的代码变得克加健壮,还能让我们的代;码在变得键壮的r时保持灵活性和可五用性通过用来表示，放在参数的前面。
在 TypeScript 中，interface、implements 和 extends 的作用
前端小白的博客
11-30 948
【代码】在 TypeScript 中，interface、implements 和 extends 的作用。
TypeScript实现类Class的功能--代码详情解析
qq_44472790的博客
05-24 361
/* 传统方法中，JavaScript 通过构造函数实现类的概念，通过原型链实现继承，而在 ES6 中，我们能够使用class。TypeScript 除了实现了所有 ES6 中的类的功能以外，还添加了一些新的用法。 知识点 类的概念 类的定义 类的继承 类里面的修饰符 静态属性和方法 抽象类 类的概念 如果你有其他面向对象语言的经验，那么（Class） 类就是比较简单的常用的类型，如果你之前没有使用过，那么先介绍一下概念方便理解
三、typescript接口
qq_38677540的博客
09-02 278
接口
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值