1、什么是typescript？

TypeScript是JavaScript的一个超集，扩展了JavaScript的语法，本质上向这个语言添加了可选的静态类型和基于类的面向对象编程。任何现有的JavaScript程序可以不加改变的在TypeScript下工作,等同于ES时代的JS。TypeScript是为大型应用开发而设计，而编译时它产生 JavaScript 以确保兼容性。

2、JavaScript和typescript的区别？

TypeScript 可以使用 JavaScript 中的所有代码和编码概念，TypeScript 是为了使 JavaScript 的开发变得更加容易而创建的。例如，TypeScript 使用类型和接口等概念来描述正在使用的数据，这使开发人员能够快速检测错误并调试应用程序。

TypeScript 从核心语言方面和类概念的模塑方面对 JavaScript 对象模型进行扩展。
JavaScript 代码可以在无需任何修改的情况下与 TypeScript 一同工作，同时可以使用编译器将 TypeScript 代码转换为 JavaScript。
TypeScript 通过类型注解提供编译时的静态类型检查。
TypeScript 中的数据要求带有明确的类型，JavaScript不要求。
TypeScript 为函数提供了缺省参数值。
TypeScript 引入了 JavaScript 中没有的“类”概念。
TypeScript 中引入了模块的概念，可以把声明、数据、函数和类封装在模块中。

3、为什么使用TypeScript？

        代码约束、提示能力

3.1代码约束

TypeScript 的类型机制可以有效杜绝由变量类型引起的误用问题，而且开发者可以控制对类型的监控程度，是严格限制变量类型还是宽松限制变量类型，都取决于开发者的开发需求。

3.2代码提示

3.2.1代码的自动补全

TypeScript代码的提示功能会在您输入字符的同时自动在光标的相应位置弹出。其提示列表是基于一定的顺序排列，并非按照字母排列，如您在方法内部，触发的提示，那形参会优先排列到前端。

3.2.2代码的着色

3.2.3代码的悬浮提示

您可以通过鼠标触碰某个方法、变量或类名等以快速获得doc中对该目标的描述。

3.2.4方法参数和方法重载的提示

当您在输入完一个方法的调用的时候，可以提示出该方法的参数，以及您当前马上要输入第几个参数和相关参数的注释信息。同时，如果该方法被重载过，可以提示出每一次重载的提示。您可以通过键盘的上下方向键来进行切换查看。

3.2.5 代码的格式化

格式化的相关配置，如方法明后是否换行等，您可以通过如下途径进行设置。

打开菜单：窗口->首选项（偏好设置->首选项）。

3.2.6 代码的引用高亮

当您选择一个变量或者方法的时候，编辑器可以即时的提示您在当前的TypeScript文件中所有对当前选择内容的引用。

3.2.7即时错误提示

在您正在输入TypeScript代码的同时，可以帮助您及时发现代码中的语法语义等错误部分，并有效提示出所在行，以便能够快速对书写问题进行修改。

3.2.8查找引用和声明

此功能可以方便的查询某一个类、方法或变量在整个项目中的引用，并且可以通过搜索面板直接打开相关的TypeScript文件并选中相应代码。您可以通过如下方式进行引用和声明的查找：右键点击某一段代码，在弹出菜单中选择查找引用或查找定义。

4、添加特性的语言扩展

4.1 类（Classes）

类是TypeScript的核心，使用TypeScript开发时，大部分代码都是写中类里面的。

4.2接口 Interfaces

提供的 interface 接口这个功能在开发项目的时候会很有帮助，用来建立某种代码约定，TypeScript的核心原则之一是对值所具有的结构进行类型检查。在TypeScript里，接口的作用就是为这些类型命名和为你的代码或第三方代码定义契约。

IPerson 接口就好比一个名字，它代表了有 name 属性且类型为 string 和age属性且类型为number的对象。只要传入的对象满足上述必要条件，那么它就是被允许的。

带有可选属性的接口与普通的接口定义差不多，只是在可选属性名字定义的后面加一个 ? 符号。可选属性的好处之一是可以对可能存在的属性进行预定义，好处之二是可以捕获引用了不存在的属性时的错误。

要注意可选参数没传的情况，必选参数不能放在可选参数后面。

4.3模块 Modules

模块可以帮助开发者将代码分割为可重用的单元。开发者可以自己决定将模块中的哪些资源（类、方法、变量）暴露出去供外部使用，哪些资源只在模块内使用。在TS中一个文件就是一个模块，中模块的内部有两个关键字（export、import）支撑模块的特性。这两个关键字来控制模块对外暴露什么、需要别的模块对你提供什么。

4.4类型注解 Type annotations

对于基本类型的批注是 number, bool 和 tring。而弱或动态类型的结构则是 any 类型。当类型没有给出时，TypeScript编译器利用类型推断以推断类型。如果由于缺乏声明，没有类型可以被推断出，那么它就会默认为是动态的any类型。

4.5编译时类型检查 Compile time type checking

编译时对变量的类型进行检查，符合要求的继续编译，不符合要求的报错。

4.6箭头表达式

表达式 ()=>{something}或()=>something 相当于js中的函数,它的好处是可以自动将函数中的this附加到上下文中，消除this的指向问题。

5、常见问题

5、1基础类型any

有时候，我们会想要为那些在编程阶段还不清楚类型的变量指定一个类型。这些值可能来自于动态的内容，比如来自用户输入或第三方代码库。这种情况下，我们不希望类型检查器对这些值进行检查而是直接让它们通过编译阶段的检查。那么我们可以使用 any类型来标记这些变量。

5.2 var let const 区别

var：使用var声明的变量，其作用域为该语句所在的函数内，且存在变量提升现象（函数及变量的声明都将被提升到函数的最顶部）

let：用let声明的变量，其作用域为该语句所在的代码块内，不存在变量提升；

const: 使用const声明的是常量，与let声明相似，但是就像它的名字所表达的，它们被赋值后不能再改变。换句话说，它们拥有与 let相同的作用域规则，但是不能对它们重新赋值。

5.3剩余参数

必要参数，默认参数和可选参数有个共同点：它们表示某一个参数。有时，你想同时操作多个参数，或者你并不知道会有多少参数传递进来。可以把所有参数收集到一个变量里，剩余参数会被当做个数不限的可选参数。可以一个都没有，同样也可以有任意个。编译器创建参数数组，名字是你在省略号（ ...）后面给定的名字。

5.4 for . . of 与 for . . in

for . . of和for..in均可迭代一个列表；但是用于迭代的值却不同，for..in迭代的是对象的键的列表，而for..of则迭代对象的键对应的值。

6、React项目中tsconfig.json详解

如果一个目录下存在一个tsconfig.json文件，那么它意味着这个目录是TypeScript项目的根目录。tsconfig.json文件中指定了用来编译这个项目的根文件和编译选项。

`{ "compilerOptions": { "outDir": "./dist/“, //重定向输出，打包输出路径

"sourceMap": true,   //生成相应的 .map文件

"allowSyntheticDefaultImports": true,  //允许从没有设置默认导出的模块中默认导入

"experimentalDecorators": true,     //修饰符

"moduleResolution": "node”,    //决定如何处理模块

"declaration": false, //生成相应的 .d.ts文件

"target": "es6”,      //指定ES的目标版本
"jsx": “react”    //在 .tsx文件里支持JSX

},

"exclude": [ "node_modules" ],

"include": [ "src/**/*" ] }` "exclude"和"include"属性指定一个文件glob匹配模式列表。

支持的glob通配符有：

   匹配0或多个字符（不包括目录分隔符）

  ? 匹配一个任意字符（不包括目录分隔符）

   **/ 递归匹配任意子目录

参考文档： https://baike.baidu.com/item/typescript/4314718?fr=aladdin 简书 https://www.jianshu.com/p/c5005fad4274

菜鸟教程 https://www.runoob.com/w3cnote/getting-started-with-typescript.html

提示能力 http://edn.egret.com/cn/docs/page/941

https://www.cnblogs.com/langzianan/p/8403332.html