Typescript 学习笔记

当学习 TypeScript 时,你可能会关注以下几个方面:基础语法、类型系统、函数、类、模块等。下面是一个简单的 TypeScript 学习笔记,包含了这些方面的基础内容和代码示例:

1. 基础语法

变量声明
typescript 复制代码
let name: string = "John";
const age: number = 30;
函数
typescript 复制代码
function greet(name: string): string {
    return "Hello, " + name;
}

console.log(greet("World")); // 输出:Hello, World

2. 类型系统

基本类型
typescript 复制代码
let num: number = 10;
let str: string = "Hello";
let bool: boolean = true;
数组
typescript 复制代码
let numbers: number[] = [1, 2, 3, 4, 5];
let names: string[] = ["John", "Doe"];
元组
typescript 复制代码
let person: [string, number] = ["John", 30];

3. 函数

参数类型和返回类型
typescript 复制代码
function add(x: number, y: number): number {
    return x + y;
}
可选参数和默认参数
typescript 复制代码
function greet(name: string, message: string = "Hello"): void {
    console.log(message + ", " + name);
}

greet("John"); // 输出:Hello, John

4. 类

typescript 复制代码
class Person {
    private name: string;
    private 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.");
    }
}

let person = new Person("John", 30);
person.greet(); // 输出:Hello, my name is John and I am 30 years old.

5. 模块

typescript 复制代码
// math.ts
export function add(x: number, y: number): number {
    return x + y;
}

// app.ts
import { add } from "./math";

console.log(add(5, 3)); // 输出:8

这只是 TypeScript 的入门,你可以根据自己的学习进度和需求进一步深入学习。可以参考 TypeScript 官方文档以及其他在线资源来深入了解。

相关推荐
@二进制21 小时前
vue3+vant4+ts出现页面空白?甚至在App.vue的<template></template>中随便输入都无法显示?
前端·vue.js·typescript
桂森滨21 小时前
Vue3+Pinia+Vite+TS 还原高性能外卖APP项目 4️⃣首页开发
前端·typescript·vue
samroom21 小时前
【鸿蒙应用开发 Dev ECO Studio 5.0版本】从0到1!从无到有!最全!计算器------按钮动画、滑动退格、中缀表达式转后缀表达式、UI设计
数据结构·ui·华为·typescript·harmonyos·鸿蒙
hong16168821 小时前
TypeScript类型断言
linux·javascript·typescript
落魄江湖行1 天前
入门篇六 Nuxt4错误处理:给应用装个安全气囊
前端·typescript·nuxt4
kyriewen1 天前
你的JS代码总在半夜崩溃?TypeScript来“上保险”了
前端·javascript·typescript
一只小阿乐1 天前
TypeScript中的React开发
前端·javascript·typescript·react
俺不会敲代码啊啊啊1 天前
封装 ECharts Hook 适配多种图表容器
前端·vue.js·typescript·echarts
jump_jump1 天前
用 3100 个数字造一台计算机
性能优化·架构·typescript
这是个栗子2 天前
TypeScript(三)
前端·javascript·typescript·react