This article provides a succinct and comprehensive cheat sheet about variables and data types in modern JavaScript. You can bookmark this page for a quick and convenient lookup later.
Variables
Variables in modern JavaScript can be declared using the var, let, or const keywords. The var keyword has some scoping issues and is not recommended, whereas let and const are block-scoped.
| Keyword | Description |
|---|---|
| var | Declares a variable with function or global scope. Not recommended. |
| let | Declares a block-scoped variable that can be reassigned. |
| const | Declares a block-scoped variable that cannot be reassigned. |
Example:
var myVar = 42;
let myLet = "Sling Academy";
const myConst = [1, 2, 3];Data Types
JavaScript has several built-in data types, including primitive types and complex types.
Primitive Types
Primitive types are immutable and are passed by value.
| Type | Description | Examples |
|---|---|---|
| string | A sequence of characters | “Hello, world!”, ‘JavaScript’ |
| number | A numerical value, including integers and floats | 42, 3.14, NaN, Infinity |
| boolean | A value that is either true or false | true, false |
| null | A value that represents the absence of a value | null |
| undefined | A value that represents a variable that has not been assigned a value | undefined |
| symbol | A primitive data type that represents a unique identifier | Symbol(“mySymbol”) |
Complex Types
Complex types are mutable and are passed by reference.
| Type | Description | Examples |
|---|---|---|
| object | A collection of key-value pairs also called properties | {name: “Foo”, age: 88} |
| array | An ordered list of values is enclosed in square brackets | [1, 2, 3], [‘a’, ‘b’, ‘c’] |
| function | A reusable block of code that performs a specific task | function add(a, b) { return a + b; } |
| RegExp | An object that describes a pattern of characters | /[a-z]/, /hello/g |
| Date | An object that represents a date and time | new Date(), new Date(2021, 9, 10) |
| Map | An object that stores key-value pairs | new Map([[“key1”, “value1”], [“key2”, “value2”]]) |
| Set | An object that stores unique values | new Set([1, 2, 3]) |
| Error | An object that represents an error | new Error(“Something went wrong”) |
| Promise | An object that represents the eventual completion of an asynchronous operation | new Promise((resolve, reject) => { /* code */ }) |
Type Coercion
JavaScript also performs type coercion, which is the process of converting a value from one type to another type. This can be implicit or explicit.
Implicit Coercion
Implicit coercion occurs when JavaScript automatically converts a value from one type to another type. This can happen in certain situations, such as when using the + operator with strings and numbers.
console.log("Hello " + 42); // "Hello 42"
console.log(42 + ""); // "42"
console.log("42" - 0); // 42Explicit Coercion
Explicit coercion occurs when the developer intentionally converts a value from one type to another type using a built-in method or operator. Some common examples include parseInt(), parseFloat(), toString(), and Number().
console.log(parseInt("42")); // 42
console.log(parseFloat("3.14")); // 3.14
console.log((42).toString()); // "42"
console.log(Number("42")); // 42Variables Scope
JavaScript has function scope and block scope. A variable declared inside a function is only accessible within that function, whereas a variable declared inside a block is only accessible within that block.
Function Scope
Variables declared inside a function have function scope and are only accessible within that function.
function myFunction() {
var x = 42;
console.log(x); // 42
}
console.log(x); // ReferenceError: x is not definedBlock Scope
Variables declared inside a block have block scope and are only accessible within that block.
if (true) {
let y = "Hello";
console.log(y); // "Hello"
}
console.log(y); // ReferenceError: y is not definedFinal Words
Hope this cheat sheet is helpful to you. If you see anything that needs to be added or corrected, let me know by leaving comments.
If you need more detailed instructions and more concrete examples about JavaScript variables and data types, continue reading the articles in this series. Happy coding, and have a nice day!
