jQuery Tutorial

jQuery Data Types

What are the data types in jQuery?

When using jQuery framework, we can also use JavaScript capabilities (we can use all the functions and other features available in JavaScript.).
String, Number and boolean data types are available in jQuery.

String

String is immutable object in JavaScript that can be none, one or many sequence of characters. either single quote (') or double quote (") can be used to represent the string value.

var str = "welcome to jQuery!";
var str = 'welcome to jQuery!';
var str = "welcome to 'jQuery'!";
var str = 'welcome to "jQuery"!';

jQuery to display string variable:

<html>
   <head>
      <title>The jQuery Example</title>
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>		
      <script type = "text/javascript">
         $(document).ready(function(){
	    var str = "welcome to 'jQuery'!";
            document.write(str);
         });
      </script>		
   </head>	
   <body></body>
</html>

Output:

Numbers

Numbers are immutable double-precision 64-bit values.

var intVal = 24;
var doubleVal = 34.56;
var floatVal = 0.45;

jQuery to display integer variable:

<html>
   <head>
      <title>The jQuery Example</title>
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>		
      <script type = "text/javascript">
         $(document).ready(function(){
	    var intVal = 160;
            document.write("integer value: " + intVal.toString());
         });
      </script>		
   </head>	
   <body></body>
</html>

Output:

Boolean

Boolean data type can hold value true or false. number 0 and empty string default value is false.

var boolVal = false;
var boolVal = true;

jQuery with boolean condition:

<html>
   <head>
      <title>The jQuery Example</title>
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>		
      <script type = "text/javascript">
         $(document).ready(function(){
	    var boolVal = true;
             if(boolVal) {
               document.write("Condition is true!");
             } else {
	       document.write("Condition is false!");
             }
         });
      </script>		
   </head>	
   <body></body>
</html>

Output:

Objects

We can create object in jquery using json format as below,

var student = {
   name: "student1",
   mark: 90
};

Creating object in jQuery:

<html>
   <head>
      <title>The jQuery Example</title>
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>		
      <script type = "text/javascript">
         $(document).ready(function(){
		var student = {
		   name: "student1",
		   mark: 90
		};
               //Getting object properties
	       document.write("name: " + student.name + "
mark: " + student.mark);
               //Setting object properties
               student.name = "student2";
               student.mark = 87;
               document.write("

name: " + student.name + "
mark: " + student.mark);
         });
      </script>		
   </head>	
   <body></body>
</html>

Output:

Arrays

Array is a collection of elements and each elements in the array can be different data types.

var arr = [];
var arr1 = ["one", "two", "three"];

How to create array in jQuery?

<html>
   <head>
      <title>The jQuery Example</title>
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>		
      <script type = "text/javascript">
         $(document).ready(function(){
		var arr = ["one", "two", "three"];
                arr.push("four");
                arr.push(5);
		for(var i=0; i");
                }
         });
      </script>		
   </head>	
   <body></body>
</html>

Output: