The Ultimate JavaScript Cheat Sheet

3/5/2020 The Ultimate JavaScript Cheat Sheet
PC & MOBILE LIFESTYLE
The Ultimate JavaScript

Cheat Sheet
By Akshata Shanbhag / January 25, 2020 25-01-2020 / 0 minutes
Akshata Shanbha
411 articles
Akshata trained in manual testing,

Advertisement animation, and UX design before
focusing on technology and writing
This brought together two of her
Write With Con dence favorite activities — making sense
Trusted by millions of students,
of systems and simplifying jargon.
faculty, and professionals
MakeUseOf, Akshata writes about
worldwide. Try now
making the best of your Apple
devices.
Grammarly DOWNLOAD
If you want to build dynamic webpages, you’ll have to

supplement your HTML and CSS knowledge with an
understanding of JavaScript. This scripting language is
considered an essential in modern web development.
You can build all kinds of interesting interactive apps and

websites with JavaScript, but there’s much to learn on the
way. With that in mind, we have created the following
JavaScript cheat sheet for you.
The cheat sheet can serve as a quick refresher on

JavaScript elements any time you need one. It’s handy for
newbies and experts alike.
FREE DOWNLOAD: This cheat sheet is available as a

downloadable PDF from our distribution partner, TradePub.
You will have to complete a short form to access it for the
rst time only. Download The Ultimate JavaScript Cheat
Sheet.
https://www.makeuseof.com/tag/ultimate-javascript-cheat-sheet/ 1/26
The Ultimate PCJavaScript

& MOBILE Cheat
LIFESTYLE
Did You Know?
Sheet Ad
Shortc
Action
ut
JavaScript Arrays

concat( Join several arrays into one
) Sponsored
copyWi Copy array elements within the array, to and from 97% Chicken Bathed In Chlorin
thin() specified positions
The Liquid In The Chicken Bag Isn't
Water. Learn What Your Family
indexOf Return the primitive value of the specified object Needs To Do Today.
()
include Check if an array contains the specified element

s()
Latest Giveaways!
join() Combine elements of an array into a single string
and return the string Mega Modz Makes the PS4
Controller Even Better (Rev
entries( Return a key/value pair Array Iteration Object Sponsored
and Giveaway!)
) by Kris Wouk
every() Check if every element in an array passes a test TangoTab is a Cheap Androi
Tablet with a Plethora of Po
fill() Fill the elements in an array with a static value by Kris Wouk
Creality LD-002R: Best Resi

filter() Create a new array with every element in an array
Printer Yet?
that pass a test
by James Bruce
find() Return the value of the first element in an array that XP Pen Note Plus is a Magic
pass a test Paper Notepad That Scans
Everything You Write
forEach Call a function for each array element by James Bruce
()
from() Create an array from an object
lastInde Give the last position at which a given element

xOf() appears in an array
pop() Remove the last element of an array
push() Add a new element at the end
reverse Sort elements in descending order

()
reduce( Reduce the values of an array to a single value

) (going left-to-right)
Shortc
Action PC & MOBILE LIFESTYLE
ut
reduce Reduce the values of an array to a single value

Right() (going right-to-left)
shift() Remove the first element of an array
slice() Pull a copy of a portion of an array into a new array

object Metal 3D Printer from $150k
sort() Sort elements alphabetically Metal & Carbon Fiber 3D Printers
splice() Add elements in a specified way and position
unshift() Add a new element to the beginning Latest Deals

JavaScript Boolean Methods
Learn How to
toString Convert a Boolean value to a string, and return the Draw Freebie
() result Bundle
valueOf Return the first position at which a given element

() appears in an array
The Ultimate $
toSourc Return a string representing the source code of the Memory Mastery $
e() object
Bundle
JavaScript Arithmetic Operators
+ Addition
The Mega $
- Subtraction Microso O ice
Course Bundle
* Multiplication
/ Division
The 2020 $
(...) Grouping operator (operations within brackets are
Premium Learn
executed earlier than those outside)
To Code
% Modulus (remainder) Certification
++ Increment numbers
-- Decrement numbers
== Equal to
=== Equal value and equal type
!= Not equal
!== Not equal value or not equal type
> Greater than
Shortc
ut
Lesser than
>= Greater than or equal to
Lesser than or equal to
? Ternary operator
Logical Operators
&& Logical AND
|| Logical OR
! Logical NOT
Bitwise Operators
& AND statement
| OR statement
~ NOT
^ XOR
Left shift
>> Right shift
>>> Zero fill right shift
Functions
alert() Output data in an alert box in the browser window
confirm Open up a yes/no dialog and return true/false

