
TypeScript
文章平均质量分 83
TypeScript
訾博ZiBo
慢慢学,不要停。
展开
-
理解 TypeScript 枚举及其最佳实践
枚举是一种数据结构,用于定义一组命名常量。这在需要表达一组固定的、相关的值时非常有用,例如一周的天数、用户角色或颜色类型。原创 2024-11-06 09:29:47 · 439 阅读 · 0 评论 -
TypeScript延迟执行工具类
这个Delaysleep: 基础延迟execute: 延迟执行函数debounce: 创建防抖函数throttle: 创建节流函数通过合理使用这些方法,可以有效控制函数的执行时机,优化性能,提升用户体验。在实际开发中,要根据具体场景选择合适的方法使用。原创 2024-11-04 09:25:25 · 615 阅读 · 0 评论 -
获取URL参数的最佳实践:兼容Hash模式的TypeScript实现
在某些 JavaScript 或 TypeScript 项目中,可能会有大量使用 关键字的代码。当我们需要将这些代码迁移到其他框架(例如 Vue 3 的组合式 API)时,可能需要将 的用法改为 的形式。这种情况下,正则表达式替换将显得尤为高效。首先,确保你的 VS Code 已经安装并打开了需要进行替换的代码文件。你可以通过以下快捷键打开查找和替换面板:在查找输入框的右侧,你会看到一个带有“.*”的图标。点击这个图标以启用正则表达式功能。启用后,VS Code 将允许你使用正则表达式进行搜索和替换。原创 2024-09-20 11:58:31 · 1093 阅读 · 0 评论 -
类型“{}”上不存在属性“xxx”。ts(2339)-解决方案集锦
类型“{}”上不存在属性“xxx”。ts(2339)原创 2024-01-15 09:13:59 · 6113 阅读 · 0 评论 -
TypeScript 中的类型检查实用函数
在前端开发中,我们经常需要判断变量的类型以进行相应的操作或处理。TypeScript 提供了基础的类型检查,但有时我们需要更复杂或更灵活的类型检查。这篇博客文章将介绍一组实用函数,用于各种常见的类型检查。原创 2023-08-30 21:54:58 · 591 阅读 · 0 评论 -
合并对象在 Typescript 中的实现与应用
在日常开发中,尤其是在处理配置对象或者嵌套的数据结构时,对象的深度合并成为一项常见需求。这篇博客将介绍如何在JavaScript中实现对象的深度合并,并提供具体的使用例子。lodash-es是一个提供了很多有用工具函数的JavaScript库。其中,assign函数用于将一个或多个源对象自身的可枚举属性从一个对象复制到目标对象。本文将详细介绍如何使用lodash-es中的assign函数进行对象合并。原创 2023-08-30 21:39:25 · 1261 阅读 · 0 评论 -
使用 TypeScript 创建工具函数:管理项目版本与环境变量
在我们的日常开发中,获取项目的版本信息和环境变量是很常见的需求。尤其是在前后端分离的项目中,前端可能需要知道当前的环境(开发环境、测试环境还是生产环境),以便决定如何处理各种情况。原创 2023-08-30 21:25:23 · 417 阅读 · 0 评论 -
【TypeScript 4.5】007-第 7 章 类型操纵
【TypeScript 4.5】007-第 7 章 类型操纵文章目录【TypeScript 4.5】007-第 7 章 类型操纵一、从类型中创建类型1、概述2、方法二、泛型-HelloWorld1、概述2、HelloWorld 演示代码示例一代码示例二代码示例三两种调用泛型的方式三、使用通用类型变量1、发现问题2、解决问题四、泛型-泛型类型1、概述说明代码示例2、代码演示泛型类型泛型接口五、泛型-泛型类1、概述说明代码示例2、代码演示六、泛型-泛型约束1、概述说明代码示例2、代码演示七、泛型-在泛型约束中原创 2022-02-16 15:44:00 · 710 阅读 · 0 评论 -
【TypeScript 4.5】006-第 6 章 对象类型
【TypeScript 4.5】006-第 6 章 对象类型文章目录【TypeScript 4.5】006-第 6 章 对象类型一、认识对象类型1、概述说明对象类型2、代码演示二、可选属性1、属性修改器2、可选属性三、只读属性1、概述2、代码演示不同层次的只读属性另外一种情况四、索引签名1、概述2、代码演示索引类型为 number索引类型为 string索引类型为 boolean (报错)关于其他键值对只读索引签名索引签名和数组区别五、扩展类型1、概述说明代码示例2、代码演示单继承多继承六、交叉类型1、概原创 2022-02-10 15:15:02 · 665 阅读 · 0 评论 -
【TypeScript 4.5】005-第 5 章 函数
【TypeScript 4.5】005-第 5 章 函数文章目录【TypeScript 4.5】005-第 5 章 函数一、函数类型表达式1、概述函数函数类型表达式2、代码演示代码示例及解释执行结果使用类型别名二、调用签名1、概述说明代码示例2、代码演示代码示例及解释执行结果三、构造签名1、概述说明代码示例2、代码演示代码示例及解释执行结果3、同时使用调用签名和构造签名四、泛型函数1、概述说明代码分析泛型写法调用分析2、代码示例正确写法错误写法另一种错误写法还有一种错误写法3、多个泛型代码示例及解释执行结原创 2022-02-09 22:55:07 · 794 阅读 · 0 评论 -
【TypeScript 4.5】004-第 4 章 类型缩小
【TypeScript 4.5】004-第 4 章 类型缩小文章目录【TypeScript 4.5】004-第 4 章 类型缩小一、typeof 类型守卫1、什么是类型缩小含义代码分析2、使用 typeof 进行代码改造改造后的代码执行结果3、typeof 类型守卫概述使用示例问题代码示例二、真值缩小1、概述说明代码分析2、解决 typeof 类型守卫中的问题三、等值缩小1、说明2、代码示例四、in 操作符缩小1、概述说明代码分析2、代码演示代码示例及解释五、instanceof 操作符缩小1、概述说明代原创 2022-02-09 22:52:52 · 766 阅读 · 0 评论 -
【TypeScript 4.5】003-第 3 章 常用类型
【TypeScript 4.5】003-第 3 章 常用类型文章目录【TypeScript 4.5】003-第 3 章 常用类型一、基元类型 string、number 和 boolean1、基本含义2、举个例子代码演示编译结果二、数组类型1、两种方式2、代码示例三、any 类型1、概述2、代码演示代码示例不报任何错误运行生成的 js 文件结果四、变量上的类型注释1、显式指定变量类型2、代码示例与解释五、函数类型1、代码分析2、代码演示代码示例与解释执行结果3、匿名函数代码示例执行结果六、对象类型1、概述原创 2022-02-06 18:00:46 · 983 阅读 · 0 评论 -
【TypeScript 4.5】002-第 2 章 TypeScript 入门
【TypeScript 4.5】002-第 2 章 TypeScript 入门文章目录【TypeScript 4.5】002-第 2 章 TypeScript 入门一、发现问题1、字符串2、函数3、JavaScript 局限二、解决问题:静态类型检查1、在代码运行之前发现错误2、静态类型检查代码示例类型检查提示三、非异常故障1、JavaScript 示例代码示例运行结果2、TypeScript 示例代码示例检查结果3、TypeScript 错别字提示代码示例检查结果4、TypeScript 未调用函数提示原创 2022-01-28 15:07:02 · 1521 阅读 · 0 评论 -
【TypeScript 4.5】001-第 1 章 TypeScript 介绍
【TypeScript 4.5】001-第 1 章 TypeScript 介绍文章目录【TypeScript 4.5】001-第 1 章 TypeScript 介绍一、什么是 TypeScript二、JS、ES以及TS的关系三、TypeScript 的竞争者有哪些1、ESLint 和 TSLint2、CoffeeScript3、Flow4、TypeScript is future !一、什么是 TypeScript① TypeScript 是由微软开发的自由和开源的编程语言,是 JavaScript原创 2022-01-13 14:20:11 · 347 阅读 · 0 评论 -
【TypeScript 编程】001-002 第 1 章 导言 与 第 2 章 TypeScript 概述
TypeScript 编程第 1 章 导言一言以蔽之!TypeScript 是未来!参考文章:TypeScript 简介与优势https://blog.youkuaiyun.com/Aria_Miazzy/article/details/105430400第 2 章 TypeScript 概述1、编译器1.1 与众不同与 JavaScript 和 Java 等主流语言相比,TypeScript 的运作方式显得与众不同!1.2 程序运行逻辑第一步:程序员编写代码文本、形成文件、构成程序;第二步:编原创 2022-01-04 12:29:16 · 982 阅读 · 0 评论 -
【TypeScript】014-工程相关
文章目录四、工程1、代码检查什么是代码检查为什么需要代码检查在 TypeScript 中使用 ESLint安装 ESLint创建配置文件检查一个 ts 文件检查整个项目的 ts 文件在 VSCode 中集成 ESLint 检查使用 Prettier 修复格式错误使用 AlloyTeam 的 ESLint 配置使用 ESLint 检查 tsx 文件安装 `eslint-plugin-react`package.json 中的 scripts.eslint 添加 `.tsx` 后缀VSCode 的配置中新增 t原创 2021-08-09 20:58:09 · 644 阅读 · 0 评论 -
【TypeScript】013-声明合并、扩展阅读
文章目录8、声明合并函数的合并接口的合并类的合并9、扩展阅读8、声明合并如果定义了两个相同名字的函数、接口或类,那么它们会合并成一个类型:函数的合并之前学习过,我们可以使用重载定义多个函数类型:function reverse(x: number): number;function reverse(x: string): string;function reverse(x: number | string): number | string { if (typeof x === '原创 2021-08-09 20:52:33 · 286 阅读 · 0 评论 -
【TypeScript】012-类与接口、泛型
文章目录6、类与接口类实现接口接口继承接口接口继承类7、泛型简单的例子多个类型参数泛型约束泛型接口泛型类泛型参数的默认类型6、类与接口之前学习过,接口(Interfaces)可以用于对「对象的形状(Shape)」进行描述。这一章主要介绍接口的另一个用途,对类的一部分行为进行抽象。类实现接口这不是 Java ?难道这是C++?实现(implements)是面向对象中的一个重要概念。一般来讲,一个类只能继承自另一个类,有时候不同类之间可以有一些共有的特性,这时候就可以把特性提取成接口(int原创 2021-08-09 20:51:37 · 153 阅读 · 0 评论 -
【TypeScript】011-类
文章目录5、类类的概念ES6 中类的用法属性和方法类的继承存取器静态方法ES7 中类的用法实例属性静态属性TypeScript 中类的用法public private 和 protected参数属性readonly抽象类类的类型5、类传统方法中,JavaScript 通过构造函数实现类的概念,通过原型链实现继承。而在 ES6 中,我们终于迎来了 class。TypeScript 除了实现了所有 ES6 中的类的功能以外,还添加了一些新的用法。这一节主要介绍类的用法,下一节再介绍如何定义类的类型。原创 2021-08-09 20:48:22 · 156 阅读 · 0 评论 -
【TypeScript】010-类型别名、字符串字面量类型、元组、枚举
文章目录三、进阶1、类型别名简单的例子2、字符串字面量类型简单的例子3、元组简单的例子越界的元素4、枚举简单的例子手动赋值常数项和计算所得项常数枚举外部枚举三、进阶1、类型别名用来给一个类型起一个新名字!简单的例子type Name = string;type NameResolver = () => string;type NameOrResolver = Name | NameResolver;function getName(n: NameOrResolver): Name原创 2021-08-09 20:44:33 · 327 阅读 · 0 评论 -
【TypeScript】009-内置对象
文章目录10、内置对象ECMAScript 的内置对象DOM 和 BOM 的内置对象TypeScript 核心库的定义文件用 TypeScript 写 Node.js10、内置对象JavaScript 中有很多内置对象,它们可以直接在 TypeScript 中当做定义好了的类型。内置对象是指根据标准在全局作用域(Global)上存在的对象。这里的标准是指 ECMAScript 和其他环境(比如 DOM)的标准。ECMAScript 的内置对象ECMAScript 标准提供的内置对象有:Boo原创 2021-08-09 20:39:09 · 136 阅读 · 0 评论 -
【TypeScript】008-声明文件
文章目录9、声明文件新语法索引什么是声明语句什么是声明文件第三方声明文件书写声明文件全局变量`declare var``declare function``declare class``declare enum``declare namespace`嵌套的命名空间`interface` 和 `type`防止命名冲突声明合并npm 包`export`混用 `declare` 和 `export`[§](http://ts.xcatliu.com/basics/declaration-files.html#混用原创 2021-08-09 20:37:43 · 406 阅读 · 0 评论 -
【TypeScript】007-类型断言
文章目录8、类型断言语法类型断言的用途将一个联合类型断言为其中一个类型将一个父类断言为更加具体的子类将任何一个类型断言为 `any`将 `any` 断言为一个具体的类型类型断言的限制双重断言类型断言 vs 类型转换类型断言 vs 类型声明类型断言 vs 泛型8、类型断言类型断言(Type Assertion)可以用来手动指定一个值的类型。语法值 as 类型或<类型>值在 tsx 语法(React 的 jsx 语法的 ts 版)中必须使用前者,即 值 as 类型。形如 &l原创 2021-08-09 20:36:20 · 619 阅读 · 0 评论 -
【TypeScript】006-函数的类型
文章目录7、函数的类型函数声明函数表达式用接口定义函数的形状可选参数参数默认值剩余参数重载7、函数的类型函数是 JavaScript 中的一等公民!函数声明在 JavaScript 中,有两种常见的定义函数的方式——函数声明(Function Declaration)和函数表达式(Function Expression):// 函数声明(Function Declaration)function sum(x, y) { return x + y;}// 函数表达式(Functi原创 2021-08-09 20:34:34 · 251 阅读 · 0 评论 -
【TypeScript】005-对象的类型——接口 与 数组的类型
文章目录5、对象的类型——接口什么是接口简单的例子可选属性任意属性只读属性6、数组的类型「类型 + 方括号」表示法数组泛型用接口表示数组类数组any 在数组中的应用5、对象的类型——接口在 TypeScript 中,我们使用接口(Interfaces)来定义对象的类型。什么是接口在面向对象语言中,接口(Interfaces)是一个很重要的概念,它是对行为的抽象,而具体如何行动需要由类(classes)去实现(implement)。TypeScript 中的接口是一个非常灵活的概念,除了可用于对原创 2021-07-21 21:00:44 · 1602 阅读 · 2 评论 -
【TypeScript】004-类型推论 与 联合类型
3、类型推论如果没有明确的指定类型,那么 TypeScript 会依照类型推论(Type Inference)的规则推断出一个类型。什么是类型推论以下代码虽然没有指定类型,但是会在编译的时候报错:let myFavoriteNumber = 'seven'; // 声明的时候赋值为字符串,推断为字符串类型myFavoriteNumber = 7; // 将一个数值赋值给一个字符串类型,导致报错!// index.ts(2,1): error TS2322: Type 'number' is原创 2021-07-21 20:58:48 · 227 阅读 · 0 评论 -
【TypeScript】003-原始数据类型 与 任意值
文章目录二、基础1、原始数据类型布尔值数值字符串空值Null 和 Undefined2、任意值什么是任意值类型任意值的属性和方法未声明类型的变量二、基础1、原始数据类型JavaScript 的类型分为两种:原始数据类型(Primitive data types)和对象类型(Object types)。原始数据类型包括:布尔值、数值、字符串、null、undefined 以及 ES6 中的新类型 Symbol 和 ES10 中的新类型 BigInt。本节主要介绍前五种原始数据类型在 TypeScr原创 2021-07-21 20:57:13 · 408 阅读 · 0 评论 -
【TypeScript】002-安装 TypeScript 与 Hello TypeScript 入门程序
文章目录2、安装 TypeScript安装编辑器3、Hello TypeScript 入门程序第一步:创建文件 hello.ts第二步:编译成 JavaScript第三步:查看 js 文件内容第四步:执行 js 文件第五步:分析第六步:修改 hello.ts ,制造错误第七步:再次尝试编译第八步:但仍然生成了 js 文件第九步:分析2、安装 TypeScript安装TypeScript 的命令行工具安装方法如下:npm install -g typescript以上命令会在全局环境下安装 tsc原创 2021-07-21 20:53:39 · 486 阅读 · 6 评论 -
【TypeScript】001-TypeScript 的概述
文章目录一、简介1、TypeScript 的概述简介类型系统概述TypeScript 是静态类型TypeScript 是弱类型适用于任何规模与标准同步发展总结一、简介1、TypeScript 的概述简介是添加了类型系统的 JavaScript ,适用于任何规模的项目。类型系统概述从 TypeScript 的名字就可以看出来,「类型」是其最核心的特性。我们知道,JavaScript 是一门非常灵活的编程语言:它没有类型约束,一个变量可能初始化时是字符串,过一会儿又被赋值为数字。由于隐式类原创 2021-07-21 20:50:28 · 228 阅读 · 2 评论