Typescript常见问题总结

1、 TypeScript 的主要特点是什么？

• 跨平台：TypeScript 编译器可以安装在任何操作系统上，包括 Windows、macOS 和 Linux。

• ES6 特性：TypeScript 包含计划中的 ECMAScript 2015 (ES6) 的大部分特性，例如箭头函数。

• 面向对象的语言：TypeScript 提供所有标准的 OOP 功能，如类、接口和模块。

• 静态类型检查：TypeScript 使用静态类型并帮助在编译时进行类型检查。因此，你可以在编写代码时发现编译时错误，而无需运行脚本。

• 可选的静态类型：如果你习惯了 JavaScript 的动态类型，TypeScript 还允许可选的静态类型。

• DOM 操作：您可以使用 TypeScript 来操作 DOM 以添加或删除客户端网页元素。

2、使用 TypeScript 有什么好处？

• TypeScript 更具表现力，这意味着它的语法混乱更少。

• 由于高级调试器专注于在编译时之前捕获逻辑错误，因此调试很容易。

• 静态类型使 TypeScript 比 JavaScript 的动态类型更易于阅读和结构化。

• 由于通用的转译，它可以跨平台使用，在客户端和服务器端项目中

3、TypeScript 的内置数据类型有哪些？

数字类型：用于表示数字类型的值。TypeScript 中的所有数字都存储为浮点值。

let identifier: number = value;
复制代码

布尔类型：一个逻辑二进制开关，包含true或false

let identifier: string = " ";
复制代码

Null 类型： Null 表示值未定义的变量。

let identifier: bool = Boolean value;
复制代码

未定义类型：一个未定义的字面量，它是所有变量的起点。

let num: number = null;
复制代码

void 类型：分配给没有返回值的方法的类型。

let unusable: void = undefined;
复制代码

4、TypeScript 中的接口是什么？

接口为使用该接口的对象定义契约或结构。

接口是用关键字定义的interface，它可以包含使用函数或箭头函数的属性和方法声明。

interface IEmployee {    
                       empCode: number;    
                       empName: string;    
                        getSalary: (number) => number; // arrow function    
                        getManagerName(number): string; 
                   }
复制代码

5、如何在 TypeScript 中创建变量？

你可以通过三种方式创建变量：var，let，和const。
var是严格范围变量的旧风格。你应该尽可能避免使用，var因为它会在较大的项目中导致问题。

var num:number = 1;
复制代码

let是在 TypeScript 中声明变量的默认方式。与var相比，let减少了编译时错误的数量并提高了代码的可读性。

let num:number = 1;
复制代码

const创建一个其值不能改变的常量变量。它使用相同的范围规则，let并有助于降低整体程序的复杂性。

const num:number = 100;
复制代码

6、TypeScript 中如何检查 null 和 undefined？

你可以使用 juggle-check，它检查 null 和 undefined，或者使用 strict-check，它返回true设置为null的值，并且不会评估true未定义的变量。

//juggleif (x == null) {  }
var a: number;  
var b: number = null;  function check(x, name) { 
     if (x == null) {  
      console.log(name + ' == null');  
    }  
     if (x === null) {  
     console.log(name + ' === null');  
     }
     if (typeof x === 'undefined') { 
      console.log(name + ' is undefined');  
      }
   }   
check(a, 'a');
check(b, 'b');
复制代码

7、TypeScript 中的 getter/setter 是什么？你如何使用它们？

Getter 和 setter 是特殊类型的方法，可帮助你根据程序的需要委派对私有变量的不同级别的访问。

Getters 允许你引用一个值但不能编辑它。Setter 允许你更改变量的值，但不能查看其当前值。这些对于实现封装是必不可少的。

8、如何使用 Typescript 将字符串转换为数字？

与 JavaScript 类似，你可以使用parseInt或parseFloat函数分别将字符串转换为整数或浮点数。你还可以使用一元运算符+将字符串转换为最合适的数字类型，“3”成为整数，3而“3.14”成为浮点数3.14。

var x = "32";
var y: number = +x;
复制代码

9、TypeScript 与 JavaScript 有什么关系？

TypeScript 是 JavaScript 的开源语法超集，可编译为 JavaScript。所有原始 JavaScript 库和语法仍然有效，但 TypeScript 增加了 JavaScript 中没有的额外语法选项和编译器功能。

TypeScript 还可以与大多数与 JavaScript 相同的技术接口，例如 Angular 和 jQuery。

10、TypeScript 中的 JSX 是什么？

JSX 是一种可嵌入的类似于 XML 的语法，允许你创建 HTML。TypeScript 支持嵌入、类型检查和将 JSX 直接编译为 JavaScript。

11、TypeScript 支持哪些 JSX 模式？

TypeScript有内置的支持preserve，react和react-native。

• preserve 保持 JSX 完整以用于后续转换。

• react不经过 JSX 转换，而是react.createElement作为.js文件扩展名发出和输出。

• react-native结合起来preserve，react因为它维护所有 JSX 和输出作为.js扩展

12、如何编译 TypeScript 文件

你需要调用 TypeScript 编译器tsc来编译文件。你需要安装 TypeScript 编译器，你可以使用npm.

npm install -g typescript
tsc <TypeScript File Name>
复制代码

13、 TypeScript 中有哪些范围可用？这与JS相比如何

• 全局作用域：在任何类之外定义，可以在程序中的任何地方使用。

• 函数/类范围：在函数或类中定义的变量可以在该范围内的任何地方使用。

• 局部作用域/代码块：在局部作用域中定义的变量可以在该块中的任何地方使用。

14、TypeScript 中的箭头/lambda 函数是什么？

胖箭头函数是用于定义匿名函数的函数表达式的速记语法。它类似于其他语言中的 lambda 函数。箭头函数可让你跳过function关键字并编写更简洁的代码。

15、Omit类型有什么作用？

Omit是实用程序类型的一种形式，它促进了常见的类型转换。Omit允许你通过传递电流Type并选择Keys在新类型中省略来构造类型。

Omit<Type, Keys>
复制代码

例如：

interface Todo {  
   title: string;  
   description: string;  
   completed: boolean;  
   createdAt: number;
}
type TodoPreview = Omit<Todo, "description">;
复制代码