【5天学会TS】打卡学习Typescript的第一天
文章目录:
目录
文章目录:
前言:
版本说明:
具体内容:
1.基本数据类型
1.1 string
1.2 number
1.3 boolean
1.4 array
1.5 tuple
1.6 enum
1.7 any
1.8 void
1.9 null
1.10 undefined
1.11 never
1.12 object
1.13 union
1.14 unknown
1.15 类型断言
1.16 复杂结构 interface
最后
前言:
在技术的广袤宇宙中,每一次新的探索都如同点亮一颗未知的星辰。今天,我怀揣着激动与期待,来和大家分享一段充满挑战与惊喜的技术之旅。
TypeScript 是 JavaScript 的超集,扩展了 JavaScript 的语法,因此现有的 JavaScript 代码可与 TypeScript 一起工作无需任何修改,TypeScript 通过类型注解提供编译时的静态类型检查。
版本说明:
Node.js: 18.20.4
npm:10.7.0
具体内容:
1.基本数据类型
1.1 string
表示文本数据
let name: string = "Alice";
1.2 number
表示数字,包括整数和浮点数 (TypeScript 和 JavaScript 没有整数类型)
let age: number = 30;
1.3 boolean
表示布尔值 true
或 false
let isDone: boolean = true;
1.4 array
表示相同类型的元素数组。可以使用 type[] 或 Array<type> 两种方式表示。
let numbers: number[] = [1, 2, 3];
let names: Array<string> = ["Alice", "Bob"];
1.5 tuple
表示已知类型和长度的数组
let person: [string, number] = ["Alice", 30];
1.6 enum
定义一组命名常量
enum Color { Red, Green, Blue };
1.7 any
任意类型,不进行类型检查
let value: any = 42;
1.8 void
无返回值(常用于函数)
function log(): void {}
function logMessage(message: string): void {
console.log(message);
}
1.9 null
表示空值
let empty: null = null;
1.10 undefined
表示未定义
let undef: undefined = undefined;
1.11 never
表示不会有返回值
function error(): never { throw new Error("error"); }
1.12 object
表示非原始类型
let obj: object = { name: "Alice" };
1.13 union
联合类型,表示可以是多种类型之一
let id: string
let id: string | number;
id = "123";
id = 456;
1.14 unknown
不确定类型,需类型检查后再使用
let value: unknown = "Hello";
1.15 类型断言
类型断言可以让开发者明确告诉编译器变量的类型,常用于无法推断的情况。可以使用 as 或尖括号语法。类型断言可以用来手动指定一个值的类型,即允许变量从一种类型更改为另一种类型。
var str = '1'
var str2:number = <number> <any> str //str、str2 是 string 类型
console.log(str2)
let someValue: any = "this is a string";
let strLength: number = (someValue as string).length;
1.16 复杂结构 interface
接口是一系列抽象方法的声明,是一些方法特征的集合,这些方法都应该是抽象的,需要由具体的类去实现,然后第三方就可以通过这组抽象方法调用,让具体的类执行具体的方法。
// 使用 interface 定义用户的结构
interface User {
id: number; // number 类型,用于唯一标识用户
username: string; // string 类型,表示用户名
isActive: boolean; // boolean 类型,表示用户是否激活
role: Role; // enum 类型,用于表示用户角色
hobbies: string[]; // array 类型,存储用户的兴趣爱好
contactInfo: [string, number]; // tuple 类型,包含电话号码的元组,格式为:[区域码, 电话号码]
}
// 创建用户对象,符合 User 接口的结构
const user: User = {
id: 1,
username: "Alice",
isActive: true,
role: Role.User,
hobbies: ["Reading", "Gaming"],
contactInfo: ["+1", 123456789],
};
interface RunOptions {
program:string;
commandline:string[]|string|(()=>string);
}
// commandline 是字符串
var options:RunOptions = {program:"test1",commandline:"Hello"};
console.log(options.commandline)
// commandline 是字符串数组
options = {program:"test1",commandline:["Hello","World"]};
console.log(options.commandline[0]);
console.log(options.commandline[1]);
// commandline 是一个函数表达式
options = {program:"test1",commandline:()=>{return "**Hello World**";}};
var fn:any = options.commandline;
console.log(fn());
最后
至此,本次的技术探索之旅暂告一段落,但技术的海洋浩瀚无垠,我们的征程远未结束。
如果你觉得这篇博客为你带来了新的视角、解决了你的困惑或者激发了你的思考,那么请不要吝啬你的点赞和收藏,让我们一起在技术的道路上携手前行,共同成长。
关注我的技术博客,未来还有更多精彩的技术分享和深度的探讨等待着大家。
每一次的点赞都是对我的鼓励
每一次的收藏都是知识的沉淀
让我们一起用技术的力量创造更美好的未来