() depending on user click
console Write information to the browser console (good for

.log() debugging purposes)
docum Write directly to the HTML document

ent.writ
e()
prompt( Create a dialog for user input

)
Global Functions
decode Decode a Uniform Resource Identifier (URI)

URI() created by encodeURI or similar
Shortc
ut
decode Decode a URI component

URICo
mpone
nt()
encode Encode a URI into UTF-8

URI()
encode Same but for URI components

URICo
mpone
nt()
eval() Evaluate JavaScript code represented as a string
isFinite Determine whether a passed value is a finite

() number
isNaN() Determine whether a value is an illegal number
Number Convert an object's value to a number

()
parseFl Parse a string and return a floating point number

oat()
parseInt Parse a string and return an integer

()
JavaScript Loops
for The most common way to create a loop in

JavaScript
while Set up conditions under which a loop executes
do Similar to the while loop, however, it executes at

while least once and performs a check at the end to see
if the condition is met to execute again
break Stop and exit the cycle if certain conditions are

mets
continu Skip parts of the cycle if certain conditions are met

e
Escape Characters
\' Single quote
\" Double quote
\\ Backslash
Shortc
ut
\b Backspace
\f Form feed
\n New line
\r Carriage return
\t Horizontal tabulator
\v Vertical tabulator
JavaScript String Methods
charAt() Return a character at a specified position inside a

string
charCo Give the unicode of character at that position

deAt()
concat( Concatenate (join) two or more strings into one

)
fromCh Return a string created from the specified

arCode sequence of UTF-16 code units
()
indexOf Provide the position of the first occurrence of

() specified text within a string
lastInde Same as indexOf() but with the last occurrence,

xOf() searching backwards
match() Retrieve the matches of a string against a search

pattern
replace Find and replace specified text in a string

()
search( Execute a search for a matching text and return its

) position
slice() Extract a section of a string and return it as a new

string
split() Split a string object into an array of strings at a

specified position
startsW Check whether a string begins with specified

ith() characters
substr() Similar to slice() but extracts a substring depended

on a specified number of characters
Shortc
ut
substrin Similar to slice() but can’t accept negative indices

g()
toLowe Convert strings to lower case

rCase()
toUppe Convert strings to upper case

rCase()
valueOf Return the primitive value (that has no properties or

() methods) of a string object
REGULAR EXPRESSION SYNTAX
Pattern Modifiers
e Evaluate replacement
i Perform case-insensitive matching
g Perform global matching
m Perform multiple line matching
s Treat strings as single line
x Allow comments and whitespace in pattern
U Ungreedy pattern
Brackets
[abc] Find any of the characters in the brackets
[^abc] Find any character not in the brackets
[0-9] Find digit specified in the brackets
[A-z] Find any character from uppercase A to lowercase

z
(a|b|c) Find any of the alternatives separated with |
Metacharacters
. Find a single character, except newline or line

terminator
\w Word character
\W Non-word character
\d A digit
Shortc
ut
\D A non-digit character
\s Whitespace character
\S Non-whitespace character
\b Find a match at the beginning/end of a word
\B Find a match not at the beginning/end of a word
\u0000 NUL character
\n A new line character
\f Form feed character
\r Carriage return character
\t Tab character
\v Vertical tab character
\xxx Character specified by an octal number xxx
\xdd Latin character specified by a hexadecimal number

dd
\udddd Unicode character specified by a hexadecimal

number dddd
Quantifiers
n+ Match any string that contains at least one n
n* Any string that contains zero or more occurrences

of n
n? Any string that contains zero or one occurrences of

n
n{X} Any string that contains a sequence of X n’s
n{X,Y} Strings that contains a sequence of X to Y n’s
n{X,} Matches any string that contains a sequence of at

