JavaScript is a dynamically typed language, meaning variables can hold values of different data types. Here are the main data types in JavaScript:
1. Primitive Data Types:
- Number
- String
- Boolean
- Null
- Undefined
- Symbol (added in ECMAScript 6)
2. Composite Data Types:
- Object
- Function
1. Number
The number data type represents numeric values. It includes integers, floating-point numbers, and special numeric values like Infinity and NaN (Not a Number).
Example:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Number Data Type Example</title>
</head>
<body>
<script>
let num = 42; // Integer
let floatNum = 3.14; // Floating-point number
let infinityValue = Infinity; // Represents infinity
let notANumber = NaN; // Represents not a number
</script>
</body>
</html>
2. String
The string data type represents textual data enclosed in single (') or double (") quotes.
Example:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>String Data Type Example</title>
</head>
<body>
<script>
let str1 = 'Hello, World!'; // Single quotes
let str2 = "JavaScript is awesome!"; // Double quotes
</script>
</body>
</html>
3. Boolean
The boolean data type represents a logical entity and can have two values: true or false.
Example:
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Boolean Data Type Example</title>
</head>
<body>
<script>
let isCodingFun = true; // True value
let isPlayingGames = false; // False value
</script>
</body>
</html>
4. Null and Undefined
- null: Represents the intentional absence of any object value.
- undefined: Represents a variable that has been declared but not assigned a value.
Example:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Null and Undefined Data Types Example</title>
</head>
<body>
<script>
let nullValue = null; // Represents null
let undefinedValue; // Represents undefined
</script>
</body>
</html>
5. Symbol (added in ECMAScript 6) Symbols are unique and immutable data types introduced in ECMAScript 6.
Example:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Symbol Data Type Example</title>
</head>
<body>
<script>
let sym1 = Symbol('key1'); // Creating a symbol with description
let sym2 = Symbol('key2'); // Creating another symbol
</script>
</body>
</html>
6. Object Objects are complex data types that represent a collection of properties and methods. They are used to store various data structures.
Example:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Object Data Type Example</title>
</head>
<body>
<script>
let person = {
firstName: 'John',
lastName: 'Doe',
age: 30,
email: 'john.doe@example.com'
};
</script>
</body>
</html>
7. Function
Functions are special objects used to define reusable blocks of code.
Example:
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Function Data Type Example</title>
</head>
<body>
<script>
function greet(name) {
return 'Hello, ' + name + '!';
}
</script>
</body>
</html>
Practice Excercise Practice now