typescript速学:类、模块化编程

最新推荐文章于 2024-06-01 21:07:40 发布

原创最新推荐文章于 2024-06-01 21:07:40 发布 · 944 阅读

0 ·

CC 4.0 BY-SA版权

JavaScript魔鬼课程专栏收录该内容

22 篇文章

订阅专栏

本文介绍了一个简单的TypeScript类实践案例，包括用户类(User)及用户操作类(UserService)的设计与实现，展示了如何通过类进行对象的创建和操作。

为了学习类，我们设计一个案列
1、设计一个用户类User：包含用户姓名、年龄
2、设计一个用户操作类UserService：用来操作用户类的增删改查

官方文档：
https://tslang.cn/docs/handbook/classes.html

新建User.ts，代码如下：

//可以定义一个接口
//来限制User类的属性
interface UserInterface{
    userName:string,
    userAge:number
}

// 定义User类
class User{
    _userName:string;
    _userAge:number;

    constructor({userName,userAge}:UserInterface){
        this._userName = userName;
        this._userAge = userAge;
    }
}

// 导出
export {User}

新建UserService.ts，代码如下：

import {User} from "./User";
class UserService{
    _user:User;
    constructor(inputUser:User){
        this._user = inputUser;
    }

    add():number{
        console.log(this._user._userName + "新增成功");
        return 0;
    }
}

// 导出
export {UserService}

ok，2个类都定义好了，下面我们来使用一下。
在index.ts里，代码如下：


// 引入
import {User} from "./User";
import {UserService} from "./UserService";

// 实例化类
let myUser:User = new User({
    userName:"jack",
    userAge:22
});

let myService:UserService = new UserService(myUser);
 console.log(myService.add());