JavaScript Cheatsheet

1. Internal and External Script

Script Description Example
Use the <script> tag and the type attribute with <script type="text/
Internal JavaScript code directly inside the HTML file. javascript"> // Code
</script>

Use the <script> tag with the src attribute to link <script src="script.js">
External
to an external JavaScript file. </script>

2. Variables
Variables Description Example
Defines a function-scoped variable that can be changed
Var var x = 10;
or redeclared.

Declares a block-scoped variable that can be changed

let let y = 20;
but not redeclared.

const Defines an immutable block-scoped variable. const z = 30;

3. JavaScript Comments
Comment Description Example
let x = 5; // This is another
Single Line Use two forward slashes //.
single line comment.

let y = 10; /* This is multiline

Use /* to start the comment
Multiline comment, but written in a single
and */ to end it.
line */.

4. Data Types
Data Type Description Example
Number Stores numeric values. let age = 30;

String Stores text enclosed in quotes. let name = “Alice”;

Boolean Stores true or false values. let isActive = true;

Object Stores key-value pairs. let user = {name: “Bob”};

Null Represents intentional absence. let result = null;

Undefined Declares an undefined variable. let data;

JavaScript Cheatsheet

5. Variables Scope
Scope Description Example
Local Variables are accessible only within the function. function test() { let x = 10; }

Global Variables are accessible anywhere in the code. let y = 20;

6. Conditional Statement
Statement Description Example
if (condition) {
Executes code block if the condition
If // Code
is true.
}

if (condition) {
// Code
Executes one block if true, and
If-else } else {
another if false.
// Code
}

switch(expression) {
case x:
Executes code blocks based on a
Switch // Code;
matching case.
break;
}

7. Loops
Type Description Example
for (let i = 0; i < 5; i++){
For Repeats code for a set number of times. // Code
}

let i = 0; while (i < 5){

Repeats code as long as the condition
While // Code
is true.
}

Executes code at least once, then do{

Do-while //code
repeats while a condition is true.
} while(i < 5);

8. Strings
Type Description Example Output
Replaces a specified pattern let text = "Hello World";
Replace() with another pattern in a console.log(text.replace( Hello Educative
string. "World", "Educative"));
JavaScript Cheatsheet
Replaces a specified pattern let text = "Hello World";
Replace() with another pattern in a console.log(text.replace( Hello Educative
string. "World", "Educative"));

Extracts parts of a string, let text = "Hello World";

substr() starting at a specified console.log(text.substr(6, World
position and length. 5));

Extracts a part of a string let text = "Hello World";

and returns it as a new console.log(text.slice(6,
slice() World
string—without modifying 11));
the original string.

let text = "Hello World,

Returns the position of the
lastIndex Welcome to the World";
last occurrence of a specified 21
Of( ) console.log(text.
pattern in a string.
lastIndexOf("World"));

let text1 = "Hello";

let text2 = "World";
concat() Joins two or more strings. Hello World
console.log(text1.
concat(" ", text2));

Searches a string for a match [ 'World', index:

let text = "Hello World";
6, input:'Hello
match() against a regular expression console.log(text.match
World', groups:
and returns the matches. (/World/));
undefined ]

Returns the character at a let text = "Hello World";

charAt() specified index (position) in console.log(text.charAt(1) e
a string. );

let text = new String

Returns the primitive ("Hello World");
valueOf() Hello World
pattern of a string object. console.log(text.valueOf());

let text = "Hello

Splits a string into an World"; ["Hello", "World"]
split()
array of substrings. console.log(text.split
(" "));

Converts a string to let text = "Hello World";

toUpper HELLO WORLD
console.log
Case() uppercase letters. (text.toUpperCase());

Converts a string to let text = "Hello World";

toLower hello world
console.log
Case() lowercase letters. (text.toLowerCase());

9. Arrays
Type Description Example Output
push() Adds new items to the end let fruits = ["Apple", ["Apple", "Banana"
of an array. "Banana"]; , "Orange"]
fruits.push("Orange");
console.log(fruits);
JavaScript Cheatsheet
let fruits = ["Apple",
Removes the last element
"Banana", "Orange"];
pop() of an array, and returns ["Apple", "Banana"]
fruits.pop();
that element. console.log(fruits);

let fruits = ["Apple",

"Banana"];
let moreFruits =
Merges two or more arrays ["Apple", "Banana",
concat() ["Orange", "Mango"];
into a new array. "Orange","Mango"]
let allFruits = fruits.
concat(moreFruits);
console.log(allFruits);