least X n’s
n$ Any string with n at the end of it
^n String with n at the beginning of it
?=n Any string that is followed by a specific string n
?!n String that is not followed by a specific string n
Shortc
ut
Number Properties
MAX_V Maximum numeric value representable in

ALUE JavaScript
MIN_V Smallest positive numeric value representable in

ALUE JavaScript
NaN The “Not-a-Number” value
NEGAT Negative Infinity value

IVE_IN
FINITY
POSITI Positive Infinity value

VE_INF
INITY
Number Methods
toExpo Return a string with a rounded number written as

nential() exponential notation
toFixed Return string of a number with a specified number

() of decimals
toPreci Return string of a number written with a specified

sion() length
toString Return a number as a string

()
valueOf Return a number as a number

()
Math Properties
E Euler’s number
LN2 Natural logarithm of 2
LN10 Natural logarithm of 10
LOG2E Base 2 logarithm of E
LOG10 Base 10 logarithm of E

E
PI The number PI
SQRT1 Square root of 1/2

_2
SQRT2 Square root of 2
Shortc
ut
Math Methods
abs(x) Return the absolute (positive) value of x
acos(x) Arccosine of x, in radians
asin(x) Arcsine of x, in radians
atan(x) Arctangent of x as a numeric value
atan2(y, Arctangent of the quotient of its arguments

x)
ceil(x) Value of x rounded up to its nearest integer
cos(x) Cosine of x (x is in radians)
exp(x) Value of Ex
floor(x) Value of x rounded down to its nearest integer
log(x) Natural logarithm (base E) of x
max(x,y, Number with highest value

z,...,n)
min(x,y, Number with lowest value

z,...,n)
pow(x,y X to the power of y

)
random Random number between 0 and 1

()
round(x Value of x rounded to its nearest integer

)
sin(x) Sine of x (x is in radians)
sqrt(x) Square root of x
tan(x) Tangent of an angle
Dates
Date() Create a new date object with the current date and
time
Date(2 Create a custom date object. The numbers

017, 5, represent year, month, day, hour, minutes, seconds,
21, 3, milliseconds. You can omit anything you want
23, 10, except for year and month.
0)
Shortc
ut
Date(“2 Date declaration as a string

017-06-
23”)
getDat Get the day of the month as a number (1-31)

e()
getDay( Get the weekday as a number (0-6)

)
getFullY Get the year as a four digit number (yyyy)

ear()
getHour Get the hour (0-23)

s()
getMilli Get the millisecond (0-999)

second
s()
getMinu Get the minute (0-59)

tes()
getMon Get the month as a number (0-11)

th()
getSec Get the second (0-59)

onds()
getTim Get the time (milliseconds since January 1, 1970)

e()
getUTC Day (date) of the month in the specified date

Date() according to universal time (also available for day,
month, fullyear, hours, minutes etc.)
parse Parse a string representation of a date, and return

the number of milliseconds since January 1, 1970
setDate Set the day as a number (1-31)

()
setFullY Set the year (optionally month and day)

ear()
setHour Set the hour (0-23)

s()
setMilli Set the milliseconds (0-999)

second
s()
setMinu Set the minutes (0-59)

tes()
Shortc
ut
setMont Set the month (0-11)

h()
setSec Set the seconds (0-59)

onds()
setTime Set the time (milliseconds since January 1, 1970)

()
setUTC Set the day of the month for a specified date

Date() according to universal time (also available for day,
month, fullyear, hours, minutes etc.)
DOM MODE 
Node Properties
attribut Live collection of all attributes registered to an

es element
baseU Absolute base URL of an HTML element

RI
childNo Collection of an element’s child nodes

des
firstChil First child node of an element

d
lastChil Last child node of an element

d
nextSibl Next node at the same node tree level

ing
nodeNa Name of a node

me
nodeTy Type of a node

pe
nodeVa Value of a node

lue
ownerD Top-level document object for current node

ocumen
t
parentN Parent node of an element

ode
previou Node immediately preceding the current one

sSiblin
g
Shortc
ut
textCon Textual content of a node and its descendants

tent
Node Methods
append Add a new child node to an element as the last

