TypeScript基础语法和使用规则+对象初始化

TypeScript (TS) 是一种由微软开发的开源语言,它是 JavaScript 的一个超集,添加了可选的静态类型和基于类的面向对象编程。它旨在开发大型应用程序并将 JavaScript 编译成清晰和简洁的代码。

一、基础语法和使用规则

1. 类型注解

类型注解是 TypeScript 最核心的特性之一,允许你在变量声明或函数参数后使用冒号(:)添加类型注解。

let isDone: boolean = false;
// 数组类型注解
let list: number[] = [1, 2, 3];// 对象类型注解
let person: { name: string; age: number } = { name: "Alice", age: 30 };

在这里,: boolean 就是一个类型注解,表明变量 isDone 的类型是 boolean

2. 接口

接口(Interfaces)是用于定义对象的形状。接口可以定义属性和方法。

interface Person {name: string;age: number;
}function greet(person: Person) {return "Hello, " + person.name;
}

这个 Person 接口定义了一个拥有 nameage 属性的对象结构。

3. 类

类(Classes)是 TypeScript 的一部分,提供了基于类的面向对象编程方式。

class Animal {name: string;constructor(theName: string) { this.name = theName; }move(distanceInMeters: number = 0) {console.log(`${this.name} moved ${distanceInMeters}m.`);}
}

这里定义了一个简单的 Animal 类,有一个名为 name 的属性和一个 move 方法。

4. 函数

TypeScript 中的函数可以为参数和返回值设置类型。

function add(x: number, y: number): number {return x + y;
}

这里,function add(x: number, y: number): number 定义了一个接受两个 number 类型参数的函数,并返回一个 number 类型的结果。

5. 泛型

泛型(Generics)提供了一种方法来创建可重用的组件,一个组件可以支持多种类型的数据。

function identity<T>(arg: T): T {return arg;
}

这里的 <T> 允许你创建一个工作于多种类型的函数。

6. 枚举

枚举(Enums)是对 JavaScript 标准数据类型的一个补充,让我们可以为一组数值赋予友好的名字。

enum Color {Red, Green, Blue}
let c: Color = Color.Green;

在这个例子中,Color 是一个枚举类型,它有三个成员:RedGreenBlue

总结

TypeScript 提供了强大的工具和概念,如静态类型检查、接口、类、泛型和枚举,可以帮助你建立更加健壮和可维护的代码库。学习 TypeScript 需要时间和实践,但是一旦掌握,它将极大提升你的开发效率及代码质量。希望这个简要的介绍能帮你开始 TypeScript 的学习之旅!

二、初始化对象

在TypeScript中,定义并初始化对象的常见方式有两种:使用类型注解和接口。两者都可以完成对象的定义和初始化,但是它们有不同的用途和优势。类型注解通常用于直接定义对象的形状,而接口则用于定义对象的结构,可以被实现或者扩展。

1. 使用类型注解定义和初始化对象

类型注解可以直接在变量后面定义对象的结构。

let user: { name: string; age: number; } = {name: "Alice",age: 30
};

在这里,我们定义了一个名为 user 的变量,并用花括号 {} 定义了它的类型结构,指明 user 是一个对象,里面包括 name 属性为字符串类型和 age 属性为数字类型。接着,我们用 = 初始化这个对象的具体值。

2. 使用接口定义和初始化对象

接口可用于定义一个可以被多个对象实现的共同结构。

interface User {name: string;age: number;
}let user: User = {name: "Alice",age: 30
};

这里我们定义了一个 User 接口,并将 nameage 作为必须的属性。然后我们声明了一个类型为 User 的变量 user,并初始化为一个包含 nameage 的对象。

在上面两个示例中,我们都定义并初始化了一个具有 nameage 属性的对象。如果对象具有复杂的结构或者会在多个地方使用,那么接口更为适合,因为它提供了更好的复用性和可维护性。

类型字面量 VS 接口

使用类型字面量(如类型注解示例中所示)可以快速定义一个对象,但是如果对象结构较为复杂或者需要在多处使用相同的结构,那么接口会是更好的选择。接口可以被实现(implement)和扩展(extend),这为复用和组织代码提供了更多的灵活性。此外,使用接口也能使代码更加清晰和表意。

