TypeScript 声明文件
TypeScript 声明文件(Declaration Files)用于描述 JavaScript 代码中存在但 TypeScript 编译器无法理解的部分。它们通常具有 .d.ts 扩展名,并包含了类型信息、接口、命名空间等。创建声明文件假设你有一个 JavaScript 库,比如一个名为 myLibrary 的库,而你想要在 TypeScript 中使用它。首先,你可以创建一个声明文件 myLibrary.d.ts,并在其中提供相应的类型信息。// myLibrary.d.ts// 声明全局变量或函数declare const myGlobalVar: number;declare function myFunction(arg1: string, arg2: number): void;// 声明一个简单的对象declare const myObject: { prop1: string; prop2: number;};// 声明一个简单的类declare class MyClass { constructor(arg: string); method(...
TypeScript 模块
在 TypeScript 中,模块系统是一种组织和封装代码的方式,它允许你将代码分割成多个文件,并通过导入和导出机制来连接它们。这有助于提高代码的可维护性、可重用性和可扩展性。以下是 TypeScript 模块的基本概念和使用方法:导出(Export)和导入(Import)导出你可以使用 export 关键字将变量、函数、类等导出,使其在其他模块中可用。// person.tsexport interface Person { name: string; age: number;}export function greet(person: Person): void { console.log(`Hello, ${person.name}! You are ${person.age} years old.`);}导入你可以使用 import 关键字导入其他模块中导出的成员。// main.tsimport { Person, greet } from "./person";const person: Person = { name: "A...
TypeScript 命名空间
在 TypeScript 中,命名空间(Namespace)是一种组织和封装代码的方式,用于解决全局命名冲突的问题。命名空间可以包含变量、函数、类等,并且它们不会污染全局命名空间。下面是一个简单的 TypeScript 命名空间的示例:// 定义一个命名空间namespace MyNamespace { export interface Person { name: string; age: number; } export function greet(person: Person): void { console.log(`Hello, ${person.name}! You are ${person.age} years old.`); }}// 使用命名空间中的接口和函数const person: MyNamespace.Person = { name: "Alice", age: 30 };MyNamespace.greet(person);在上面的例子中,我们创建了一个名为 MyNames...
TypeScript 泛型
TypeScript 中的泛型是一种强大的工具,它允许你编写可重用、灵活的代码,同时提高类型安全性。泛型使你能够在编写函数、类或接口时使用参数化类型。以下是一个简单的 TypeScript 泛型示例:// 使用泛型定义一个函数,该函数返回传入的参数数组的第一个元素function getFirstElement<T>(arr: T[]): T | undefined { return arr.length > 0 ? arr[0] : undefined;}// 使用泛型函数const stringArray: string[] = ["apple", "banana", "orange"];const firstElementOfStringArray: string | undefined = getFirstElement(stringArray);console.log(firstElementOfStringArray); // 输出: "apple"const numbe...
TypeScript 对象
在 TypeScript 中,对象(Object)是一种数据结构,用于存储键值对。对象可以包含多个属性,每个属性都有一个键和对应的值。以下是一些关于对象的基本用法:1. 对象的声明:let person: { firstName: string; lastName: string; age: number;};person = { firstName: "John", lastName: "Doe", age: 30};2. 对象的属性和方法:let car: { brand: string; model: string; start: () => void;};car = { brand: "Toyota", model: "Camry", start: function() { console.log("Engine started"); }};car.start(); // 输出: Engine started3. 类型别名和接口:可以使用类型...
TypeScript 类
在 TypeScript 中,类(Classes)是一种面向对象的编程概念,用于创建对象和定义对象的行为。以下是一些关于类的基本用法:1. 类的声明:class Person { firstName: string; lastName: string; age: number; constructor(firstName: string, lastName: string, age: number) { this.firstName = firstName; this.lastName = lastName; this.age = age; }}let person: Person = new Person("John", "Doe", 30);2. 类的属性和方法:class Animal { name: string; constructor(name: string) { this.name = name; } makeSound(): void { console.log("Som...
TypeScript 接口
在 TypeScript 中,接口(Interfaces)用于定义对象的结构,规定对象应该包含哪些属性以及它们的类型。以下是一些关于接口的基本用法:1. 声明接口:interface Person { firstName: string; lastName: string; age: number;}let person: Person = { firstName: "John", lastName: "Doe", age: 30};2. 可选属性:interface Person { firstName: string; lastName?: string; // 可选属性 age: number;}let person: Person = { firstName: "John", age: 30};3. 只读属性:interface Point { readonly x: number; readonly y: number;}let point: Point = { x: 10, y: 20 }...
TypeScript 联合类型
在 TypeScript 中,联合类型(Union Types)允许一个变量具有多种不同的类型。使用联合类型,你可以指定一个变量可以是多种类型之一。以下是一些关于联合类型的基本用法:1. 声明联合类型:let myVar: string | number;myVar = "Hello";myVar = 123;// myVar = true; // 错误,不能赋值布尔值在上述例子中,myVar 可以是 string 类型或 number 类型之一。2. 使用联合类型处理不同类型的值:function displayType(value: string | number): void { if (typeof value === "string") { console.log("Value is a string: " + value); } else { console.log("Value is a number: " + value); }}displayType("Hell...
TypeScript 元组
在 TypeScript 中,元组(Tuple)是一种特殊的数组,它允许存储多个不同类型的元素。与数组不同,元组的每个位置上可以有不同的数据类型。以下是一些关于元组的基本用法:1. 声明元组:let myTuple: [string, number, boolean];myTuple = ["Hello", 123, true];在上述例子中,myTuple 是一个包含字符串、数字和布尔值的元组。2. 访问元组元素:let myTuple: [string, number, boolean] = ["Hello", 123, true];let firstElement: string = myTuple[0];let secondElement: number = myTuple[1];let thirdElement: boolean = myTuple[2];3. 修改元组元素:let myTuple: [string, number, boolean] = ["Hello", 123, true];myTuple[0]...
TypeScript Map 对象
在 TypeScript 中,Map 是一种数据结构,用于存储键值对。与普通对象不同,Map 允许使用任何类型的键,并保留键值对的插入顺序。以下是一些关于 Map 对象的基本用法:1. 创建 Map 对象:let myMap: Map<string, number> = new Map();在上述例子中,string 是键的类型,number 是值的类型。你可以根据需要选择适当的类型。2. 添加和获取键值对:let myMap: Map<string, number> = new Map();myMap.set("one", 1);myMap.set("two", 2);let valueOne: number | undefined = myMap.get("one");console.log(valueOne); // 输出: 13. 遍历 Map:let myMap: Map<string, number> = new Map();myMap.set("one", ...
TypeScript Array(数组)
在 TypeScript 中,数组是一种用于存储多个相同类型元素的数据结构。以下是一些关于数组的基本用法:1. 数组声明:let numbers: number[] = [1, 2, 3, 4, 5];let fruits: string[] = ["apple", "banana", "orange"];或者使用 Array 泛型:let numbers: Array<number> = [1, 2, 3, 4, 5];let fruits: Array<string> = ["apple", "banana", "orange"];2. 访问数组元素:let numbers: number[] = [1, 2, 3, 4, 5];let firstNumber: number = numbers[0];let secondNumber: number = numbers[1];3. 修改数组元素:let numbers: number[] ...
TypeScript String
在 TypeScript 中,string 是一种表示文本数据的基本数据类型。以下是一些关于 string 类型的基本用法:1. 声明 string 类型变量:let str: string = "Hello, TypeScript!";2. 字符串连接:let firstName: string = "John";let lastName: string = "Doe";let fullName: string = firstName + " " + lastName;或者使用模板字符串:let fullName: string = `${firstName} ${lastName}`;3. 字符串长度:let greeting: string = "Hello";let length: number = greeting.length;4. 字符串方法:let message: string = " Hello, TypeScript! ";let tri...
TypeScript Number
在 TypeScript 中,number 是一种表示数字的基本数据类型。number 类型可以包括整数和浮点数。以下是一些关于 number 类型的基本用法:1. 声明 number 类型变量:let num: number = 5;let decimal: number = 3.14;let hexadecimal: number = 0xf00d;let binary: number = 0b1010;let octal: number = 0o744;2. 运算:let x: number = 5;let y: number = 2;let sum: number = x + y; // 加法let difference: number = x - y; // 减法let product: number = x * y; // 乘法let quotient: number = x / y; // 除法let remainder: number = x % y; // 取余let increment: number = x++; // 自增let decrement: numbe...
TypeScript 函数
在 TypeScript 中,函数的声明和使用方式与 JavaScript 类似,但 TypeScript 提供了静态类型检查以及一些其他功能。以下是 TypeScript 中函数的基本用法:1. 函数声明:function add(x: number, y: number): number { return x + y;}let result: number = add(3, 5);console.log(result); // 输出: 8在上述例子中,add 函数接受两个参数 x 和 y,两个参数都被注解为 number 类型,函数返回值也被注解为 number 类型。2. 可选参数和默认参数:function greet(name: string, greeting?: string): string { if (greeting) { return `${greeting}, ${name}!`; } else { return `Hello, ${name}!`; }}let message1: string = greet("John"...
TypeScript 循环
在 TypeScript 中,循环结构与 JavaScript 中的循环结构相似,主要有 for 循环、while 循环、do-while 循环以及 for...of 和 for...in 这两个用于遍历对象和数组的循环结构。以下是一些示例:1. for 循环:for (let i: number = 0; i < 5; i++) { console.log(i);}2. while 循环:let i: number = 0;while (i < 5) { console.log(i); i++;}3. do-while 循环:let i: number = 0;do { console.log(i); i++;} while (i < 5);4. for...of 循环(用于遍历数组):let numbers: number[] = [1, 2, 3, 4, 5];for (let num of numbers) { console.log(num);}5. for...in 循环(用于遍历对象的属性):let person: { name: strin...
TypeScript 条件语句
在 TypeScript 中,条件语句用于根据条件执行不同的代码块。与 JavaScript 相似,TypeScript 支持 if、else、else if 和三元条件运算符等条件语句。以下是一些示例:1. if 语句:let condition: boolean = true;if (condition) { // 当条件为 true 时执行这里的代码块 console.log("Condition is true");}2. if-else 语句:let condition: boolean = false;if (condition) { // 当条件为 true 时执行这里的代码块 console.log("Condition is true");} else { // 当条件为 false 时执行这里的代码块 console.log("Condition is false");}3. else if 语句:let score: number = 85;if (score >= 90) { con...
TypeScript 运算符
TypeScript 支持与 JavaScript 相同的运算符,包括算术运算符、比较运算符、逻辑运算符等。以下是一些常见的 TypeScript 运算符:1. 算术运算符let x: number = 5;let y: number = 2;let sum: number = x + y; // 加法let difference: number = x - y; // 减法let product: number = x * y; // 乘法let quotient: number = x / y; // 除法let remainder: number = x % y; // 取余let increment: number = x++; // 自增let decrement: number = x--; // 自减2. 比较运算符let isEqual: boolean = x === y; // 等于let isNotEqual: boolean = x !== y; // 不等于let isGreater: boolean = x > y; // 大于let isLess: ...
TypeScript 变量声明
在 TypeScript 中,变量的声明可以使用 let、const、var 等关键字,并且可以添加类型注解来明确变量的类型。以下是一些常见的变量声明的方式:1. 使用 let 声明变量:let myVar: number = 10;let myString: string = "Hello, TypeScript";let myBool: boolean = true;2. 使用 const 声明常量:const PI: number = 3.14;const MAX_SIZE: number = 100;常量一旦被赋值,其值不能再被修改。3. 使用 var 声明变量:在 TypeScript 中,var 仍然可以用于声明变量,但不推荐使用,因为它有一些不足之处。一般情况下,推荐使用 let 和 const。var myVar: number = 5;4. 类型推断:当你声明变量而没有显式指定类型时,TypeScript 会根据变量的初始值自动推断其类型:let inferredString = "Hello"; // 推断为 string 类...
TypeScript 基础类型
TypeScript 提供了一些基础类型,用于表示变量的数据类型。以下是 TypeScript 的一些基础类型:1. 布尔类型(boolean)let isDone: boolean = false;2. 数字类型(number)let decimal: number = 6;let hex: number = 0xf00d;let binary: number = 0b1010;let octal: number = 0o744;3. 字符串类型(string)let color: string = "blue";let sentence: string = `The color is ${color}`;4. 数组类型(array)let list: number[] = [1, 2, 3];// 或者使用数组泛型let list: Array<number> = [1, 2, 3];5. 元组类型(tuple)let x: [string, number];x = ["hello", 10]; // 合法// x = [10, ...
TypeScript 基础语法
TypeScript 基础语法与 JavaScript 类似,但它引入了静态类型和一些其他特性。以下是一些 TypeScript 的基础语法概念:1. 变量声明使用 let 或 const 来声明变量。与 JavaScript 不同,TypeScript 可以提供静态类型注解:let myVar: number = 10;const myConst: string = "Hello, TypeScript!";2. 类型TypeScript 支持多种数据类型,包括基本类型和对象类型。例如:let num: number = 5;let str: string = "Hello";let bool: boolean = true;let arr: number[] = [1, 2, 3];let tuple: [string, number] = ["John", 25];let obj: { name: string, age: number } = { name: "John", age: 25 };3....