Like all other programming languages javascript also have the types which we should be aware of while programming.In this article I will discuss all the data types in JavaScript like Boolean types, string types, arrays, reference types and functions with examples which will make it easier to understand.
JavaScript has a number of primitive types which are described below
Data Types in Javascript
- Value Types
- boolean
- string
- number
- Reference Types
- object
- Delegate types
- function
- Special Types
- undefined
- null
At any point while programming we can get to know about the type of the variable using the typeof operator
<script>
alert(typeof "test"); //string
alert(typeof 12); //number
</script>Special Types in JavaScript
Along with other primitive types we have special types in Java Script which are “null” and “undefined”.
Null is as same as the null reference of C#. null means that the variable has not been instantiated and is not initialized in memory.But undefined is something different. Undefined means that the variable has never been defined before using it.
Below is the code snippet for both of the examples.
<script>
var a = null;
var a = c; // undefined error
</script>Not A Number (NaN)
There are cases where one of the operand is number and the other operand is not a number. We can get the type for the output for this operation using isNaN as shown in the below code snippet.
<script>
var alert1 = 10//"number";
alert(isNaN(alert1)); //true
</script>As shown in the above code isNaN is a function which is used to find if the variable provided is a number or not.
Boolean Types in JavaScript
Boolean types in JavaScript are only the true and false and not any number. But there are some cases which are treated as true or false and are shown in the below code snippet.
<script>
if(true){} //true
if(false){} //false
if("helloworld"){} //true
if(""){} //false
if(20){} //true
if(0){} //false
if(10/0){} //false (NaN)
var myVar = null;
if(myVar){} //false
if(c){} //false (undefined)
</script>As shown in the above code snippet there are many ways in which we can determine true and false like an empty string returns false where non-empty string is true, number greater then 0 is true and 0 is always false. Nan is false and many more cases.
String types in Javascript
Just like C#, string types are immutable in JavaScript. But we can enclose strings in JavaScript in single quotes as well as double quotes as shown in the below code snippet.
<script>
var str1 = "string1";
var str2 = 'string2';
</script>Unlike C# these two forms of representing string is same where in C# single quotes represent characters. This notion of representing strings in javascript helps us to embed single quotes when string is enclosed in double quotes and vice versa.
Like C# we can use array accessor to get the individual element within the string. In the below code snippet I get the second element of the string as this is also 0 based indexer.
Further I can use the length property of the string to get the length of the string. But here we should be aware of one thing that length usually represent the length of bytes in a string not just the actual characters.
var newstring = "test1" + 'test2';
alert(newstring[1]); // e
alert(newstring.length);Reference Types in JavaScript
Like C# we have reference types in javascript. In C# all the reference types are derived from the object class. In javascript all the objects that we will be dealing with are typeof object.
The two objects which we are going to deal with in javascript are object and arrays. Note that the data type for both of these objects is going to return typeof object.
<script>
var object = new Object();
var array = new Array();
alert(typeof object);
alert(typeof array);
</script>Arrays can hold a collection of value type as well as reference type.
We can create objects in javascript as shown in the below code.
var person = {
firstname: "Vikram",
"last name": "Chaudhary"
};Here I have created an object person which contains two properties named firstname and “last name”. Objects in javascript contains the properties in form of name and value pair. One more thing to notice here is that we can have spaces or any other reserved characters but these should be enclosed in double quotes.
We can also have objects contained by other object as shown in the below code. Here I have person object which is enclosing one more object named address apart from other name value pairs
<script>
var person = {
firstname: "Vikram",
lastname: "Chaudhary",
address : { "address line1": "test",
"address line2": "test2"
}
};
</script>Creating an array in javascript
An array can be created in javascript as shown in the following code
<script>
var array = ["vikram", "chaudhary"];
var arrayCol = [{ firstname: "Vikram",
lastname: "Chaudhary",
address : { "address line1": "test",
"address line2": "test2"
}
}];
</script>Arrays in javascript are untyped collection unlike C# where we can work with strongly types collections. In the below code snippet I have displayed some of the important functions of array which we can use while working with them.
<script>
var array = [];
alert(array.length); // 0
array.push("test"); // add to end
alert(array.length); //1
var element = array.pop(); //removes from end
array.shift(); //removes from beginning
array.unshift({"test2"}); //adds to beginning
var index = array.indexOf("test2"); //position in array
var lastindexOf = array.lastIndexOf("test2");
</script>Functions in JavaScript
Functions in Javascript are again type of data types in javascript. We can think of functions as Func<> type of C# where we assign come operation to a variable to performed later on.
Below is the code snippet for a function foo in javascript with two arguments
<script>
var foo= function(arg1, arg2){
alert(arg1);
alert(arg2);
};
foo(1, 2);
</script>Functions can also be the part of the object as shown in the below code snippet.
<script>
var person ={
name: "vikram",
walk : function(direction)
{
alert(direction);
}
};
person.walk("right");
</script>Conclusion
In this article I have discussed about the basic building blocks of javascript which can help us while developing application.