请根据实际的代码组织需求和个人喜好选择使用类型注解还是接口。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/bicheng/23357.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

关于Apache Tomcat请求走私漏洞(CVE-2023-46589)

一、 基本情况 Apache Tomcat是一个流行的开源Web服务器和Java Servlet容器。 二、 漏洞描述 Apache Tomcat中修复了一个请求走私漏洞&#xff08;CVE-2023-46589&#xff09;。 由于Tomcat未能正确解析HTTP Trailer标头&#xff0c;超出标头大小限制的特制Trailer标头可能…

儿童护眼灯哪个好?带你了解适合儿童的护眼灯款式分享

儿童护眼灯哪个好&#xff1f;作为我们日常生活中极为实用的小家电&#xff0c;为了确保使用台灯时的舒适性并且保护视力&#xff0c;选择一款专业的护眼台灯成为了一个明智的决定。这样的台灯能够提供更舒适、均匀的照明环境&#xff0c;那么到底儿童护眼灯哪个好你&#xff1…

实现手机空号过滤或手机号码有效性验证

手机空号过滤或手机号码有效性验证通常涉及使用专门的API接口来查询手机号码的状态。这些API接口通常由第三方服务提供商提供&#xff0c;它们会与电信运营商合作或利用自己的数据库来验证手机号码是否真实存在、是否已被分配、是否处于空号状态等。 以下是一些步骤和考虑因素…

关于我做了一个python项目的总结

前言: 首先,我通过python的爬虫技术做了一个关于音乐的项目,实现的功能有搜索音乐,输出歌词,保存歌词,下载音乐 项目构思: 在刚开始时,首先是构思,构思自己要去做哪个方面的,并且要怎么去实现我想实现的功能,然后我就想到要去做一个关于音乐方面的 项目实现: 确定了自己的方向…

爬虫——有道云翻译

废话不多说直接上代码 固定文本内容 import timefrom selenium import webdriver from selenium.common.exceptions import NoSuchElementException, TimeoutException from selenium.webdriver.common.by import By from selenium.webdriver.support.ui import WebDriverWai…

Day 41 NGINX详解

Nginx详解 一、HTTP协议 HTTP协议是Hyper Text Transfer Protocol&#xff08;超文本传输协议&#xff09;的缩写,是用于从万维网&#xff08;WWW:World Wide Web &#xff09;服务器传输超文本到本地浏览器的传送协议。 1、HTTP 工作原理 HTTP协议通信流程 WEB Server&…

超维小课堂 | 6、MAVROS与机载电脑Jetson nano通信

MAVROS与机载电脑Jetson nano通信 ROS系统镜像——Jetson nano b01 4G 链接: 百度云镜像链接 链接&#xff1a;https://pan.baidu.com/s/1NoIEvVdsiYLPvVOWM98hjQ 提取码&#xff1a;cwkj 简介&#xff1a;MAVROS和Jetson nano通信&#xff0c;设置飞控参数和MAVROS文件&am…

Starlette

Starlette是一个轻量级的ASGI框架和工具包&#xff0c;主要用于构建高性能的asyncio服务。它具备以下特点&#xff1a; 轻量级HTTP Web框架&#xff1a;Starlette提供了一个简单且复杂度低的HTTP Web框架。WebSocket支持&#xff1a;允许在应用中实现WebSocket功能。后台任务&…

程序猿大战Python——了解Python

了解Python 编程语言的发展 目标&#xff1a;了解编程语言。 我们知道&#xff0c;咱们的日常沟通交流使用的语言&#xff1a;普通话。 那什么是编程语言呢&#xff1f; 【官方解释】编程语言是用来定义程序的语言形式&#xff0c;也就是说&#xff0c;我们可以通过编程语言…

学习使用js监测浏览器窗口大小变化

学习使用js监测浏览器窗口大小变化 在JavaScript中&#xff0c;可以通过监听resize事件来检测浏览器窗口的大小变化。以下是一个简单的示例代码&#xff0c;用于检测浏览器窗口大小的变化并在控制台输出新的窗口尺寸&#xff1a; javascript // 定义一个处理窗口大小变化的函数…

