How to push an element to the last of an array in TypeScript?


In TypeScript, an array is a data type that represents a collection of elements. Each element in the array has a specific index, or position, in the array, and you can access or modify the elements in the array using their index. In TypeScript, an array can contain elements of the same or different data types.

To push an element to the end of an array in TypeScript, you can use the push() method. This method adds the element to the end of the array and returns the new length of the array.

Syntax

Users can follow the syntax below to push the element at the last of the array using the push() method.

let numbers: Array<number> = [10, 40, 32];
numbers.push(90);

Parameters

The Array.push() method contains single or multiple elements as a parameter.

  • Element − It is a single element or comma-separated multiple elements to insert at the end of the array.

Example 1

In the example below, we have created the array of numbers. Also, we have initialized the array with some numbers.

We have inserted the 34 at the last of the array using the push() method of the Array library. Also, we inserted the 904 after the 34. In the output, we can see that 904 is the last element and 34 is the second last element.

//  Creating the array of numbers and initialize with some values.
let numbers: Array<number> = [134, 45, 22];
// Push 34 to the end of the array.
numbers.push(34);
console.log("numbers array after inserting 34 at the end is " + numbers);
// Push 904 to the end of the array.
numbers.push(904);
console.log("numbers array after inserting 904 at the end is " + numbers);

On compiling, it will generate the following JavaScript code −

//  Creating the array of numbers and initialize with some values.
var numbers = [134, 45, 22];
// Push 34 to the end of the array.
numbers.push(34);
console.log("numbers array after inserting 34 at the end is " + numbers);
// Push 904 to the end of the array.
numbers.push(904);
console.log("numbers array after inserting 904 at the end is " + numbers);

Output

The above code will produce the following output −

numbers array after inserting 34 at the end is 134,45,22,34
numbers array after inserting 904 at the end is 134,45,22,34,904

Example 2

In the example below, ‘strings’ is the array of strings that contains some string values. Here, we have passed the comma-separated multiple strings as a parameter of the push method to insert the multiple elements in the array at once. The push() method inserts the elements at the end of the array in the same order as we pass strings as a parameter.

//  Creating the array of strings and initialize with some values.
let strings: Array<string> = ["Welcome", "To", "The"];
// Push multiple elements at the last of the array
strings.push("TutorialsPoint", "!", "Hello", "World!");
console.log(
   "strings array after inserting the multiple elements at the end: " + strings
);

On compiling, it will generate the following JavaScript code −

//  Creating the array of strings and initialize with some values.
var strings = ["Welcome", "To", "The"];
// Push multiple elements at the last of the array
strings.push("TutorialsPoint", "!", "Hello", "World!");
console.log("strings array after inserting the multiple elements at the end: " + strings);

Output

The above code will produce the following output −

strings array after inserting the multiple elements at the end: Welcome,To,The,TutorialsPoint,!,Hello,World!

Example 3

In the example below, we have created the Employee interface. The interface contains the declaration of variables and methods of the class. After that, we have created the emp array of type Employee interface and initialized with the single object of the Employee.

Next, we created the new_emp object of type Employee and used the push() method to insert it at the last of the emp array. We used the for-of loop to print the array objects. Users can see in the output that the emp array contains the two objects, and the new_emp object is inserted at last.

//  Create the inteface for the Employee
interface Employee {
   name: string;
   age: number;
   isPermenent: boolean;
}
//  Create the array of employee
let emp: Employee[] = [{ name: "Shubham", age: 22, is Permenent: true }];
// Create new employee object of type Employee
const new_emp: Employee = {
   name: "Jems",
   age: 30,
   isPermenent: false,
};
//  Push new employee object to emp array
emp.push(new_emp);

console.log("After inserting the new_emp at the end of the emp array is ");
//  Iterate through the emp array and print every employee object
for (let obj of emp) {
   console.log("New Employee!");
   console.log(
      "name: " +
      obj.name +
      " age: " +
      obj.age +
      " isPermenent: " +
      obj.isPermenent
   );
}

On compiling, it will generate the following JavaScript code −

//  Create the array of employee
var emp = [{ name: "Shubham", age: 22, is Permenent: true }];
// Create new employee object of type Employee
var new_emp = {
   name: "Jems",
   age: 30,
   isPermenent: false
};
//  Push new employee object to emp array
emp.push(new_emp);
console.log("After inserting the new_emp at the end of the emp array is ");
//  Iterate through the emp array and print every employee object
for (var _i = 0, emp_1 = emp; _i < emp_1.length; _i++) {
   var obj = emp_1[_i];
   console.log("New Employee!");
   console.log("name: " +
      obj.name +
      " age: " +
      obj.age +
      " isPermenent: " +
      obj.isPermenent);
}

Output

The above code will produce the following output −

After inserting the new_emp at the end of the emp array is 
New Employee!
name: Shubham age: 22 is Permenent: true
New Employee!
name: Jems age: 30 is Permenent: false

We learned to insert single or multiple elements at the end of the array. Also, we learned to insert the objects at the end of the array using the push() method in the last example.

Updated on: 19-Dec-2022

2K+ Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements