TypeScript基础教程

最新推荐文章于 2025-07-03 14:26:26 发布

原创最新推荐文章于 2025-07-03 14:26:26 发布 · 467 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#Typescript

这篇教程介绍了TypeScript的基础知识，包括如何安装TypeScript，以及详细讲解了各种数据类型如布尔、数字、字符串、数组、元组、枚举、任意类型、null、undefined、void和never类型。还提及了在TypeScript中定义函数的方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

TypeScript安装

npm install -g typescript
tsc hello.ts

vscode自动编译ts文件

tsc --init生成配置文件tsconfig.json,改‘outDir‘:’./js’
点击vscode里面的任务-运行任务
点击tsc:监视-tsconfig.json

TypeScript数据类型（ts中定义变量必须指定类型）

1. 布尔类型（boolean）

let flag:boolean = true;
flag = false;

2. 数字类型（number）

let num: number = 123;
num = 234;

3. 字符串类型（string）

let str:string = 'abc';
str = 'bcd';

4. 数组类型（array）
定义数组有两种方式
第一种：

let arr:number[] = [11,22,33];

第二种：

let arr2:Array<number> = [99,0];
console.log(arr2);

5. 元组类型（tuple）（属于数组的一种）

//希望数组里面的类型可以是number也可以是string
let arr3:[number, string] = [12,'aaa'];

6. 枚举类型（enum）

enum Flag {success=1, error=2};
let s:Flag = Flag.success;
console.log(s);//如果标识符没有赋值，它的值就是索引值
enum Color {blue, red=3,'orange'}
let o:Color = Color.orange;
console.log(o) // 4

7. 任意类型（any）

let nb :any = 123;
nb = 'str';

8. null和undefined

9. void类型 (一般用于定义方法的时候没有返回值)

function run():void{
console.log(1);
}

如果方法有返回值，返回什么值就给什么类型

10. never类型

typescript定义函数

// 函数定义方法传参
let getInfo = (name:string,age:number):string=>{

  return `${name}---${age}`
}
console.log(getInfo('ccx',18));

// 方法可选参数  参数后面跟 ？表示可选参数
let getInfo2 = (name:string,age?:number):string=>{
if(age){
  return `${name}---${age}`
}else{
  return `${name}---年龄保密`
} 
}
console.log(getInfo2('ccx'));

//默认参数
let getInfo3 = (name:string,age:number = 20):string=>{
  if(age){
    return `${name}---${age}`
  }else{
    return `${name}---年龄保密`
  } 
  }
  console.log(getInfo3('ccx'));

 //剩余参数
let sum = (...resule:number[]):number=>{
  let num =0;
  for(let i=0;i<resule.length;i++){
    num+=resule[i];
 }
  return num;
}
console.log(sum(1,2,3));