How To Use Associative Array in TypeScript

Associative Array in TypeScript

 

An array is an object that contains one or more items called elements. Each of these elements can be a primitive data type or an object. For instance, you can store numbers, strings, and Date objects in the same array.

 

Associative arrays provide another way to store information. An associative array is an array that uses string as the indexes. You can create a mixed array with numeric and string indexes within a single array. if you mix numeric and string indexes in an array then the length will indicate only the number of elements with numeric indexes. Associative arrays are very similar to numeric arrays in terms of functionality but they are different in terms of their index. In an associative array, each ID key is associated with a value.

 

Example

The following example describes how to use an associative array in TypeScript. In this code, we enter the employee name of the information you want. If the specified employee name is present in the array then it returns the employee information and if the employee name is not present in the array list then it shows the NO Information message. It is very simple and works as follows.

 

Step 1
Open Visual Studio 2012 and click on "File" menu -> "New" -> "Project". A window will then be opened. Specify a name for the application, like "Associative_Array", then click on the Ok button.

 

Step 2
After Step 1 your project has been created. The Solution Explorer, which is at the right side of Visual Studio, contains the js file, ts file, CSS file, and HTML files.

 

 

Step 3

 

Associative.ts

class Associative_array
{
 EmpInfo()
 {
  var information = new Array()
  information["Dinesh"] = "Dinesh Beniwal is Administrator of C# corner. His expert arears are ASP.NET, ADO.NET, HTML and PHP.";
  information["Mahesh"] = "Mahesh Chand is founder of C# Corner. Mahesh has been
  awarded prestigious Microsoft MVP Award
  for 7 consecutive years
  for his
  contributions to the developer community.
  ";
  information["Manish"] = "Manish is Very much interested in Microsoft & LifeStyle
  Accessory Designand working with Microsoft technologies.His expert areas are
  ASP.NET, ADO.NET, C#.NET and WPF.
  ";
  var info = prompt("Whose Employee information do you want?", "");
  if ((info == "Dinesh") || (info == "Mahesh") || (info == "Manish"))
  {
   var y = document.createElement("y");
   y.innerText = information[info];
   document.body.appendChild(y);
  } else
   alert("No Information");
 }
}
window.onload = () =>
 {
  var greeter = new Associative_array();
  greeter.EmpInfo();
 };

Demo.html

< !DOCTYPEhtml >
 <
 htmllang = "en"
xmlns = "http://www.w3.org/1999/xhtml" >
 <
 head >
 <
 metacharset = "utf-8" / >
 <
 title > Associative array < /title>
 <
 linkrel = "stylesheet"
href = "app.css"
type = "text/css" / >
 <
 scriptsrc = "app.js" > < /script>
 <
 /head>
 <
 body >
 <
 h2 > Associative Array in TypeScript < /h2>
 <
 h3style = "color:#8a2323" > Employee Information < /h3>
 <
 divid = "content" / >
 <
 /body>
 <
 /html>

app.js

var Associative_array = (function() {
 function Associative_array() {}
 Associative_array.prototype.EmpInfo = function() {
  var information = new Array();
  information["Dinesh"] = "Dinesh Beniwal is Administrator of C# corner. His expert arears are ASP.NET, ADO.NET, HTML and PHP.";
  information["Mahesh"] = "Mahesh Chand is founder of C# Corner. Mahesh has been awarded prestigious Microsoft MVP Award for 7 consecutive years for his contributions to the developer community.";
  information["Manish"] = "Manish is Very much interested in Microsoft & LifeStyle Accessory Designand working with Microsoft technologies. His expert areas are ASP.NET, ADO.NET, C# .NET and WPF.";
  var info = prompt("Whose Employee information do you want?", "");
  if ((info == "Dinesh") || (info == "Mahesh") || (info == "Manish")) {
   var y = document.createElement("y");
   y.innerText = information[info];
   document.body.appendChild(y);
  } else {
   alert("No Information");
  }
 };
 return Associative_array;
})();
window.onload = function() {
 var greeter = new Associative_array();
 greeter.EmpInfo();
};

Output 1

Enter the employee name for the information and then click on ok

 

 

 

Output 2

 

 

 

Output 3

If the specified name is not present in the array then:

 

 

 

 This is message displayed: