TypeScript Array(九) 数组

1.TypeScript Array 数组

1.1. 描述

  数组对象是使用单独的变量名来存储一系列的值。
 &emsp比如,你现在有一组数据,存单独变量如下:

var data1="Android";
var data2="Java";
var data3="Harmony";

  那如果有10、100个这种变量呢,那这种就不实用了,这时我们可以使用数组来解决:

var array:string[]; // 声明
array= ["Android","Java","Harmony" ];

  现在看起来简洁多了。

1.2. 语法:

var array_name[:datatype];        //声明 
array_name = [val1,val2,valn..];   //初始化

  或者直接在声明时初始化

var array_name[:datatype] = [val1,val2…valn];

实例:

var array:string[]; // 声明
array= ["Android","Java","Harmony" ];
console.log(array[0]);
console.log(array[1]);

执行结果:
在这里插入图片描述

1.3. Array对象

  同样我们也可以使用array对象来创建数组。
  Array对象的构造函数接受以下两种值:
(1)表示数组大小的值
(2)初始化的数组列表,元素使用逗号分隔值。
实例(指定数组的初始化大小):

var arr_name: number[] = new Array(4);
for (var i = 0; i < arr_name.length; i++) {
arr_name[i] = i*2;
console.log(arr_name[i]);
}

执行结果:
在这里插入图片描述

实例(直接初始化数组元素:

var arr_list: string[] = new Array("Android","Java","Harmony");
for (var i = 0; i < arr_list.length; i++) {
console.log(arr_list[i]);
}

执行结果:
在这里插入图片描述

1.4. 数组解构

  我们可以把数组元素赋值给变量,如下:

var arr:number[] = [12,13] 
var[x,y] = arr // 将数组的两个元素赋值给变量 x 和 y
console.log(x) 
console.log(y)

执行结果:
在这里插入图片描述

1.5. 数组迭代

  我们可以使用for语句来循环输出数组各个元素,代码:

var j:any; 
var nums:number[] = [1001,1002,1003,1004] 
for(j in nums) { 
    console.log(nums[j]) 
}

执行结果:
在这里插入图片描述

1.6. 数组方法

(1)concat() - 链接两个或更多的数组,并返回结果
实例:

  var arryList1 = ["Android", "Java", "ios"];
  var arrayList2 = [1, 2, 3];
  var result = arryList1.concat(arrayList2);
  document.getElementById("demo").innerHTML = "result = " + result;

执行结果:
result = Android,Java,ios,1,2,3
(2)forEach() – 数组每个元素都执行一次回调函数
实例:

let num = [6, 7, 8];
num.forEach(function(value) {
	console.log(value);
});

执行结果:
在这里插入图片描述

(3)indexOf() – 搜索数组中的元素,并返回它所在的位置,如果没有搜索到,返回值-1,代表没有此项。

var index = [12, 5, 8, 130, 44].indexOf(8); 
console.log("index is : " + index );  // 2

(4)join() – 将数组中所有元素放入一个字符串中

var arr = new Array("Google","Runoob","Taobao"); 
var str = arr.join(); 
console.log("str : " + str );  // Google,Runoob,Taobao        
var str = arr.join(", "); 
console.log("str : " + str );  // Google, Runoob, Taobao       
var str = arr.join(" + "); 
console.log("str : " + str );  // Google + Runoob + Taobao

(5)lastIndexOf() – 返回一个指定的字符串值最后出现的位置,在一个字符串中的指定位置从后往前的搜索。
实例:

var index = [12, 5, 8, 130,8, 44].lastIndexOf(8); 
console.log("index is : " + index );  // 4

(6)pop() – 删除数组的最后一个元素,并返回删除的元素
实例:

var numbers = [1, 4, 9];   
var element = numbers.pop(); 
console.log("element is : " + element );  // 9
console.log("numbers = : " + JSON.stringify(numbers));

执行结果:
在这里插入图片描述
(7)push() – 向数组末尾添加一个或多个元素,并返回新的长度
实例:

var numbers = new Array(1, 4, 9); 
var length1 = numbers.push(10); 
console.log("new numbers is : " + numbers );  // 1,4,9,10 
console.log("length1 = " + length1 );  // 4
length2 = numbers.push(20); 
console.log("new numbers is : " + numbers );  // 1,4,9,10,20
console.log("length2 = " + length2 );  // 5

执行结果:
new numbers is : 1,4,9,10
length1 = 4
new numbers is : 1,4,9,10,20
length2 = 5
(8)reduce() – 将数组元素计算为一个值(从左到右)
实例:

var total = [2, 4, 6, 8];
var result = total.reduce(function(a, b) {
return a + b;
})
console.log("reduce() - result = " + result) // 20

执行结果:reduce() - result = 20
(9)reduceRight() – 将数据元素计算为一个值(从右到左)
  实例同上的reduce()数组方法。
(10)reverse() – 反转数组的元素顺序
实例:

var total = [2, 4, 6, 8];
var result = total.reverse();
console.log("reverse() - result = " + result) // 8,6,4,2

执行结果:reverse() - result = 8,6,4,2
(11)shift() – 删除并返回数组的第一个元素(跟pop()方法刚好相反)。
实例:

var arr = [10, 1, 2, 3].shift(); 
console.log("Shifted value is : " + arr );  // 10

(12)slice() – 选取数组的某一部分,并返回新选择的数组
实例:

var arr = ["orange", "mango", "banana", "sugar", "tea"];
console.log("arr.slice( 1, 2) : " + arr.slice(1, 2)); // mango
console.log("arr.slice( 1, 3) : " + arr.slice(1, 3)); // mango,banana

13)、sort() – 对数组的元素进行排序

