TypeScript是一种静态类型的JavaScript超集,它提供了更强的类型检查和代码提示,以及更好的代码可维护性和可读性。下面是从基础语法到高级特性的TypeScript入门指南:
1. 基础语法
1.1 数据类型
TypeScript支持JavaScript中的所有数据类型,包括数字、字符串、布尔、数组、元组、枚举、任意类型、空类型和null/undefined类型等。
let num: number = 123;
let str: string = 'hello';
let bool: boolean = true;
let arr: number[] = [1, 2, 3];
let tuple: [string, number] = ['hello', 123];
enum Color { Red, Green, Blue };
let c: Color = Color.Green;
let anyType: any = 'hello';
let voidType: void = undefined;
let nullType: null = null;
let undefinedType: undefined = undefined;
1.2 变量声明
在TypeScript中,可以使用let、const和var关键字来声明变量,其中let和const是ES6中引入的关键字,var是ES5中使用的关键字。推荐使用let和const来声明变量,它们提供了更好的变量作用域和类型检查。
let a: number = 123;
const b: string = 'hello';
var c: boolean = true;
1.3 函数定义
在TypeScript中,可以使用箭头函数和函数表达式来定义函数。箭头函数使用“=>”符号来定义函数,函数表达式使用function关键字定义函数。函数也可以有可选参数、默认参数和剩余参数等。
const add = (a: number, b: number): number => a + b;
function greet(name: string, age?: number): void {
console.log(`Hello, ${name}!`);
}
function sum(a: number, b: number = 0, ...rest: number[]): number {
let result = a + b;
rest.forEach(num => result += num);
return result;
}
1.4 类定义
在TypeScript中,可以使用class关键字来定义类。类可以有构造函数、属性和方法等。
class Person {
name: string;
age: number;
constructor(name: string, age: number) {
this.name = name;
this.age = age;
}
greet(): void {
console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
}
}
const person = new Person('Alice', 25);
person.greet();
2. 高级特性
2.1 泛型
TypeScript支持泛型,可以让代码更加通用和可重用。泛型可以应用于函数、类和接口等。
function identity<T>(arg: T): T {
return arg;
}
const result = identity<string>('hello');
2.2 接口
在接口中定义的属性和方法可以有可选标记、只读标记和函数类型等。
interface Person {
name: string;
age?: number;
readonly id: number;
greet(): void;
}
class Student implements Person {
name: string;
id: number;
constructor(name: string, id: number) {
this.name = name;
this.id = id;
}
greet(): void {
console.log(`Hello, my name is ${this.name} and my id is ${this.id}.`);
}
}
const student = new Student('Alice', 123);
student.greet();
2.3 类型别名
在TypeScript中,可以使用类型别名来给一个类型起一个新的名字。类型别名可以用于基本类型、联合类型、交叉类型和任意类型等。
type Age = number;
type NameOrAge = string | Age;
type PersonInfo = { name: string, age: number };
2.4 枚举
在TypeScript中,可以使用枚举来定义一组有名字的常量。枚举可以是数字枚举或字符串枚举。
enum Color {
Red = 1,
Green,
Blue
}
enum Size {
Small = 'S',
Medium = 'M',
Large = 'L'
}
console.log(Color.Red); // 1
console.log(Color.Green); // 2
console.log(Size.Medium); // 'M'
2.5 命名空间
在TypeScript中,可以使用命名空间来组织代码并避免命名冲突。命名空间可以包含变量、函数、类和接口等。
namespace MathUtil {
export const PI = 3.14;
export function add(a: number, b: number): number {
return a + b;
}
}
console.log(MathUtil.PI);
console.log(MathUtil.add(1, 2));
2.6 模块
在TypeScript中,可以使用模块来组织代码并实现代码的复用。模块可以导出变量、函数、类和接口等,也可以导入其他模块的导出。
export const PI = 3.14;
export function add(a: number, b: number): number {
return a + b;
}
import { PI, add } from './math';
console.log(PI);
console.log(add(1, 2));
结论
以上是一个简单的TypeScript入门指南,从基础语法到高级特性,覆盖了TypeScript的主要特性。希望对你了解和使用TypeScript有所帮助。
文章来源于网络,作者:27149,如若转载,请注明出处:https://puhuiju.com/9094.html