Updated April 6, 2023
Introduction to TypeScript add to array.
The following article provides an outline for the TypeScript add to array. An array is a data type that is possible to store different values of different data types in a sequential manner. Like other programming languages, TypeScript also supports arrays. There are several methods that support arrays. Here, we will see more on the method push() that add elements to the array. It add the given items in the array end and returns the array length of updated array.
Syntax:
Below is the syntax of TypeScript array push() method.
arr.push(el1, ..., elN);
Here, arr is the array that has to add elements into.
Parameter:
- el1, …, elN are the elements that have to be added to the array end.
A new array with updated items and length will be returned.
How to Add an Item to the array in TypeScript?
Arrays consist of elements of different data types such as numbers, objects, strings, characters etc. To add elements to the array, first, we have to create an array. It can be declared as well as initialized in separate.
We will see the two ways in which arrays are declared.
The first one is using square brackets which are like declaring the arrays in the language Javascript.
let color: string[] = [‘Red’, ‘Black’, ‘White’, ‘Yellow’];
The second one is using Array<elementType>, which is a generic array type.
let color: Array<string> = [‘Red’, ‘Black’, ‘White’, ‘Yellow’];
In both the cases, same output will be obtained.
Similarly, elements of other data types can also be created.
let num: Array<number>;
num = [ 232 , 334 , 7100 , 1624 , 744 ] ;
Now, the elements can be accessed using the element index. That is, arr[i]. Normally, index of an array starts from the position zero and first element index is zero, second element index is one etc.
Example:
Code:
let color: string[] = ['Red', 'Black', 'White', 'Yellow'];
color [0]; // Red will be returned
color [1]; // Black will be returned
color [2]; // White will be returned
color [3]; // Yellow will be returned
Once all these are done, our task is to add elements to the existing array. For that, we will use the push() method.
Example:
Code:
let color: string[] = ['Red', 'Black', 'White', 'Yellow'];
color [0]; // Red will be returned
color [1]; // Black will be returned
color [2]; // White will be returned
color [3]; // Yellow will be returned
var newcolor = color.push(‘Blue’);
So the new array will contain five elements such as ‘Red’, ‘Black’, ‘White’, ‘Yellow’, and ‘Blue’.
Examples of TypeScript add to array.
Given below are the examples of TypeScript add to the array:
Example #1
TypeScript program that creates an array of string elements and add elements to it.
Code:
//create an array of strings
var color: Array<string> = ['Red', 'White', 'Blue'];
//print the three colors declared in the array
console.log(color) ;
//add the new color Green
color.push('Green') ;
//print the updated array with the element Green at the end of the array
console.log(color) ;
Output:
First, we will create an array using square brackets which are like declaring the arrays in the language JavaScript. The created array has three elements such as Red, White and Blue. Then, print all the elements. Once all these are done, add the element Green to the existing array. For that, we will use the push() method. So the new array will contain five elements such as Red, White, Blue and Green. On executing the code, we can see the updated array.
Example #2
TypeScript program that creates an array of six numbers and add elements to it using for loop.
Code:
//create an array of numbers
var num = [ 32 , 55 , 66 , 63 , 78 , 79 ] ;
//initialize the values i and j as zero
var i , j = 0 ;
//add elements to the created using using for loop
for(j=0 ; j < 6 ; j++ )
{
var a = num[j];
var z = a * j;
i = num.push(z);
}
//print the updated array with the output obtained after multiplication in loop
console.log( num );
Output:
In this program also, we will create an array using square brackets. The created array has six elements such as 32, 55, 66, 63, 78 and 79. Then, initialize two values, i and j, as zero, which will be used later. Using a for loop, multiply the elements and add the elements using the push() method. So the new array will contain 12 elements such as 32, 55, 66, 63, 78, 79, 0, 55, 132, 189, 312, and 395. On executing the code, we can see the updated array.
Example #3
TypeScript program that creates an array of strings and an array of numbers and add elements to it.
Code:
//create an array
var color: Array<string> = ['Red', 'White', 'Blue'];
//print the colors
console.log(color);
//add new color
color.push('Green');
//print the updated array
console.log(color);
//create an array
var num = [ 32 , 55 , 66 , 63 , 78 , 79 ] ;
//initialize the values i and j as zero
var i , j = 0 ;
//print the numbers
console.log(num) ;
//add elements to it
for( j=0 ; j < 6 ; j++ )
{
var a = num[j] ;
var z = a * j ;
i = num.push(z);
}
//print the updated array
console.log( num ) ;
Output:
In this program, we are combining first two programs and printing the output. So, here you can see that the codes are just merged and they both are independent and result can be obtained without any addition of code. This is one of the specialities of TypeScript where you don’t have to add anything extra for getting output. On executing the code, we can see the updated array.
Conclusion
In Typescript, push() is a method that add elements to the array end and returns the array length of updated array.
Recommended Articles
We hope that this EDUCBA information on “TypeScript add to array” was beneficial to you. You can view EDUCBA’s recommended articles for more information.