var arr = new Array("orange", "mango", "banana", "sugar"); 
var sorted = arr.sort(); 
console.log("Returned string is : " + sorted );  // banana,mango,orange,sugar

(14)toString() – 把数组转换为字符串并返回结果

var arr = new Array("orange", "mango", "banana", "sugar");         
var str = arr.toString(); 
console.log("Returned string is : " + str );  // orange,mango,banana,sugar

(15)unshift() - 向数组的开头添加一个更多元素,并返回新的长度。

var arr = new Array("orange", "mango", "banana", "sugar"); 
var length = arr.unshift("water"); 
console.log("Returned array is : " + arr );  // water,orange,mango,banana,sugar 
console.log("Length of the array is : " + length ); // 5

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

【unity小技巧】FPS简单的射击换挡瞄准动画控制

文章目录 射击动画控制换弹动画瞄准动画完结 射击动画控制 换弹动画 调用 瞄准动画 问题&#xff1a;瞄准时&#xff0c;但是动画会卡住&#xff0c;不会播放瞄准的待机动画 修改 调用 动画如果太快可以去修改播放速度 播放速度变慢了&#xff0c;可能导致切换待机动画也…

防火墙详解

一、基本定义 所谓“防火墙”是指一种将内部网和公众访问网&#xff08;如Internet&#xff09;分开的方法&#xff0c;它实际上是一种建立在现代通信网络技术和信息安全技术基础上的应用性安全技术&#xff0c;隔离技术。越来越多地应用于专用网络与公用网络的互联环境之中&a…

理想架构的高回退Doherty功率放大器理论与ADS仿真-Multistage

理想架构的高回退Doherty功率放大器理论与仿真-Multistage 参考&#xff1a; 三路Doherty设计 01 射频基础知识–基础概念 Switchmode RF and Microwave Power Amplifiers、 理想架构的Doherty功率放大器&#xff08;等分经典款&#xff09;的理论与ADS电流源仿真参考&#x…

springCloud gateway 防止XSS漏洞

springCloud gateway 防止XSS漏洞 一.XSS(跨站脚本)漏洞详解1.XSS的原理和分类2.XSS漏洞的危害3.XSS的防御 二.Java开发中防范XSS跨站脚本攻击的思路三.相关代码&#xff08;适用于spring cloud gateway&#xff09;1.CacheBodyGlobalFilter.java2.XssRequestGlobalFilter.java…

二进制部署promethues

1、定义&#xff1a;promethues是一个开源的系统监控以及报警系统&#xff0c;整合zabbix的功能&#xff08;监控系统、网络、设备&#xff09;&#xff0c;promethues可以兼容网络、设备、容器监控、告警系统。因为其与k8s是一个项目基金开发出来的产品&#xff0c;天生匹配k8…

OpenCV 8 - 模糊处理(均值滤波,高斯滤波,中值滤波,双边滤波)

模糊处理原理: Blur是图像处理中最简单和常用的操作之一,使用该操作的原因为了给图像预处理时候减低噪声使用,Blur操作其背后是数学的卷积计算, 通常这些卷积算子计算都是线性操作,所以又出线性虑波。 假设有6x6的图像像素点矩阵。卷积过程:6x6上面是个3x3的窗口,从左向右,…

【Linux】基本指令(上)

&#x1f984;个人主页:修修修也 &#x1f38f;所属专栏:Linux ⚙️操作环境:Xshell (操作系统:CentOS 7.9 64位) 目录 Xshell快捷键 Linux基本指令 ls指令 pwd指令 cd指令 touch指令 mkdir指令 rmdir指令/rm指令 结语 Xshell快捷键 AltEnter 全屏/取消全屏 Tab 进…

如何对Ajax请求进行封装操作,解决跨域问题的方法,如何使用core解决跨域

目录 1.Ajax原理 2.为什么要封装 3.如何进行封装 4.如何请求 5.如何解决Ajax跨域问题 6.使用CORS解决Ajax跨域问题 1.服务端 2.客户端 1.Ajax原理 Ajax&#xff08;Asynchronous JavaScript and XML&#xff09;是一种通过在后台与服务器进行少量数据交换&…

通用CI/CD软件平台TeamCity全新发布v2023.11——增强Git托管平台的集成