Child() child node
cloneN Clone HTML element

ode()
compar Compare the document position of two elements

eDocu
mentPo
sition()
getFeat Return an object which implements the APIs of a

ure() specified feature
hasAttri Return true if an element has any attributes, else

butes() return false
hasChil Return true if an element has any child nodes, else

dNodes return false
()
insertB Insert a new child node before a specified, existing

efore() child node
isDefau Return true if a specified namespaceURI is the

ltName default, else return false
space()
isEqual Check if two elements are equal

Node()
isSame Check if two elements are the same node

Node()
isSupp Return true if a specified feature is supported on

orted() the element
lookup Return the namespaceURI associated with a given

Names node
paceU
RI()
lookup Return a DOMString containing the prefix for a

Prefix() given namespaceURI, if present
normali Join adjacent text nodes and remove empty text

ze() nodes in an element
Shortc
ut
remove Remove a child node from an element

Child()
replace Replace a child node in an element

Child()
Element Methods
getAttri Return the specified attribute value of an element

bute() node
getAttri Return string value of the attribute with the

buteNS specified namespace and name
()
getAttri Get the the specified attribute node

buteNo
de()
getAttri Return the attribute node for the attribute with the
buteNo given namespace and name
deNS()
getEle Provide a collection of all child elements with the

mentsB specified tag name
yTagNa
me()
getEle Return a live HTML collection of elements with a

mentsB certain tag name belonging to the given
yTagNa namespace
meNS()
hasAttri Return true if an element has any attributes, else

bute() return false
hasAttri Provide a true/false value indicating whether the

buteNS current element in a given namespace has the
() specified attribute
remove Remove a specified attribute from an element

Attribut
e()
remove Remove the specified attribute from an element

Attribut within a certain namespace
eNS()
remove Take away a specified attribute node and return the

Attribut removed node
eNode(
)
Shortc
ut
setAttri Set or change the specified attribute to a specified

bute() value
setAttri Add a new attribute or change the value of an

buteNS attribute with the given namespace and name
()
setAttri Set or change the specified attribute node

buteNo
de()
setAttri Add a new namespaced attribute node to an

buteNo element
deNS()
Browser Window Properties
closed Check whether a window has been closed or not

and return true or false
default Set or return the default text in the statusbar of a

Status window
docum Return the document object for the window

ent
frames Return all iframe elements in the current window
history Provide the History object for the window
innerHe Inner height of a window’s content area

ight
innerWi Inner width of the content area

dth
length Return the number of iframe elements in the

window
location Return the location object for the window
name Set or return the name of a window
navigat Return the Navigator object for the window

or
opener Return a reference to the window that created the

window
outerHe Outer height of a window, including

ight toolbars/scrollbars
outerWi Outer width of a window, including

dth toolbars/scrollbars
Shortc
ut
pageX Number of pixels by which the document has been

Offset scrolled horizontally
pageY Number of pixels by which the document has been

Offset scrolled vertically
parent Parent window of the current window
screen Return the Screen object for the window
screen Horizontal coordinate of the window (relative to

Left screen)
screenT Vertical coordinate of the window

op
screen Same as screenLeft but needed for some

X browsers
screen Same as screenTop but needed for some

Y browsers
self Return the current window
status Set or return the text in the statusbar of a window
top Return the topmost browser window
Browser Window Methods
alert() Display an alert box with a message and an OK

button
blur() Remove focus from the current window
clearInt Clear a timer set with setInterval()

erval()
clearTi Clear a timer set with setTimeout()

meout()
close() Close the current window
confirm Display a dialog box with a message and OK and

() Cancel buttons
focus() Set focus to the current window
moveB Move a window relative to its current position

y()
moveTo Move a window to a specified position

()
Shortc
ut
open() Open a new browser window
print() Print the content of the current window
prompt( Display a dialog box that prompts the visitor for

) input
resizeB Resize the window by the specified number of

y() pixels
resizeT Resize the window to a specified width and height

o()
scrollBy Scroll the document by a specified number of

() pixels
scrollTo Scroll the document to specified coordinates

()
setInter Call a function or evaluate an expression at

val() specified intervals
setTime Call a function or evaluate an expression after a

