Array Object In TypeScript: Part 4

Before reading this article, please go through the following articles:

Introduction

In TypeScript, the array object makes our work easier. The TypeScript Array object is used to store multiple values in a single variable at a time. TypeScript provides many methods.
In this article, I am describing some of the TypeScript array methods.

Reverse() Method

In TypeScript, reverse() is used to reverse the order of the element in the array. The reverse() method has no parameters and returns the array with the values reversed. In the reverse() method, the last element of the array becomes the first element and the first element of the array becomes the last element.
Syntax
  1. array.reverse()
Function
  1. Reverse() {
  2. var fstarry: string[] = ['C', 'Sharp', 'Corner'];
  3. fstarry.reverse();
  4. var span = document.createElement("span");
  5. span.innerText = "Revrese Method \n After Reverse array is -> " + fstarry + "\n";
  6. document.body.appendChild(span);
  7. }

Shift() Method

In TypeScript the shift() method is used to remove the first element in the array, decrement the array length and return the removed element. If the keys are numeric then all elements will get new keys, starting from 0 and increasing by 1.
Syntax
  1. array.shift()
Function
  1. Shift() {
  2. var arrayName: string[] = ['C', 'Sharp', 'Corner', 'VB', 'Net', 'Heaven'];
  3. var index = arrayName.shift().toString();
  4. var span = document.createElement("span");
  5. span.style.color = "#7a1111";
  6. span.innerText = "Shift Method \n Shift Element is -> " + index;
  7. document.body.appendChild(span);
  8. }

Complete Program

Reverse_Shift.ts
  1. class Reverse_Shift
  2. {
  3. Reverse()
  4. {
  5. var fstarry: string[] = ['C', 'Sharp', 'Corner'];
  6. fstarry.reverse();
  7. var span = document.createElement("span");
  8. span.innerText = "Revrese Method \n After Reverse array is -> " + fstarry + "\n";
  9. document.body.appendChild(span);
  10. }
  11. Shift()
  12. {
  13. var arrayName: string[] = ['C', 'Sharp', 'Corner', 'VB', 'Net', 'Heaven'];
  14. var index = arrayName.shift().toString();
  15. var span = document.createElement("span");
  16. span.style.color = "#7a1111";
  17. span.innerText = "Shift Method \n Shift Element is -> " + index;
  18. document.body.appendChild(span);
  19. }
  20. }
  21. window.onload = () =>
  22. {
  23. var obj = new Reverse_Shift();
  24. obj.Reverse();
  25. obj.Shift();
  26. };
Reverse_Shift_MethodDemo.htm
  1. < !DOCTYPE html >
  2. <
  3. html lang = "en"
  4. xmlns = "http://www.w3.org/1999/xhtml" >
  5. <
  6. head >
  7. <
  8. meta charset = "utf-8" / >
  9. <
  10. title > TypeScript HTML App < /title>
  11. <
  12. link rel = "stylesheet"
  13. href = "app.css"
  14. type = "text/css" / >
  15. <
  16. script src = "Reverse_Shift.js" > < /script>
  17. <
  18. /head>
  19. <
  20. body >
  21. <
  22. h3 > Reverse() and Shift() Array Method In TypeScript < /h3>
  23. <
  24. /body>
  25. <
  26. /html>
Reverse_Shift.js
  1. var Reverse_Shift = (function() {
  2. function Reverse_Shift() {}
  3. Reverse_Shift.prototype.Reverse = function() {
  4. var fstarry = [
  5. 'C',
  6. 'Sharp',
  7. 'Corner'
  8. ];
  9. fstarry.reverse();
  10. var span = document.createElement("span");
  11. span.innerText = "Revrese Method \n After Reverse array is -> " + fstarry + "\n";
  12. document.body.appendChild(span);
  13. };
  14. Reverse_Shift.prototype.Shift = function() {
  15. var arrayName = [
  16. 'C',
  17. 'Sharp',
  18. 'Corner',
  19. 'VB',
  20. 'Net',
  21. 'Heaven'
  22. ];
  23. var index = arrayName.shift().toString();
  24. var span = document.createElement("span");
  25. span.style.color = "#7a1111";
  26. span.innerText = "Shift Method \n Shift Element is -> " + index;
  27. document.body.appendChild(span);
  28. };
  29. return Reverse_Shift;
  30. })();
  31. window.onload = function() {
  32. var obj = new Reverse_Shift();
  33. obj.Reverse();
  34. obj.Shift();
  35. };
  36. //@ sourceMappingURL=Reverse_Shift.js.map
Output
final-result.gif