TeamCity是一个通用的 CI/CD 软件平台&#xff0c;可以实现灵活的工作流、协作和开发做法。我们的解决方案将帮助在您的 DevOps 流程中成功实现持续集成、持续交付和持续部署。 TeamCity 2023.11正式版下载 TeamCity 2023.11 带来了矩阵构建和构建缓存等多项备受期待的功能&a…

立体边界,让arcgis出图更酷炫一些

就是这样子的那个图—— 本期我们还是用长沙市为例&#xff0c; 来手把手的演示制作立体边界&#xff0c; 就是这个样子的边界—— 第一步—准备底图 其实你准备什么底图都可以哈&#xff0c;例如调用天地图、下载个影像图&#xff0c;或者用其他什么的底图&#xff0c;都是…

【图文详解】阿里云服务器放行高防IP加入安全组

打开阿里云的云服务器配置面板&#xff0c;在要操作实例的操作列找到更多 > 网络和安全组 > 安全组配置。 对已有安全组配置规则&#xff0c;或者直接添加安全组规则。 根据需要放通高防IP在内的IP段相应协议类型的端口访问。

linux交叉编译方法——虚拟机编译,在树莓派平台上运行

一、 交叉编译是什么 交叉编译 是在一个平台上生成另一个平台上的可执行代码。 我们再windows上面编写C51代码&#xff0c;并编译成可执行代码&#xff0c;如xx.hex, 是在c51上面运行&#xff0c;不是在windows上面运行 我们在ubuntu上面编写树…

设计模式——状态模式(State Pattern)

概述 状态模式(State Pattern)&#xff1a;允许一个对象在其内部状态改变时改变它的行为&#xff0c;对象看起来似乎修改了它的类。其别名为状态对象(Objects for States)&#xff0c;状态模式是一种对象行为型模式。状态模式用于解决系统中复杂对象的状态转换以及不同状态下行…

pdf高亮显示

现在前端pdf需求越来越多&#xff0c;比如发票的显示&#xff0c;文件的显示&#xff0c;怎么实现具体步骤百度一下吧&#xff0c;这里不做详细介绍&#xff0c;主要记录下遇到的问题 1.页面pdf已经看到了&#xff0c;但是 iframe.contentWindow.PDFViewerApplication显示unde…

鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之DatePicker组件

鸿蒙&#xff08;HarmonyOS&#xff09;项目方舟框架&#xff08;ArkUI&#xff09;之DatePicker组件 一、操作环境 操作系统: Windows 10 专业版、IDE:DevEco Studio 3.1、SDK:HarmonyOS 3.1 二、DatePicker组件 日期选择器组件&#xff0c;用于根据指定日期范围创建日期滑…

MTK8365安卓核心板_联发科MT8365(Genio 350)核心板规格参数

MTK8365安卓核心板是一款高性能的嵌入式处理器产品&#xff0c;基于联发科领先的SoC架构和先进的12纳米工艺。它集成了四核ARM Cortex-A53处理器&#xff0c;每个核心频率高达2.0 GHz&#xff0c;搭载强大的多标准视频加速器&#xff0c;支持高达1080p 60fps的视频解码。此外&a…

【数据结构 04】单链表

一、链表简介 链表是一种物理存储结构上非连续的存储结构&#xff0c;数据元素的逻辑顺序是通过链表中的指针链接次序实现的。 链表在结构上的分类&#xff1a; 1. 带头结点或无头结点 2. 单向或双向 3. 循环或非循环 虽然链表有多种结构类型&#xff0c;但是我么在实际开发中…

云计算概述(云计算类型、技术驱动力、关键技术、特征、特点、通用点、架构层次)(二)

云计算概述&#xff08;二&#xff09; &#xff08;云计算类型、技术驱动力、关键技术、特征、特点、通用点、架构层次&#xff09; 目录 零、00时光宝盒 一、云计算类型&#xff08;以服务的内容或形态来分) 二、云计算的12种技术驱动力 三、云计算的关键技术 四、云计…

软件工程知识梳理4-详细设计

详细设计阶段的根本目标是确定应该怎样具体地实现所要求的系统&#xff0c;也就是说.经过这个阶段的设计工作.应该得出对目标系统的精确描述.从而在编码阶段可以把这个描述直接翻译成用某种程序设计语言书写的程序。 详细设计的的目标不仅仅是逻辑上正确地实现每个模块地功能&a…

ONLYOFFICE 文档 8.0 现已发布:PDF 表单、RTL、单变量求解、图表向导、插件界面设计等更新

我们最新版本的在线编辑器现已推出&#xff0c;为整个套件优化了多项功能。阅读下文&#xff0c;了解详细更新内容。 什么是 ONLYOFFICE 文档 ONLYOFFICE 文档是一款开源的办公套件&#xff0c;由总部位于拉脱维亚的Ascensio System SIA开发。它支持处理文本文档、电子表格、演…