TypeScript Array (Array)
Array object is to use a separate variable names to store a list of values.
Array is very common.
If you have a set of data (for example: the name of the site), the presence of individual variables are as follows:
var site1="Google"; var site2="Runoob"; var site3="Taobao";
If there are 10, 100 in this way it becomes a very practical, then we can use an array to solve:
var sites:string[]; sites = ["Google","Runoob","Taobao"]
This looks a lot cleaner.
TypeScript array declaration syntax is as follows:
var ARRAY_NAME [: DataType]; // declare ARRAY_NAME = [val1 is, val2, VALN ..] // Initialization
Or directly in the initialization statement:
var array_name[:data type] = [val1,val2…valn]
If the type is not set when the array is declared, it will be considered to be any type, upon initialization to infer the type of the array based on the type of the first element.
Examples
Create a number of array types:
var numlist:number[] = [2,4,6,8]
The entire array structure is as follows:
The first index value is zero, we can access an array element according to an index value:
TypeScript
var sites:string[]; sites = ["Google","Runoob","Taobao"] console.log(sites[0]); console.log(sites[1]);
Compile the code above, the following JavaScript code:
JavaScript
var sites; sites = ["Google", "Runoob", "Taobao"]; console.log(sites[0]); console.log(sites[1]);
The output is:
Google
Runoob
The following examples we initialized directly in the statement:
TypeScript
var nums:number[] = [1,2,3,4] console.log(nums[0]); console.log(nums[1]); console.log(nums[2]); console.log(nums[3]);
Compile the code above, the following JavaScript code:
JavaScript
var nums = [1, 2, 3, 4]; console.log(nums[0]); console.log(nums[1]); console.log(nums[2]); console.log(nums[3]);
The output is:
1
2
3 4
Array object
We can also create arrays using the Array object.
Array object constructor accepts the following two values:
- It represents the value of the array size.
- Initializing a list of array elements using comma-separated values.
Examples
Specified array initialization Size:
TypeScript
var arr_names:number[] = new Array(4) for(var i = 0; i<arr_names.length; i++) { arr_names[i] = i * 2 console.log(arr_names[i]) }
Compile the code above, the following JavaScript code:
JavaScript
var arr_names = new Array(4); for (var i = 0; i < arr_names.length; i++) { arr_names[i] = i * 2; console.log(arr_names[i]); }
The output is:
0
2
4 6
The following examples us directly initialize the array elements:
TypeScript
var sites:string[] = new Array("Google","Runoob","Taobao","Facebook") for(var i = 0;i<sites.length;i++) { console.log(sites[i]) }
Compile the code above, the following JavaScript code:
JavaScript
var sites = new Array("Google", "Runoob", "Taobao", "Facebook"); for (var i = 0; i < sites.length; i++) { console.log(sites[i]); }
The output is:
Google Runoob Taobao Facebook
An array of deconstruction
We can also put the array element assigned to variables, as follows:
TypeScript
var ARR: Number [] = [12, 13 are] var [x, Y] = ARR // The two elements of the array assigned to the variables x and y console.log (x) console.log (y )
Compile the code above, the following JavaScript code:
JavaScript
var ARR = [12 is, 13 is]; var x = ARR [0], Y = ARR [. 1]; // The two elements of the array assigned to the variables x and y console.log (x); console.log ( y );
The output is:
12
13
Array Iteration
We can use the statement to loop output for each element of the array:
TypeScript
var j:any; var nums:number[] = [1001,1002,1003,1004] for(j in nums) { console.log(nums[j]) }
Compile the code above, the following JavaScript code:
JavaScript
var j; var nums = [1001, 1002, 1003, 1004]; for (j in nums) { console.log(nums[j]); }
The output is:
1001
1002
1003 1004
Multidimensional Arrays
An array of elements of an array may be another, thus constituting a multidimensional array (Multi-dimensional Array).
The simplest multidimensional array is a two-dimensional array, is defined as follows:
var arr_name:datatype[][]=[ [val1,val2,val3],[v1,v2,v3] ]
Examples
The definition of a two-dimensional array, each dimension of the array has three elements.
TypeScript
var multi:number[][] = [[1,2,3],[23,24,25]] console.log(multi[0][0]) console.log(multi[0][1]) console.log(multi[0][2]) console.log(multi[1][0]) console.log(multi[1][1]) console.log(multi[1][2])
Compile the code above, the following JavaScript code:
JavaScript
var multi = [[1, 2, 3], [23, 24, 25]]; console.log(multi[0][0]); console.log(multi[0][1]); console.log(multi[0][2]); console.log(multi[1][0]); console.log(multi[1][1]); console.log(multi[1][2]);
The output is:
1
2
3 23 24 25
Arrays used in the function of
Passed to the function as an argument
TypeScript
var sites:string[] = new Array("Google","Runoob","Taobao","Facebook") function disp(arr_sites:string[]) { for(var i = 0;i<arr_sites.length;i++) { console.log(arr_sites[i]) } } disp(sites);
Compile the code above, the following JavaScript code:
JavaScript
var sites = new Array("Google", "Runoob", "Taobao", "Facebook"); function disp(arr_sites) { for (var i = 0; i < arr_sites.length; i++) { console.log(arr_sites[i]); } } disp(sites);
The output is:
Google Runoob Taobao Facebook
As the return value of the function
TypeScript
function disp():string[] { return new Array("Google", "Runoob", "Taobao", "Facebook"); } var sites:string[] = disp() for(var i in sites) { console.log(sites[i]) }
Compile the code above, the following JavaScript code:
JavaScript
function disp() { return new Array("Google", "Runoob", "Taobao", "Facebook"); } var sites = disp(); for (var i in sites) { console.log(sites[i]); }
The output is:
Google Runoob Taobao Facebook
Array Methods
The following table lists some of the common array of methods:
No. | Method and Description | Examples |
---|---|---|
1. | concat() Connecting two or more arrays, and returns the result. |
var alpha = ["a", "b", "c"]; var numeric = [1, 2, 3]; var alphaNumeric = alpha.concat(numeric); console.log("alphaNumeric : " + alphaNumeric ); // a,b,c,1,2,3 |
2. | every() Whether each element of the detection element values are eligible. |
function isBigEnough(element, index, array) { return (element >= 10); } var passed = [12, 5, 8, 130, 44].every(isBigEnough); console.log("Test Value : " + passed ); // false |
3. | filter() Sensed value element, and returns an array of all elements meet the conditions. |
function isBigEnough(element, index, array) { return (element >= 10); } var passed = [12, 5, 8, 130, 44].filter(isBigEnough); console.log("Test Value : " + passed ); // 12,130,44 |
4. | forEach() Each element in the array performs a callback function. |
let num = [7, 8, 9]; num.forEach(function (value) { console.log(value); }); Compiled into JavaScript code: var num = [7, 8, 9]; num.forEach(function (value) { console.log(value); // 7 8 9 }); |
5. | indexOf() Search for elements in the array and returns its location. |
var index = [12, 5, 8, 130, 44].indexOf(8); console.log("index is : " + index ); // 2 |
6. | join() All the elements of the array into a string. |
var arr = new Array("First","Second","Third"); var str = arr.join(); console.log("str : " + str ); // First,Second,Third var str = arr.join(", "); console.log("str : " + str ); // First, Second, Third var str = arr.join(" + "); console.log("str : " + str ); // First + Second + Third |
7. | lastIndexOf() Returns a string value specified last occurrence of a specified position in a string from the forward search. |
var index = [12, 5, 8, 130, 44].lastIndexOf(8); console.log("index is : " + index ); // 2 |
8. | map() Through each array element specifies the processing function, and returns an array processed. |
var numbers = [1, 4, 9]; var roots = numbers.map(Math.sqrt); console.log("roots is : " + roots ); // 1,2,3 |
9. | pop() Delete the last element of the array and returns the removed element. |
var numbers = [1, 4, 9]; var element = numbers.pop(); console.log("element is : " + element ); // 9 var element = numbers.pop(); console.log("element is : " + element ); // 4 |
10. | push() 向数组的末尾添加一个或更多元素,并返回新的长度。 |
var numbers = new Array(1, 4, 9); var length = numbers.push(10); console.log("new numbers is : " + numbers ); // 1,4,9,10 length = numbers.push(20); console.log("new numbers is : " + numbers ); // 1,4,9,10,20 |
11. | reduce() 将数组元素计算为一个值(从左到右)。 |
var total = [0, 1, 2, 3].reduce(function(a, b){ return a + b; }); console.log("total is : " + total ); // 6 |
12. | reduceRight() 将数组元素计算为一个值(从右到左)。 |
var total = [0, 1, 2, 3].reduceRight(function(a, b){ return a + b; }); console.log("total is : " + total ); // 6 |
13. | reverse() 反转数组的元素顺序。 |
var arr = [0, 1, 2, 3].reverse(); console.log("Reversed array is : " + arr ); // 3,2,1,0 |
14. | shift() 删除并返回数组的第一个元素。 |
var arr = [10, 1, 2, 3].shift(); console.log("Shifted value is : " + arr ); // 10 |
15. | 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 |
16. | some() 检测数组元素中是否有元素符合指定条件。 |
function isBigEnough(element, index, array) { return (element >= 10); } var retval = [2, 5, 8, 1, 4].some(isBigEnough); console.log("Returned value is : " + retval ); // false var retval = [12, 5, 8, 1, 4].some(isBigEnough); console.log("Returned value is : " + retval ); // true |
17. | sort() 对数组的元素进行排序。 |
var arr = new Array("orange", "mango", "banana", "sugar"); var sorted = arr.sort(); console.log("Returned string is : " + sorted ); // banana,mango,orange,sugar |
18. | splice() 从数组中添加或删除元素。 |
var arr = ["orange", "mango", "banana", "sugar", "tea"]; var removed = arr.splice(2, 0, "water"); console.log("After adding 1: " + arr ); // orange,mango,water,banana,sugar,tea console.log("removed is: " + removed); removed = arr.splice(3, 1); console.log("After removing 1: " + arr ); // orange,mango,water,sugar,tea console.log("removed is: " + removed); // banana |
19. | toString() 把数组转换为字符串,并返回结果。 |
var arr = new Array("orange", "mango", "banana", "sugar"); var str = arr.toString(); console.log("Returned string is : " + str ); // orange,mango,banana,sugar |
20. | 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 |