【TS】ts中的类:class

简介: 【TS】ts中的类:class

在ts中,使用class需要给class的属性加上数据类型,实例class或者更改class中的值时,必须符合class中属性定义的数据类型,如果数据类型不同,则会提示,例如:

// 定义接口
    interface IPerson{
        firstName : string // 姓
        lastName : string //名
    }
    // 定义一个类
    class Person {
        // 定义公共的字段(属性)
        firstName : string // 姓
        lastName : string // 名
        fullName : string // 姓名
        // 定义构造函数
        constructor(firstName : string ,lastName : string) {
            // 更新属性数据
            this.firstName = firstName
            this.lastName = lastName
            // 姓名
            this.fullName = `${this.firstName},${this.lastName} `
        }
    }
   // 定义一个函数  传值的时候需要符合接口的规则
    function showName (person : IPerson) {
        return `${person.firstName},${person.lastName} `
    }
   // 实例化对象  new了一个class ,传入两个字符串,对应constructor两个字符串
   // class中的firstName = constructor的firstName 
   // class中的lastName = constructor的lastName 
   const person = new Person('东方','不败')
   // 将值传入函数中,函数返回结果,打印 // 东方,不败
   console.log(showName(person));

步骤拆解

1、先定义一个类,给定义的类传入两个字符串,constructor接受传入的字符串并更改内部对应的值

2、class值更改后返回给const person

3、const person的值传入函数中,函数的类型需要符合**接口(IPerson)**的类型规范

4、函数return最终结果,打印结果

在类中,传入值的数据类型,必须是符合class的数据类型规范的,否则系统会提示错误


案例源码:https://gitee.com/wang_fan_w/ts-seminar

如果觉得这篇文章对你有帮助,欢迎点亮star

目录
相关文章
|
2月前
|
资源调度 JavaScript 前端开发
介绍一下ts
介绍一下ts
39 1
|
8月前
|
JavaScript 前端开发 开发者
ts详解以及相关例子(一篇带你详细了解ts)
ts详解以及相关例子(一篇带你详细了解ts)
57 1
|
9月前
|
JavaScript 前端开发 安全
|
10月前
|
JavaScript 前端开发
ts - 类
TypeScript支持JavaScript的新特性,比如支持基于类的面向对象编程。让我们创建一个Student类,它带有一个构造函数和一些公共字段。 注意类和接口可以一起工作。
|
10月前
|
JavaScript Java
ts - 接口
在 TypeScript 中,我们使用接口(Interfaces)来定义对象的类型。
|
10月前
|
JavaScript 前端开发
ts - ts基础
https://www.tslang.cn/ TypeScript是Microsoft公司注册商标。 TypeScript具有类型系统,且是JavaScript的超集。 它可以编译成普通的JavaScript代码。 TypeScript支持任意浏览器,任意环境,任意系统并且是开源的。
|
11月前
|
JavaScript 前端开发 IDE
什么是ts,作用是什么
什么是ts,作用是什么
584 0
|
11月前
|
JavaScript 开发者
什么是TS?
什么是TS?
112 0
|
12月前
|
JavaScript 索引
TS接口
TypeScript 中的接口是一种抽象结构,用于定义对象的类型。接口定义了对象应该包含的属性和方法,但不提供实现。
|
JavaScript
【TS】ts的使用和类型注解
【TS】ts的使用和类型注解
110 0