脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → JavaScript → javascript技巧 → ts Array数组声明使用

TypeScript中Array(数组)声明与简单使用方法

 更新时间：2023年12月15日 10:26:27   作者：samxiaoguai  
这篇文章主要给大家介绍了关于TypeScript中Array(数组)声明与简单使用的相关资料,TypeScript Array(数组)数组对象是使用单独的变量名来存储一系列的值,文中通过代码介绍的非常详细,需要的朋友可以参考下

TypeScript Array(数组)

1.数组声明：数组对象是使用单独的变量名来存储一系列的值。

let arr: number[] = [1, 2];  //数组
console.log(arr)
let arr2: Array<number> = [1,2];
console.log(arr2) //[ 1, 2 ]
let arr3: Array<string> = ["1","2"];
console.log(arr3) //[ '1', '2' ]
let arr4: Array<any> = ["1",2];
console.log(arr4) //[ '1', 2 ]

2.Array 对象：可以使用 Array 对象创建数组。

数组对象的构造函数接受以下两种值：

(1)表示数组大小的数值。

let oneArr:number[] = new Array(6)  
for(let i:number = 0; i< oneArr.length; i++) { 
    oneArr[i] = i * 2 
}
console.log(oneArr) //[ 0, 2, 4, 6, 8, 10 ]

(2)初始化的数组列表，元素使用逗号分隔值。

let twoArr:number[] = new Array(1,2,3)  
console.log(twoArr) //[ 1,2,3 ]

3:数组解构:可以把数组元素赋值给变量。

let [x,y] = oneArr;
console.log(x,y) //0 2

4.数组迭代:可以使用循环输出数组的各个元素

let twoArr:number[] = new Array(1,2,3)  
for(let i:number = 0; i< twoArr.length; i++) { 
    console.log(twoArr[i])
}
// 1
// 2
// 3

注： 可以参考TypeScript循环一章节

5.多维数组:一个数组的元素可以是另外一个数组

let manyArr:number[][] = [[1,2,3],[1,2,3]];
console.log(manyArr)
let manyArr2:string[][] = [["1","2","3"],["1","2","3"]];
console.log(manyArr2)
let manyArr3:any[][] = [[1,2,"3"],[1,2,"3"]];
console.log(manyArr3)
// [ [ 1, 2, 3 ], [ 1, 2, 3 ] ]
// [ [ '1', '2', '3' ], [ '1', '2', '3' ] ]
// [ [ 1, 2, '3' ], [ 1, 2, '3' ] ]

6.数组在函数中的使用

(1)作为参数传递给函数

let useValue = new Array(manyArr)
function useArr (manyArr:number[][][]) {
   console.log(manyArr)
}
useArr(useValue)  //[ [ [ 1, 2, 3 ], [ 1, 2, 3 ] ] ]

(2)作为函数的返回值

function returnArr(): number[][][] {
    return new Array(manyArr)
}
console.log(returnArr()) //[ [ [ 1, 2, 3 ], [ 1, 2, 3 ] ] ]

7.数组方法

方法描述
concat()连接两个或更多的数组，并返回结果。
every()可以检测数值元素的每个元素是否都符合某种条件。

filter()

检测数值元素，并返回符合条件所有元素的数组。
forEach()数组每个元素都执行一次回调函数。
indexOf()

搜索数组中的元素，并返回它所在的位置。如果搜索不到，返回值 -1，代表没有此项。

join()把数组的所有元素连接为一个字符串，可以指定符号连接
lastIndexOf()返回一个指定的字符串值最后出现的位置，在字符串中的指定位置从后向前搜索。如果搜索不到，返回值 -1，代表没有此项。
map()通过指定函数处理数组的每个元素，并返回处理后的数组。
pop()删除数组的最后一个元素并返回删除的元素。
push()向数组的末尾添加一个或更多元素，并返回新的长度。
reduce()将数组元素计算为一个值（从左到右）。
reduceRight()将数组元素计算为一个值（从右到左）。
reverse()反转数组的元素顺序。
shift()删除并返回数组的第一个元素。
slice()选取数组的的一部分，并返回一个新数组。
some()可以检测数组元素中是否有元素符合指定条件。
sort()对数组的元素进行排序。
splice()从数组中添加或删除元素。
toString()把数组转换为字符串，并返回结果。
unshift()向数组的开头添加一个或更多元素，并返回新的长度。

