TypeScript中Array(數(shù)組)聲明與簡單使用方法

更新時間：2023年12月15日 10:26:27 作者：samxiaoguai

這篇文章主要給大家介紹了關(guān)于TypeScript中Array(數(shù)組)聲明與簡單使用的相關(guān)資料,TypeScript Array(數(shù)組)數(shù)組對象是使用單獨的變量名來存儲一系列的值,文中通過代碼介紹的非常詳細,需要的朋友可以參考下

1.數(shù)組聲明：數(shù)組對象是使用單獨的變量名來存儲一系列的值。
2.Array 對象：可以使用 Array 對象創(chuàng)建數(shù)組。
3:數(shù)組解構(gòu):可以把數(shù)組元素賦值給變量。
4.數(shù)組迭代:可以使用循環(huán)輸出數(shù)組的各個元素
5.多維數(shù)組:一個數(shù)組的元素可以是另外一個數(shù)組
6.數(shù)組在函數(shù)中的使用
7.數(shù)組方法
8.數(shù)組方法的簡單使用

總結(jié)

TypeScript Array(數(shù)組)

1.數(shù)組聲明：數(shù)組對象是使用單獨的變量名來存儲一系列的值。

let arr: number[] = [1, 2];  //數(shù)組
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 對象創(chuàng)建數(shù)組。

數(shù)組對象的構(gòu)造函數(shù)接受以下兩種值：

(1)表示數(shù)組大小的數(shù)值。

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)初始化的數(shù)組列表，元素使用逗號分隔值。

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

3:數(shù)組解構(gòu):可以把數(shù)組元素賦值給變量。

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

4.數(shù)組迭代:可以使用循環(huán)輸出數(shù)組的各個元素

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循環(huán)一章節(jié)

5.多維數(shù)組:一個數(shù)組的元素可以是另外一個數(shù)組

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.數(shù)組在函數(shù)中的使用

(1)作為參數(shù)傳遞給函數(shù)

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

(2)作為函數(shù)的返回值

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

7.數(shù)組方法

方法	描述
concat()	連接兩個或更多的數(shù)組，并返回結(jié)果。
every()	可以檢測數(shù)值元素的每個元素是否都符合某種條件。
filter()	檢測數(shù)值元素，并返回符合條件所有元素的數(shù)組。
forEach()	數(shù)組每個元素都執(zhí)行一次回調(diào)函數(shù)。
indexOf()	搜索數(shù)組中的元素，并返回它所在的位置。如果搜索不到，返回值 -1，代表沒有此項。
join()	把數(shù)組的所有元素連接為一個字符串，可以指定符號連接
lastIndexOf()	返回一個指定的字符串值最后出現(xiàn)的位置，在字符串中的指定位置從后向前搜索。如果搜索不到，返回值 -1，代表沒有此項。
map()	通過指定函數(shù)處理數(shù)組的每個元素，并返回處理后的數(shù)組。
pop()	刪除數(shù)組的最后一個元素并返回刪除的元素。
push()	向數(shù)組的末尾添加一個或更多元素，并返回新的長度。
reduce()	將數(shù)組元素計算為一個值（從左到右）。
reduceRight()	將數(shù)組元素計算為一個值（從右到左）。
reverse()	反轉(zhuǎn)數(shù)組的元素順序。
shift()	刪除并返回數(shù)組的第一個元素。
slice()	選取數(shù)組的的一部分，并返回一個新數(shù)組。
some()	可以檢測數(shù)組元素中是否有元素符合指定條件。
sort()	對數(shù)組的元素進行排序。
splice()	從數(shù)組中添加或刪除元素。
toString()	把數(shù)組轉(zhuǎn)換為字符串，并返回結(jié)果。
unshift()	向數(shù)組的開頭添加一個或更多元素，并返回新的長度。

8.數(shù)組方法的簡單使用

注：

1. slice可以接受兩個參數(shù)（起始位置和結(jié)束位置）或者一個或者不傳值，當(dāng)沒傳入值時，返回的數(shù)組的值原始數(shù)組值，如果只傳入一個參數(shù)，則返回截取的原始數(shù)組從參數(shù)代表的起始位置到原始數(shù)組的結(jié)束位置（包含結(jié)束位置），如果傳入兩個參數(shù)，則返回截取的原始數(shù)組從參數(shù)代表的起始位置到參數(shù)代表結(jié)束位置（不包含結(jié)束位置）。

2.splice可以傳入三個參數(shù)插入位置（刪除起始位置）和刪除數(shù)量和插入的值。

3.every和some的另外釋意和使用可以參考TypeScript循環(huán)一章

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' ]