let fruits = ["Apple",

Removes the first element
"Banana", "Orange"];
shift() of an array, and returns ["Banana", "Orange"]
fruits.shift();
that element. console.log(fruits);

let fruits = ["Apple",

Reverses the order of the "Banana", "Orange"]; ["Orange", "Banana",
reverse()
elements in an array. fruits.reverse(); “Apple”]
console.log(fruits);

slice() let fruits = ["Apple",

Returns a shallow copy of a "Banana", "Orange"];
portion of an array into a let citrus = ["Banana", "Orange"]
new array object. fruits.slice(1, 3);
console.log(citrus);

Adds/removes items let fruits = ["Apple",

"Banana", "Orange"]; ["Apple", "Lemon",
to/from an array, and
splice() fruits.splice(1, 1, "Kiwi", "Orange"]
returns the removed
"Lemon", "Kiwi");
item(s). console.log(fruits);

let fruits = ["Apple",

Converts an array to a
"Banana", "Orange"];
toString() string of (comma- Apple,Banana,Orange
console.log
separated) array values. (fruits.toString());

Returns the array itself let fruits = ["Apple",

"Banana", "Orange"]; ["Apple", "Banana",
valueOf() (similar to the toString()
console.log "Orange"]
method for arrays).
(fruits.valueOf());

let fruits = ["Apple",

Returns the first index at
"Banana", "Orange"];
the position where a given
indexOf() console.log 1
element can be found in (fruits.indexOf
the array. ("Banana"));

let fruits = ["Apple",

Returns the last index a "Banana", "Orange",
lastIndex the position where a given "Banana"];
3
Of() element can be found in console.log
the array. (fruits.lastIndexOf
("Banana"));

let fruits = ["Apple",

Joins all elements of an "Banana", "Orange"]; Apple - Banana -
join()
array into a string. console.log Orange
(fruits.join(" - "));
JavaScript Cheatsheet
Sorts the elements of an let fruits = ["Banana",
array in place and returns "Apple", "Orange"]; ["Apple", "Banana",
sort()
the sorted array. fruits.sort(); "Orange"]
console.log(fruits);

10. Operators
Type Operator Example Output
AND (&) 5&1 1

OR (|) 5|1 5

XOR (^) 5^1 4

Bitwise
NOT (~) ~5 r -6

Left shift (<<) 5 << 1 10

Right shift (>>) 5 >> 1 2

Assignment (=) x=5

Add and assign (+=) x += 5 (same as x = x + 5)

Assignment Subtract and assign (-=) x -= 5 (same as x = x - 5)

Multiply and assign (*=) x *= 5 (same as x = x * 5)

Divide and assign (/=) x /= 5 (same as x = x / 5)

Equal (==) 5 == 1 true

Strict Equal (===) 5 === ‘5’ false

Comparison Not Equal (!=) 5 != 5 false

Greater Than (>) 5>3 true

Less Than (<) 5<3 false

Addition (+) 5+3 8

Subtraction (-) 5-3 2

Multiplication (*) 5*3 15

Arithmetic Division (/) 5/3 1.6667

Modulus (%) 5%3 2

Increment (++) ++x increases x by 1

Decrement (--) --x decreases x by 1

AND (&&) true && false false

Logical OR (||) true || false true

NOT (!) !true false

JavaScript Cheatsheet

11. Regular Expressions

Expression Description Example Output
[0-9] It matches any digit from 0 to 9. /[0-9]/.test(’5’) true

Matches any character within the

[abc] /[abc]/.test('b') true
brackets (a, b, or c).

(x|y) It matches either x or y. /(x|y)/.test('y') true

12. Math Functions

Function Description Example Output
valueOf() Returns the primitive value of a var num = 123;
123
specified object. num.valueOf();

toString() Converts a number or object to var num = 123;

123
a string. num.toString();

toPrecision Formats a number to a specified var num = 123.456;

123.5
() length. num.toPrecision(4);

toExponential Converts a number to exponential var num = 123.456;

1.23e+2
() notation. num.toPrecision(2);

toFixed() Formats a number using fixed- var num = 123.456;

123.46
point notation. num.toFixed(2);

13. Data Transformation

Function Description Example Output
Creates a new array by applying var arr = [1, 2, 3];
map() a function to each element arr.map(x => x * 2); [2, 4, 6]
of the original array.

var arr = [1, 2, 3, 4];

