当前位置: 首页 > news >正文

ts:对象数组的简单使用

ts中对象数组的简单使用

  • 一、主要内容说明
  • 二、例子
    • 1、源码1
    • 2、源码1运行效果
  • 三、结语
  • 四、定位日期

一、主要内容说明

平常ts创建数组的格式如下:

let array:string[]=["元素1","元素2","元素3","元素3","元素4"---]

元素1、元素2、元素3,等这些元素,可以为字符,数字,也可以为对象。ts中大括号“{}”表示一个对象,在上面格式的基础上,把中括号“ [] ”里的各个元素替换为对象“ {} ”,即

let array:string[]=[{},{},{},{},{}---]

如此一个对象数组便可建立完成。对象“ {} ”里面可以添加很多东西,变量函数等。
上边我们创建的 array 类别为字符串类型“string”,上边各个元素替换成对象后,array也可更改类型,用以输入或输出函数。类型可以有系统里自带的number、string、date等这些类,也可以自己创建一个类别,如class可以创建自定义的类,当然本文我们不用。我们用interface创建接口类,接口命名为People。于是我们创建的对象类型选择便可更改为People一类,如 let array:People,若想改为数组形式,添加中括号便可,如 let array:People[]
最后我们可以对数组使用各种方法,如sort、map、filter等方法。
下边源码中数组命名为people,上边数组格式命名为array,文字和源码对照看需要注意

二、例子

1、源码1

// 定义一个接口 People,描述一个人包含的属性
interface People {name: string; // 姓名age: number;  // 年龄
}// 创建一个 People 类型的数组,包含多个对象
let people: People[] = [{ name: '小蜗牛764号', age: 30 },{ name: '小蜗牛765号', age: 25 },{ name: '小蜗牛766号', age: 35 }
];// 按照年龄升序排序
people.sort((a, b) => a.age - b.age);
console.log(people); // 输出排序后的结果// 按照姓名字母顺序排序
people.sort((a, b) => a.name.localeCompare(b.name));
console.log(people); // 输出排序后的结果// 过滤出成年人(年龄大于18岁的人)
const adults = people.filter(person => person.age > 18);
console.log(adults); // 输出成年人列表// 提取所有人的姓名
const names = people.map(person => person.name);// 计算每个人的年龄乘以2
const names_age2_add = people.map(person => person.age * 2);console.log(names); // 输出所有人的姓名
console.log(names_age2_add); // 输出每个人的年龄乘以2的结果

2、源码1运行效果

在这里插入图片描述

三、结语

本文主要说明ts对象数组的简单使用,理解也容易,先理解一般数组的样子,然后把数组中的普通元素变换为对象来理解便可。当然本文对于数组方法未过多讲解,博主会另起博文说明。编写本文主要用于知识回顾使用,后面一回顾可以短时间内捡回知识点。如此如此,这般这般。
说实话,ts相关的内容,想把逻辑性的东西用文字表达出来好难!博主原本想从let、var、const这些最简单的变量命名开始编写博文,但发现难以下手,现在更改为从某一部分内容入手,里面添加点其他东西,然后再拓展编写其他东西,如此便有编写的方向。本篇由此产生。
由于笔者的能力有限,创作的内容有所不足在所难免,也敬请读者包涵和指出,万分感谢!

四、定位日期

2024-10-26;
15:52;

相关文章:

ts:对象数组的简单使用

