duansamve的博客

如果运用熟练的话，TS 只是在第一次开发的时候稍微多花一些时间去编写类型，后续维护、重构的时候就会发挥它神奇的作用了，还是非常推荐长期维护的项目使用它的。

在使用queryselector获取一个dom元素，编译时却报错说Property 'style' does not exist on type 'Element'。原因：这是typescript的类型检查导致的，需要在querySelector方法前面加个类型断言。

官方推荐用 interface，其他无法满足需求的情况下用 type。但其实，因为 联合类型 和 交叉类型 是很常用的，所以避免不了大量使用 type 的场景，一些复杂类型也需要通过组装后形成类型别名来使用。所以，如果想保持代码统一，还是可选择使用 type。通过上面的对比，类型别名 其实可函盖 interface 的大部分场景。对于 React 组件中 props及 state，使用 type ，这样能够保证使用组件的地方不能随意在上面添加属性。如果有自定义需求，可通过 HOC二次封装。

如何在React项目中引入TypeScript？

0、TypeScript简介TypeScript是JavaScript的超集。它对JS进行了扩展，向JS中引入了类型的概念，并添加了许多新的特性。TS代码需要通过编译器编译为JS，然后再交由JS解析器执行。TS完全兼容JS，换言之，任何的JS代码都可以直接当成JS使用。相较于JS而言，TS拥有了静态类型，更加严格的语法，更强大的功能；TS可以在代码执行前就完成代码的检查，减小了运行时异常的出现的几率；TS代码可以编译为任意版本的JS代码，可有效解决不同JS运行环境的兼容问题；同样的功能，TS的代

面向对象是程序中一个非常重要的思想，它被很多同学理解成了一个比较难，比较深奥的问题，其实不然。面向对象很简单，简而言之就是程序之中所有的操作都需要通过对象来完成。举例来说：操作浏览器要使用window对象操作网页要使用document对象操作控制台要使用console对象一切操作都要通过对象，也就是所谓的面向对象，那么对象到底是什么呢？这就要先说到程序是什么，计算机程序的本质就是对现实事物的抽象，抽象的反义词是具体，比如：照片是对一个具体的人的抽象，汽车模型是对具体汽车的抽象等等。程序也

一、使用create-react-app创建一个支持TypeScript+React的开发环境：要创建一个支持TypeScript的Create React App项目，可以运行：npx create-react-app my-app --template typescript# oryarn create react-app my-app --template typescript要将TypeScript添加到已有的Create React App项目，请先安装它：npm in

一、控制台中"tsc --init"命令生成tsconfig.json文件；二、Vscode中：“任务”-“运行任务”-“tsc:监视-tsconfig.json”。

数据类型let s: string;let n: number;let b: boolean;// 数组let arr1: string[] = ['a', 'b', 'c'];let arr2: Array<number> = [1, 2, 3, 4, 5];let tuple: [string, number] = ['a', 1]; // 元祖let arr3: (string|number)[] = ['a', 1];let anyList: any[] = ['

该环境支持：a、VSCode中自动编译typescript；b、TypeScript 支持jquery、bootstrap；c、ESLint保存时自动检查typescript代码；d、VScode自动编译less；e、eslint自动检查Html中的JavaScript代码；f、具有本地服务器功能；步骤：1、VScode中安装Eslint和live Server（本...

1、Typescript原始数据类型：stringnumberbooleannullundefinedenumsymbol空值一般采用void表示，void可以表示变量，也可以表示函数返回值。2、Typescript中的任意值：任意值（any）用来表示允许赋值为任意类型。申明一个变量为任意值后，对它的任何操作，返回的内容的类型都是任意值。变量如果在申...

初始化项目：npm init --y全局或本地安装typescript：npm install typescript -g创建tsconfig.json文件：tsc --init本地安装eslint：npm install eslint --save-dev安装eslint之后，新建并配置.eslintrc.json（不是.eslintrc.js）文件。re...

装jquery的typescript的类型描述文件：cnpm i @types/jquery -D装bootstrap的typescript的类型描述文件：cnpm i @types/bootstrap -D装这两个的目的是让typescript代码认识jquery和bootstrap。...

一、安装typescript：cnpm i typescript -g二、创建相应的项目目录，当前项目目录；三、创建tsconfig.json文件：tsc --init四、打开tsconfig.json文件修改和删除相应配置（如果想快速修改配置，请复制下列配置）：{ "compilerOptions": { "target": "es5", "noIm...