out() specified interval
stop() Stop the window from loading
Screen Properties
availHe Return the height of the screen (excluding the

ight Windows Taskbar)
availWi Return the width of the screen (excluding the

dth Windows Taskbar)
colorDe Return the bit depth of the color palette for

pth displaying images
height The total height of the screen
pixelDe The color resolution of the screen in bits per pixel

pth
width The total width of the screen
JAVASCRIPT EVENTS
JavaScript Mouse Events
onclick When user clicks on an element
onconte When user right-clicks on an element to open a

xtmenu context menu
Shortc
ut
ondblcli When user double-clicks on an element

ck
onmous When user presses a mouse button over an

edown element
onmous When user moves pointer onto an element

eenter
onmous When user moves pointer away from an element

eleave
onmous When user moves pointer while it is over an

emove element
onmous When user moves pointer onto an element or one

eover of its children
onmous When user moves pointer away from an element or

eout one of its children
onmous When user releases a mouse button while over an

eup element
JavaScript Keyboard Events
onkeyd When user is pressing a key down

own
onkeypr When user starts pressing a key

ess
onkeyu When user releases a key

p
JavaScript Frame Events
onabort When loading of media is aborted
onbefor Before the document is about to be unloaded

eunload
onerror When an error occurs while loading an external file
onhash When the anchor part of a URL has changed

change
onload When an object has loaded
onpage When user navigates away from a webpage

hide
onpage When user navigates to a webpage

show
Shortc
ut
onresiz When user resizes document view

e
onscroll When user is scrolling an element’s scrollbar
onunloa When a page has unloaded

d
JavaScript Form Events
onblur When an element loses focus
onchan When the content of a form element changes (for

ge input, select, and textarea)
onfocus When an element gets focus
onfocus When an element is about to get focus

in
onfocus When an element is about to lose focus

out
oninput User input on an element
oninvali When an element is invalid

d
onreset When a form is reset
onsear When a user types something in a search field (for

ch input="search")
onselec When user selects some text (for input and

t textarea)
onsubm When a form is submitted

it
JavaScript Drag Events
ondrag When user drags an element
ondrag When user has finished dragging the element

end
ondrag When the dragged element enters a drop target

enter
ondragl When the dragged element leaves the drop target

eave
ondrag When the dragged element is on top of the drop

over target
Shortc
ut
ondrag When user starts to drag an element

start
ondrop Dragged element is dropped on the drop target
JavaScript Clipboard Events
oncopy When user copies content of an element
oncut When user cuts an element’s content
onpast When user pastes content in an element

e
JavaScript Media Events
onabort When media loading is aborted
oncanpl When browser can start playing media (e.g. a file

ay has buffered enough)
oncanpl When browser can play through media without

aythrou stopping
gh
ondurat When duration of media changes

ionchan
ge
onende When media has reached its end

d
onerror When an error occurs while loading an external file
onload When media data is loaded

eddata
onload When metadata (like dimensions and duration) is

edmeta loaded
data
onloads When browser starts looking for specified media

tart
onpaus When media is paused either by user or

e automatically
onplay When media has been started or is no longer

paused
onplayi When media is playing after having been paused

ng or stopped for buffering
Shortc
ut
onprogr When browser is in the process of downloading

ess media
onratec When playing speed of media changes

hange
onseek When user has finished moving/skipping to a new

ed position in media
onseeki When user starts moving/skipping

ng
onstalle When browser is trying to load unavailable media

d
onsusp When browser is intentionally not loading media

end
ontimeu The playing position has changed (e.g. because of

pdate fast forward)
onvolu When media volume has changed (including mute)

mechan
ge
onwaiti When media has paused but is expected to

ng resume (for example, buffering)
Animation
animati When CSS animation is complete

onend
animati When CSS animation is repeated

oniterat
ion
animati When CSS animation has started

onstart
Miscellaneous
transitio When CSS transition is complete

nend
onmess When a message is received through the event

age source
onofflin When browser starts to work offline

e
ononlin When browser starts to work online

e
Shortc
ut
onpops When the window’s history changes

tate
onshow When a menu element is shown as a context menu
onstora When a Web Storage area is updated

ge
ontoggl When user opens or closes the details element