el-table后台接口返回数据动态合并单元格

在实际工作中&#xff0c;通常数据都是后台接口返回的&#xff0c;有时需要对数据进行合并&#xff0c;可利用el-table的span-method方法&#xff0c;结合数据处理&#xff0c;进行合并&#xff0c;如下实例 <el-table :data"dataTable"borderrow-key"id&qu…

root账号,cmd命令行能用ssh连上服务器,但是vscode连接报错Permission denied,please try again

☆ 问题描述 但是cmd能连接上 ★ 解决方案 点击 然后add到自己的配置文件下 重新选择 这个时候就会出现刚刚添加的&#xff0c;点击选择 输入密码 然后就ok了 ✅ 总结 只能说&#xff1a;玄学&#xff01;

剪画小程序:自媒体必备神器:【视频翻译】自动识别语言、翻译、配音,让外语视频秒变母语!

Hello&#xff0c;大家好呀&#xff01;我是不会画画的小画~ 今天给大家带来一款敲实用的视频翻译工具一一 小程序【剪画】 我们有很小伙伴在学习他国语言时&#xff0c;最大的障碍就是语言的问题了&#xff0c;想要 理解其中的内容&#xff0c;在这之前要下很大的功夫去掌握…

创业新风口:智能售货机的崛起

随着科技的飞速发展&#xff0c;智能售货机已经不再是简单的自动贩卖机&#xff0c;它们变得更加智能、灵活&#xff0c;能够适应各种场景需求&#xff0c;从传统的饮料、零食到新鲜水果、便当、甚至是电子产品&#xff0c;无所不包。这种24小时无人值守的商业模式&#xff0c;…

居民社区团购小程序源码系统 拼团管理+团长管理功能 带完整的安装代拿代码包以及搭建教程

系统概述 居民社区团购小程序源码系统是一款专为社区团购打造的一站式解决方案。它整合了拼团管理和团长管理等核心功能&#xff0c;能够帮助企业和创业者快速搭建自己的社区团购平台&#xff0c;实现高效运营和便捷管理。 代码示例 系统特色功能 1.拼团管理&#xff1a;支持…

工业互联网基本概念及关键技术(295页PPT)

资料介绍&#xff1a; 工业互联网的核心是通过工业互联网平台把设备、生产线、工厂、供应商、产品和客户紧密地连接融合起来。这种连接能够形成跨设备、跨系统、跨厂区、跨地区的互联互通&#xff0c;从而提高效率&#xff0c;推动整个制造服务体系智能化。同时&#xff0c;工…

Spark实战:Spark读取Excel文件

由于Apache Spark本身不支持直接读取Excel文件&#xff0c;我们需要通过一些间接手段来实现&#xff0c;例如先将Excel文件转换为CSV格式&#xff0c;然后使用Spark读取CSV文件。下面我将给出完整的Scala代码示例&#xff0c;包括如何将Excel文件转换为CSV文件&#xff08;这里…

Java环境配置(超详细)

Java环境配置&#xff08;超详细&#xff09; 引言1、安装 JDK1.1、下载安装JDK1.2、配置环境变量&#xff1a;JAVA_HOME1.3、将JAVA_HOME添加到Path中 2、安装 Maven2.1、下载安装Maven2.2、配置maven的环境变量: M2_HOME2.3、将Maven变量添加到Path中 引言 Java开发环境的配…

PyTorch 相关知识介绍

一、PyTorch和TensorFlow 1、PyTorch PyTorch是由Facebook开发的开源深度学习框架&#xff0c;它在动态图和易用性方面表现出色。它以Python为基础&#xff0c;并提供了丰富的工具和接口&#xff0c;使得构建和训练神经网络变得简单快捷。 发展历史和背景 PyTorch 是由 Fac…

创建采购订单免费行项目,注意事项

1.我在使用bapi&#xff08;BAPI_PO_CREATE1&#xff09;创建采购订单免费行项目的时候&#xff0c;还是报错了请输入净价格。 解决方式&#xff1a;把这些数据都赋值好&#xff0c;那么你的采购订单行项目就是免费项目。 BAPIMEPOITEM-IR_IND 空 &#xff08;发票收据标识&am…