8.数组方法的简单使用

注：

1. slice可以接受两个参数（起始位置和结束位置）或者一个或者不传值，当没传入值时，返回的数组的值原始数组值，如果只传入一个参数，则返回截取的原始数组从参数代表的起始位置到原始数组的结束位置（包含结束位置），如果传入两个参数，则返回截取的原始数组从参数代表的起始位置到参数代表结束位置（不包含结束位置）。

2.splice可以传入三个参数插入位置（删除起始位置）和删除数量和插入的值。

3.every和some的另外释意和使用可以参考TypeScript循环一章

let carr1: number[] = [1, 2, 3];
let carr2: number[] = [4, 5, 6];
let carr3: number[] = [7, 8, 9];
console.log(carr1.concat(carr2)) //[ 1, 2, 3, 4, 5, 6 ]
console.log(carr1.concat(carr2, carr3)) //[ 1, 2, 3, 4, 5, 6, 7, 8, 9 ]

function isBigEnough(item: number) {
    return (item >= 10);
}

let eArr = [1, 2, 20].every(isBigEnough);
console.log("Test Value : " + eArr); // false

let fArr = [1, 2, 20].filter(isBigEnough);
console.log(fArr); // [ 20 ]

let feArr = [1, 2, 20]
feArr.forEach((item: number) => {
    console.log(item);
});

let indexOfArr = [1, 2, 20];
console.log(feArr.indexOf(1));
console.log(feArr.indexOf(20));
console.log(feArr.indexOf(3));
// 0
// 2
// -1
let joinArr = [1, 2, 20];
console.log(joinArr.join("-")); //"1-2-20"

let lastArr = [1, 2, 2, 2, 20];
console.log(lastArr.lastIndexOf(20));
console.log(lastArr.lastIndexOf(2));
console.log(lastArr.lastIndexOf(3));
// 4
// 3
// -1
let mapArr = [1, 4, 9];
console.log(mapArr.map(Math.sqrt)); //[ 1, 2, 3 ]

let popArr = [1, 4, 9];
console.log(popArr.pop()); //9

let pushArr = [1, 4, 9];
pushArr.push(10);
console.log(pushArr); //[ 1, 4, 9, 10 ]

let reduceArr = [1, 2, 3].reduce((a, b) => { return a + b; });
let reduceArr2 = ["1", "2", "3"].reduce((a, b) => { return a + b; });
console.log(reduceArr)
console.log(reduceArr2)
// 6
// 123
let reduceRArr = [1, 2, 3].reduceRight((a, b) => { return a + b; });
let reduceRArr2 = ["1", "2", "3"].reduceRight((a, b) => { return a + b; });
console.log(reduceRArr)
console.log(reduceRArr2)
// 6
// 321

let reverseArr = [1, 2, 3];
console.log(reverseArr.reverse()); //[ 3, 2, 1 ]

let shiftArr = [1, 2, 3];
console.log(shiftArr.shift()); //1

let sliceArr = [4, 5, 6, 7, 8];
console.log(sliceArr.slice()); //[ 4, 5, 6, 7, 8 ]
console.log(sliceArr.slice(1, 2)); //[ 5 ]
console.log(sliceArr.slice(1, 3)); //[ 5, 6 ]
console.log(sliceArr.slice(0, 3)); //[ 4, 5, 6 ]
console.log(sliceArr.slice(3)); //[ 7, 8 ]

function isBigEnough2(item: number) {
    return (item >= 10);

}

let someArr = [1, 2, 13].some(isBigEnough2);
console.log(someArr);  //true
let someArr2 = [1, 2, 3].some(isBigEnough2);
console.log(someArr2); //false