e
onwhee When mouse wheel rolls up or down over an

l element
ontouch When screen touch is interrupted

cancel
ontouch When user’s finger goes off touch screen

end
ontouch When user drags a finger across the screen

move
Explore JavaScript Further

We consider JavaScript one of the top programming
languages to master for the future. And we recommend
diving into advanced concepts like JavaScript array
methods once you have a grasp of the basics of JavaScript.
5 JavaScript Array Methods You

Should Master Today
Want to understand JavaScript arrays but can't get
to grips with them? Check our JavaScript array
examples for guidance.
Read More
Image Credit: Oskar Yildiz on Unsplash
Explore more about: Cheat Sheet, JavaScript.
Af liate Disclosure: By buying the products we recommend, you help

keep the site alive. Read more.
Your Family May Be Eating This

The Liquid In The Chicken Bag Isn't Water. Learn
What Your Family Needs To Do Today.
Grass Roots' Co-Operative Learn More
Enjoyed this article? Stay informed

by joining our newsletter!
your@email.com Submit
Read our privacy

policy
1 CO MMENT WR ITE A CO MMENT
5 JavaScript Array Methods You Should Master Today
The Essential CSS3 Properties Cheat Sheet
The Worst and Hardest Programming Languages to Avoid Like the Plague
What Is JavaScript and How Does It Work?
5 Steps to Understanding Basic HTML Code
How to Make Beautiful Coded Web Animations With Mo.JS
4 Google Scripts That Make Google Sheets More Powerful
Cheat Sheet: The Vim Linux Command Line Editor Cheat Sheet
© 2020 MakeUseOf. All Rights Reserved.

The Ultimate JavaScript Cheat Sheet

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

The Ultimate JavaScript Cheat Sheet

Uploaded by

Copyright:

Available Formats

3/5/2020 The Ultimate JavaScript Cheat Sheet

PC & MOBILE LIFESTYLE

The Ultimate JavaScript

Akshata trained in manual testing,

If you want to build dynamic webpages, you’ll have to

You can build all kinds of interesting interactive apps and

The cheat sheet can serve as a quick refresher on

FREE DOWNLOAD: This cheat sheet is available as a

The Ultimate PCJavaScript

include Check if an array contains the specified element

Creality LD-002R: Best Resi

from() Create an array from an object

lastInde Give the last position at which a given element

pop() Remove the last element of an array

push() Add a new element at the end

reverse Sort elements in descending order

reduce( Reduce the values of an array to a single value

reduce Reduce the values of an array to a single value

shift() Remove the first element of an array

slice() Pull a copy of a portion of an array into a new array

splice() Add elements in a specified way and position

unshift() Add a new element to the beginning Latest Deals

valueOf Return the first position at which a given element

=== Equal value and equal type

!== Not equal value or not equal type

> Greater than

>= Greater than or equal to

Lesser than or equal to

&& Logical AND

& AND statement

>> Right shift

>>> Zero fill right shift

alert() Output data in an alert box in the browser window

confirm Open up a yes/no dialog and return true/false

console Write information to the browser console (good for

docum Write directly to the HTML document

prompt( Create a dialog for user input

decode Decode a Uniform Resource Identifier (URI)

decode Decode a URI component

encode Encode a URI into UTF-8

encode Same but for URI components

eval() Evaluate JavaScript code represented as a string

isFinite Determine whether a passed value is a finite

isNaN() Determine whether a value is an illegal number

Number Convert an object's value to a number

parseFl Parse a string and return a floating point number

parseInt Parse a string and return an integer

for The most common way to create a loop in

while Set up conditions under which a loop executes

do Similar to the while loop, however, it executes at

break Stop and exit the cycle if certain conditions are

continu Skip parts of the cycle if certain conditions are met

\' Single quote

\" Double quote

JavaScript String Methods

charAt() Return a character at a specified position inside a

charCo Give the unicode of character at that position

concat( Concatenate (join) two or more strings into one

fromCh Return a string created from the specified

indexOf Provide the position of the first occurrence of

lastInde Same as indexOf() but with the last occurrence,

match() Retrieve the matches of a string against a search

replace Find and replace specified text in a string