TypeScript Array(数组)声明和简单使用

目录

TypeScript Array(数组)

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

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

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

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

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

6.数组在函数中的使用

7.数组方法

8.数组方法的简单使用


TypeScript Array(数组)

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

let arr: number[] = [1, 2];  //数组
console.log(arr)
let arr2: Array = [1,2];
console.log(arr2) //[ 1, 2 ]
let arr3: Array = ["1","2"];
console.log(arr3) //[ '1', '2' ]
let arr4: Array = ["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' ]

有问题可以在下面评论,我会为大家解答。

你可能感兴趣的:(前端,TS,typescript,javascript,前端)