let sortArr = new Array(1, 3, 2, 1); 
console.log(sortArr.sort()); //[ 1, 1, 2, 3 ]
let sortArr2 = new Array("1", "3", "2", "1"); 
console.log(sortArr2.sort()); //[ '1', '1', '2', '3' ]
let sortArr3 = new Array("abc", "cbc", "bbc", "abc"); 
console.log(sortArr3.sort()); //[ 'abc', 'abc', 'bbc', 'cbc' ]

let spliceArr = new Array("1", "2", "3");
spliceArr.splice(2, 0, "hello"); 
console.log(spliceArr) //[ '1', '2', 'hello', '3' ]
let spliceArr2 = new Array("1", "2", "3","4");
spliceArr2.splice(2, 1, "hello"); 
console.log(spliceArr2) //[ '1', '2', 'hello', '4' ]
let spliceArr3 = new Array("1", "2", "3","4","5");
spliceArr3.splice(2, 2); 
console.log(spliceArr3) //[ '1', '2', '5' ]

let tostringArr = new Array("1", "2", "3");
console.log(tostringArr.toString()) //1,2,3

let unshiftArr = new Array("1", "2", "3");
console.log(tostringArr.unshift("6")) //4
console.log(tostringArr) //[ '6', '1', '2', '3' ]
console.log(tostringArr.unshift("6","7")) //6
console.log(tostringArr) //[ '6', '7', '6', '1', '2', '3' ]

总结 

到此这篇关于TypeScript中Array(数组)声明与简单使用的文章就介绍到这了,更多相关ts Array数组声明使用内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！

您可能感兴趣的文章:

相关文章

  • 在小程序开发中使用npm的方法

    在小程序开发中使用npm的方法

    微信小程序在 2.2.1 版本后增加了对 npm 包加载的支持，使得小程序支持使用 npm 安装第三方包。这篇文章主要介绍了在小程序开发中使用npm的方法，感兴趣的小伙伴们可以参考一下
    2018-10-10
  • js 数值转换为3位逗号分隔的示例代码

    js 数值转换为3位逗号分隔的示例代码

    本篇文章主要是对js将数值转换为3位逗号分隔的示例代码进行了介绍，需要的朋友可以过来参考下，希望对大家有所帮助
    2014-02-02
  • Bootstrap modal使用及点击外部不消失的解决方法

    Bootstrap modal使用及点击外部不消失的解决方法

    这篇文章主要为大家详细介绍了Bootstrap modal使用及点击外部不消失的解决方法，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2016-12-12
  • JavaScript仿聊天室聊天记录

    JavaScript仿聊天室聊天记录

    这篇文章主要为大家详细介绍了JavaScript仿聊天室聊天记录实现，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2016-12-12
  • JS实现Enter键跳转及控件获得焦点

    JS实现Enter键跳转及控件获得焦点

    想让Enter键跳转的同时让控件获得焦点，具体实现js代码如下，感兴趣的朋友可以参考下，希望对大家有所帮助
    2013-08-08
  • JS不要再到处使用绝对等于运算符了

    JS不要再到处使用绝对等于运算符了

    这篇文章主要介绍了JS不要再到处使用绝对等于运算符了，对此感兴趣的同学，可以参考下
    2021-04-04
  • JS中的数组方法笔记整理

    JS中的数组方法笔记整理

    这篇文章主要介绍了JS中的数组方法笔记整理 的相关资料,非常不错，具有参考借鉴价值，需要的朋友可以参考下
    2016-07-07
  • 学会javascript之迭代器

    学会javascript之迭代器

    本文主要讲解javascript之迭代器，在 JavaScript 中，迭代器是一个对象，它定义一个序列，并在终止时可能返回一个返回值。需要详细了解相关知识的小伙伴可以参考一下这篇文章
    2021-09-09
  • javascript数组快速打乱重排的方法

    javascript数组快速打乱重排的方法

    本文介绍了利用Array.prototype.sort方法和Math.random()实现快速打乱数组的方法，大家参考使用吧
    2014-01-01
  • JavaScript实现简单的轮播图效果

    JavaScript实现简单的轮播图效果

    这篇文章主要为大家详细介绍了JavaScript实现简单的轮播图效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2021-06-06

最新评论