ts中对象数组的简单使用 一、主要内容说明二、例子1、源码12、源码1运行效果 三、结语四、定位日期 一、主要内容说明 平常ts创建数组的格式如下: let array:string[]["元素1","元素2","元素3","元素3","元素4"…...

当我们在微服务中使用API网关时,它是否会成为系统的瓶颈?这种潜在的瓶颈如何评估和解决?如何在微服务架构中保证高效请求流量?|API网关|微服务|异步处理

目录 1. API网关在微服务中的角色与重要性 2. API网关瓶颈的评估 2.1 请求延迟分析 2.2 并发请求量监控 2.3 内存和CPU使用情况 2.4 限流和熔断机制评估 2.5 日志分析 3. API网关瓶颈的解决方案 3.1 缓存机制优化 3.2 负载均衡优化 3.3 异步处理与消息队列 3.4 限流…...

微服务设计模式 - 特性标志(Feature Flags)

微服务设计模式 - 特性标志(Feature Flags) 定义 特性标志(Feature Flags),又称特性开关(Feature Toggles),是一种常见的云计算设计模式,允许开发人员通过配置动态地打开…...

故障诊断 | MTF-TLSSA-DarkNet-GRU-MSA迁移学习故障识别程序(t分布+莱维飞行改进麻雀优化)

故障诊断 | 故障诊断实例代码 目录 故障诊断 | 故障诊断实例代码效果一览基本介绍程序设计参考资料 效果一览 基本介绍 利用了迁移学习和多项技术改进,包括麻雀搜索法、DarkNet19、GRU、多头注意力机制等,以提高故障识别的准确性和效率 模型框架&#x…...

【mysql 进阶】2-1. MySQL 服务器介绍

MySQL 服务器简介 通常所说的 MySQL 服务器指的是mysqld程序,当运⾏mysqld后对外提供MySQL 服务,这个专题的内容涵盖了以下关于MySQL 服务器以及相关配置的内容,包括: 服务器⽀持的启动选项。可以在命令⾏和配置⽂件中指定这些选…...

基于Qt的多线程并行和循序运行实验Demo

致谢(Acknowledgement): 感谢Youtube博主Qt With Ketan与KDAB精心录制的Qt多线程处理应用教程,感谢Bilibili博主爱编程的大丙对Qt多线程与线程池内容深入浅出的讲解。 一、计算机线程相关概念 线程概念[1]: 在计算机科…...

机器视觉-相机、镜头、光源(总结)

目录 1、机器视觉光源概述 2、光源的作用 3、光谱 4、工业场景常见光源 4.1、白炽灯 4.2、卤素灯 4.3、 荧光灯 4.4、LED灯 4.5、激光灯 5、光源的基本性能 5.1、光通量 5.2、光效率 5.3、发光强度 5.4、光照度 5.5、均匀性 5.6、色温 5.7、显色性 6、基本光学…...

第六十二周周报 HestGCL

文章目录 week 62 HestGCL摘要Abstract1. 题目2. Abstract3. 文献解读3.1 Introduction3.2 创新点 4. 网络结构4.1 基础4.2 HestGCL4.2.1 图的构造和数据的预处理4.2.2 双视图异构时空图神经网络4.2.3 预测与优化 5. 实验过程5.1 实验设置 6. 结论参考文献 week 62 HestGCL 摘…...

存储期类别

文章目录 前言一、自动存储期(Automatic Storage Duration)二、静态存储期(Static Storage Duration)三、动态存储期(Dynamic Storage Duration)四、线程存储期(Thread Storage Duration&#x…...

开源模型应用落地-Qwen2-VL-7B-Instruct-vLLM-OpenAI API Client调用

一、前言 学习Qwen2-VL ,为我们打开了一扇通往先进人工智能技术的大门。让我们能够深入了解当今最前沿的视觉语言模型的工作原理和强大能力。这不仅拓宽了我们的知识视野,更让我们站在科技发展的潮头,紧跟时代的步伐。 Qwen2-VL 具有卓越的图…...

风电叶片损伤YOLO检测数据集(猫脸码客第229期)

风电叶片损伤检测:为清洁能源保驾护航 一、风电叶片:清洁能源的关键组件 风电叶片作为风力发电的核心组件,在将风能转化为电能的过程中起着至关重要的作用。它犹如巨大的风车翅膀,捕捉流动的风,将其转化为机械能&…...

修改 RN 打包后生成的app-release 安装包的名称

在React Native项目中,修改打包后生成的Android app-release.apk 安装包的名称通常涉及修改Android的构建配置。以下是详细步骤: 修改Android打包后的APK名称 找到build.gradle文件: 打开你的React Native项目中的android/app/build.gradle文…...

大模型EfficientSam用于图像语义分割自动标注

安装labelme Labelme安装及使用教程-CSDN博客 pip install labelme -i https://pypi.tuna.tsinghua.edu.cn/simple 在安装的过程中因为会需要pyqt5 error: subprocess-exited-with-error Building wheel for PyQt5-sip (pyproject.toml) did not run successfully. │ exit …...

一个关于@JsonIgnore的isxxx()问题

一个关于JsonIgnore的问题 版本:2.13.5 <dependency><groupId>com.fasterxml.jackson.core</groupId><artifactId>jackson-databind</artifactId><optional>true</optional></dependency>代码&#xff1a; Data public clas…...

Django-cookie,session

Cookie简介 Cookie&#xff0c;有时也用Cookies&#xff0c;是指web程序为了辨别用户身份、进行 session 跟踪而储存在用户本地终端上的数据&#xff08;通常经过加密&#xff09;&#xff0c;一般是以键值对的形式存在&#xff0c;Cookie具有不可跨域名性 Cookie是http协议中…...

HarmonyOS开发 - 本地持久化之实现LocalStorage支持多实例

用户首选项为应用提供Key-Value键值型的数据处理能力&#xff0c;支持应用持久化轻量级数据&#xff0c;并对其修改和查询。数据存储形式为键值对&#xff0c;键的类型为字符串型&#xff0c;值的存储数据类型包括数字型、字符型、布尔型以及这3种类型的数组类型。 在上一篇中&…...

【已解决,含泪总结】非root权限在服务器Ubuntu18.04上配置python和torch环境,代码最终成功训练(二)

配置torch环境 pip升级 因为一些包安装不成功可能和pip版本有关&#xff0c;所以先升级pip 吸取之前python有多个版本的经验&#xff0c;所以我指定了Python版本的pip进行升级 就是python3.8版本&#xff1a; /home/某某/Python3.8/bin/python3.8 &#xff08;要换成你实际的…...

Flutter鸿蒙next 刷新机制的高级使用【衍生详解】

✅近期推荐&#xff1a;求职神器 https://bbs.csdn.net/topics/619384540 &#x1f525;欢迎大家订阅系列专栏&#xff1a;flutter_鸿蒙next &#x1f4ac;淼学派语录&#xff1a;只有不断的否认自己和肯定自己&#xff0c;才能走出弯曲不平的泥泞路&#xff0c;因为平坦的大路…...

c/c++--静态变量和静态函数(static)

目录 1 c静态函数和静态变量 1.1 C静态成员函数&#xff1a; 1.1.1定义与基本语法 1.1.2 不依赖于实例 1.1.3 访问限制 1.1.4共享数据 1.1.5 作用域与命名 1.1.6 工厂函数和工厂方法&#xff08;常用途&#xff09; ​​​1.2 c静态函数&#xff08;) 1.3c静态变量 …...

Windows系统启动MongoDB报错无法连接服务器

文章目录 发现问题解决办法 发现问题 1&#xff09;、先是发现执行 mongo 命令&#xff0c;启动报错&#xff1a; error: MongoNetworkError: connect ECONNREFUSED 127.0.0.1:27017&#xff1b; 2&#xff09;、再检查 MongoDB 进程 tasklist | findstr mongo 发现没有进程&a…...

数据链路层的主要功能是什么

数据链路层&#xff08;OSI模型第2层&#xff09;的核心功能是在相邻网络节点&#xff08;如交换机、主机&#xff09;间提供可靠的数据帧传输服务&#xff0c;主要职责包括&#xff1a; &#x1f511; 核心功能详解&#xff1a; 帧封装与解封装 封装&#xff1a; 将网络层下发…...

关于 WASM:1. WASM 基础原理

一、WASM 简介 1.1 WebAssembly 是什么&#xff1f; WebAssembly&#xff08;WASM&#xff09; 是一种能在现代浏览器中高效运行的二进制指令格式&#xff0c;它不是传统的编程语言&#xff0c;而是一种 低级字节码格式&#xff0c;可由高级语言&#xff08;如 C、C、Rust&am…...

vue3+vite项目中使用.env文件环境变量方法

vue3vite项目中使用.env文件环境变量方法 .env文件作用命名规则常用的配置项示例使用方法注意事项在vite.config.js文件中读取环境变量方法 .env文件作用 .env 文件用于定义环境变量&#xff0c;这些变量可以在项目中通过 import.meta.env 进行访问。Vite 会自动加载这些环境变…...

关键领域软件测试的突围之路:如何破解安全与效率的平衡难题

在数字化浪潮席卷全球的今天&#xff0c;软件系统已成为国家关键领域的核心战斗力。不同于普通商业软件&#xff0c;这些承载着国家安全使命的软件系统面临着前所未有的质量挑战——如何在确保绝对安全的前提下&#xff0c;实现高效测试与快速迭代&#xff1f;这一命题正考验着…...

HDFS分布式存储 zookeeper

hadoop介绍 狭义上hadoop是指apache的一款开源软件 用java语言实现开源框架&#xff0c;允许使用简单的变成模型跨计算机对大型集群进行分布式处理&#xff08;1.海量的数据存储 2.海量数据的计算&#xff09;Hadoop核心组件 hdfs&#xff08;分布式文件存储系统&#xff09;&a…...

Linux nano命令的基本使用

参考资料 GNU nanoを使いこなすnano基础 目录 一. 简介二. 文件打开2.1 普通方式打开文件2.2 只读方式打开文件 三. 文件查看3.1 打开文件时&#xff0c;显示行号3.2 翻页查看 四. 文件编辑4.1 Ctrl K 复制 和 Ctrl U 粘贴4.2 Alt/Esc U 撤回 五. 文件保存与退出5.1 Ctrl …...

作为测试我们应该关注redis哪些方面

1、功能测试 数据结构操作&#xff1a;验证字符串、列表、哈希、集合和有序的基本操作是否正确 持久化&#xff1a;测试aof和aof持久化机制&#xff0c;确保数据在开启后正确恢复。 事务&#xff1a;检查事务的原子性和回滚机制。 发布订阅&#xff1a;确保消息正确传递。 2、性…...

脑机新手指南(七):OpenBCI_GUI:从环境搭建到数据可视化(上)

一、OpenBCI_GUI 项目概述 &#xff08;一&#xff09;项目背景与目标 OpenBCI 是一个开源的脑电信号采集硬件平台&#xff0c;其配套的 OpenBCI_GUI 则是专为该硬件设计的图形化界面工具。对于研究人员、开发者和学生而言&#xff0c;首次接触 OpenBCI 设备时&#xff0c;往…...

uniapp 实现腾讯云IM群文件上传下载功能

UniApp 集成腾讯云IM实现群文件上传下载功能全攻略 一、功能背景与技术选型 在团队协作场景中&#xff0c;群文件共享是核心需求之一。本文将介绍如何基于腾讯云IMCOS&#xff0c;在uniapp中实现&#xff1a; 群内文件上传/下载文件元数据管理下载进度追踪跨平台文件预览 二…...

【Veristand】Veristand环境安装教程-Linux RT / Windows

首先声明&#xff0c;此教程是针对Simulink编译模型并导入Veristand中编写的&#xff0c;同时需要注意的是老用户编译可能用的是Veristand Model Framework&#xff0c;那个是历史版本&#xff0c;且NI不会再维护&#xff0c;新版本编译支持为VeriStand Model Generation Suppo…...