Creates a new array with elements
filter() arr.filter(x => x % 2 [2, 4]
that pass a specified test.
=== 0);

Reduces an array to a single value var arr = [1, 2, 3, 4];

reduce() by applying a function to each arr.reduce((sum, x) => 10
element. sum + x, 0);

14. Date
Function Description Example Output
Returns the minutes (0–59) of a var date = new Date();
getMinutes() date.getMinutes(); (e.g., 45)
specified date and time.
JavaScript Cheatsheet
Returns the day of the month var date = new Date();
getDate() date.getDate(); (e.g., 28)
(1–31) for a specified date.

Returns the number of milli- var date = new Date();

(e.g.,
getTime() seconds from a given date, date.getTime();
1625914871267)
e.g., January 1, 1970.

Returns the full year (4 digits) of var date = new Date();

getFullYear() 2024
a specified date. date.getFullYear();

Returns the day of the week var date = new Date(); (e.g., 2 for
getDay() Tuesday)
(0–6) for a specified date. date.getDay();

Parses a date string and returns

Date.parse
parse() the number of milliseconds (e.g., -14182920000
("July 20, 1969");
January 1, 1970).

Parses a date string and returns

var date = new Date(); (date set to
setDate() the number of milliseconds
date.setDate(15); the 15th)
(e.g., January 1, 1970).

var date = new Date(); (date set to

Sets a date and time by adding
setTime() date.setTime corresponding
milliseconds (e.g., January 1, 1970). (1625914871267); date and time)

15. Document Object Model

Function Description Example
var parent = document.
Adds a new child node to the getElementById("parent");
appendChild()
end of a parent node. var child = document.createElement("div");
parent.appendChild(child);

var original = document.

getElementById("original");
cloneNode() Creates a copy of a node.
var clone = original.cloneNode(true);
document.body.appendChild(clone);

var element = document.

hasAttributes Returns true if the node has
getElementById("element");
() any attributes. var hasAttr = element.hasAttributes();

var parent = document.

getElementById("parent");
Removes a child node from
removeChild() var child = document.
a parent node.
getElementById("child");
parent.removeChild(child);

var element = document.

Returns the value of a
getElementById("element");
getAttribute() specified attribute on an
var attrValue = element.
element. getAttribute("class");

Returns a live HTML

getElements var elements = document.
collection of elements with
ByTagName() getElementsByTagName("p");
the specified tag name.
JavaScript Cheatsheet
isEqualNode() Checks if the two nodes are var node1 = document.
equal. getElementById("node1");
var node2 = document.
getElementById("node2");
var isEqual = node1.isEqualNode(node2);

16. Events
Model Description Example
Triggers a function when an <button onclick="alert('Button
onclick()
element is clicked. clicked!')">Click me</button>

Triggers a function when a <input type="text" onkeyup="

onkeyup()
key is released. console.log('Key released!')" />

Triggers a function when the <div onmouseover="console.log

onmouseover ('Mouse over!')">Hover over me
mouse pointer is over an
()
element. </div>

Triggers a function when the <div onmouseout="console.log

onmouseout() mouse pointer leaves an ('Mouse out!')">Move out of me
element. </div>

<input type="text" onchange=

Triggers a function when the
onchange() "console.log('Value changed!')"
value of an element changes.
/>

Triggers a function when the <input type="text" onchange=

onload() page or an image is fully "console.log('Value changed!')"
loaded. />

<input type="text" onfocus=

Triggers a function when an
onfocus() "console.log('Input focused!')"
element gets focus.
/>

<input type="text" onblur=

Triggers a function when an
onblur() "console.log('Input lost focus!'
element loses focus.
)" />

<form onsubmit="console.log
('Form submitted!')">
Triggers a function when a
onsubmit() <input type="submit" value=
form is submitted.
"Submit">
</form>

<div draggable="true"
Triggers a function when an ondrag="console.log
ondrag() ('Element dragged!')
element is dragged.
">Drag me</div>

Triggers a function when the <input type="text" oninput=

oninput() value of an element changes "console.log('Input value
while typing. changed!')" />
JavaScript Cheatsheet

17. Error
Model Description Example
try {
Defines a block of code to
Try // Code to try
test for errors.
}

catch (error) {
Defines a block of code to
catch // Code to handle error
handle any errors
}

throw new Error

throw Creates a custom error.
('This is an error!');

finally {
Executes code after try
// Code to execute after try
finally and catch, regardless of the
and catch
result.
}