JavaScript Tutorial

Welcome to the JavaScriptTutorial.net website! This JavaScript Tutorial helps you learn the JavaScript programming language from scratch quickly and effectively.

If you…

Are not sure where to start learning JavaScript.
Are frustrated with copy-n-paste JavaScript code from others without really understanding it.
Cannot add richer and more compelling features to your websites and web applications using JavaScript because you don’t know how to get much out of the language.

JavaScriptTutorial.net is a good place to start.

Section 1. Getting started

What is JavaScript? – introduce you to JavaScript and its history.
Install a JavaScript source code editor – learn how to install the Visual Studio Code for editing JavaScript code.
Meet the Console Tab of Web Development Tools – provide you with a basic introduction to the Console window on the web browsers.
JavaScript Hello World – learn how to execute the first JavaScript code that displays the famous "Hello, World!" message.

Section 2. Fundamentals

Syntax – explain the JavaScript syntax, including whitespace, statements, identifiers, keywords, expressions, and comments.
Variables – show you how to declare variables.
Data types – introduce to you the JavaScript data types, including primitive and reference types.
Number – learn how JavaScript use the Number type to represent the integer and floating-point numbers.
Numeric Separator– show you how to make the numbers more readable by using underscores as numeric separators.
Octal & binary literals – provide support for binary literals and change the way to represent octal literals.
Boolean – introduce you to the Boolean type.
String – learn about string primitive type and some basic string operations.
Object – introduce you to the object type.
Primitive vs. reference values – understand two value types in JavaScript, including primitive and reference values, and the differences between them.
Array – introduce you to the Array type and how to manipulate array elements.

Section 3. Operators

Arithmetic operators – introduce to you the arithmetic operators including addition (+), subtraction (-), multiplication (*), and division (/).
Remainder operator – show you how to use the remainder operator (%) to get the remainder left over when one value is divided by another value.
Assignment operators – guide you on how to use assignment operators (=) to assign a value or an expression to a variable.
Unary operators – learn how to use unary operators.
Comparison operators – show you how to use comparison operators to compare two values.
Logical operators – learn how to use the logical operators: NOT (!), AND (&&), and OR (||).
Logical assignment operators – introduce to you the logical assignment operators, including ||=, &&=, and ??=
Nullish coalescing operator (??) – accept two values and return the second value if the first one is null or undefined.
Exponentiation operator – introduce you to the exponentiation operator (**) that calculates a base to the exponent power, which is similar to Math.pow() method.

Section 4. Control flow Statements

if – show you how use the if statement to execute a block if a condition is true.
if…else – learn how to execute a block of code based on a specified condition.
if…else…if – check multiple conditions and execute a block.
Ternary operators – show you how to make a shortcut for the if statement ( ?:).
switch – show you how to replace multiple if statements when comparing a value with multiple variants by using the switch statement.
while – learn how to perform a pre-test loop that repeatedly executes a block of code as long as a specified condition is true.
do…while – show you how to carry a post-test loop that executes a block of code repeatedly until a specified condition is false.
for loop – learn how to repeatedly execute a block of code based on various options.
break – learn how to prematurely terminate a loop.
continue – show you how to skip the current iteration of a loop and jump to the next one.
Comma operator – guide you on how to use the comma operator in a for loop to update multiple variables at once.

Section 5. Functions

Functions – introduce you to functions in JavaScript.
Functions are the first-class citizens – learn how to store functions in the variables, pass functions into other functions as arguments, and return functions as values.
Anonymous Functions – learn about anonymous functions which are the functions without names.
Pass-by-value – understand how pass-by-value works in JavaScript.
Recursive function – learn how to define recursive functions.
Default Parameters – show you how to define default parameters for functions.

Section 6. Objects & Prototypes

Object Methods – introduce you to the methods of an object.
Constructor functions – show you how to use constructor functions to define custom types in JavaScript.
Prototype – learn how the prototype works in JavaScript.
Constructor/Prototype pattern – show you how to combine the constructor function and prototype pattern to define custom types.
Prototypal inheritance – understand prototypal inheritance in JavaScript.
What is this in JavaScript – understand the this value and how it works in JavaScript.
globalThis – provide a standard way to access the global object across environments.
Object Properties – dive into the object’s properties and their attributes.
for…in loop – learn how to iterate over properties of an object using the for...in loop.
Enumerable Properties – learn more about the enumerable properties.
Own Properties – understand the own and inherited properties.
Object.values() – return own enumerable property’s values of an object as an array.
Object.entries() – return own enumerable string-keyed property [key, value] pairs of an object.
Object.assign() – copy an object or merge objects.
Object.is() – check if two values are the same value.
Factory functions – learn about the factory functions which are functions that return objects.
Object Destructuring – learn how to assign properties of an object to variables.
Optional chaining operator (?.) – simplify the way to access a property located deep within a chain of connected objects without having to check if each reference in the chain is null or undefined.
Object literal syntax extensions – provide a new way to define object literal.

Section 7. Classes

Class – introduce you to the ES6 class syntax and how to declare a class.
Getters and Setters – define the getters and setters for a class using the get and set keywords.
Class Expression – learn an alternative way to define a new class using a class expression.
Computed property – explain the computed property and its practical application.
Inheritance – show you how to extend a class using the extends and super keywords.
new.target – introduce you to the new.target metaproperty.
Static methods – guide you on how to define methods associated with a class, not instances of that class.
Static Properties – show you how to define static properties shared by all instances of a class.
Private Fields – learn how to define private fields in a class.
Private Methods – show you how to define private methods in a class.

Section 8. Advanced Functions

Function type – introduce you to the Function type and its properties and methods.
call()– understand the call() method and learn how to use it effectively.
apply() – learn how to use the apply() method effectively.
bind() – understand the bind() method and how to apply it effectively.
Closure – understand the closures in JavaScript.
Immediately Invoked Function Expression (IIFE) – learn about immediately invoked function expressions (IIFE).
Returning multiple values – guide you on how to return multiple values from a function.
Arrow functions – introduce you to the arrow functions ( =>)
Arrow functions: when you should not use – learn when not to use the arrow functions.
Rest parameter – introduce you to the rest parameter and how to use them effectively.
Callback functions – introduce you to the callback functions and learn how to use the callbacks to handle asynchronous operations.

Section 9. Promises & Async/Await

Promises – learn about Javascript Promises, what they are, and how to use them effectively.
Promise chaining – show you how to execute multiple asynchronous operations in sequence.
Promise composition: Promise.all() & Promise.race() – learn how to compose a new promise out of several promises.
Promise.any() – learn how to use the JavaScript Promise.any() method to return the first Promise that fulfills.
Promise.allSettled() – accept a list of promises and returns a new promise that resolves to an array of values, which were settled (either resolved or rejected) by the input promises.
Promise.prototype.finally() – execute a piece of code when the promise is settled, regardless of its outcome.
Promise error handling – guide you on how to handle errors in promises.
async / await – write asynchronous code in a clearer syntax.

Section 10. Iterators & Generators

Iterators – introduce you to the iteration and iterator protocols.
Generators – develop functions that can pause midway and then continue from where they paused.
yield – dive into how to use the yield keyword in generators.
for…of – learn how to use the for...of loop to iterate over elements of an iterable object.
Asynchronous iterators – learn how to use async iterators to access asynchronous data sources sequentially.
Async generators – show you how to create an async generator.

Section 11. String Operations

String type – introduce you to the String type.
Template literals – learn how to substitute variables in a string.
trim() – remove whitespace characters from a string.
trimStart() – remove the leading whitespace characters of a string.
trimEnd() – remove the ending whitespace characters of a string
padStart() and padEnd() – pad a string with another string until the result string reaches the given length.
concat() – concatenate multiple strings into a new string.
split() – split a string into an array of substrings.
indexOf() – get the index of the first occurrence of a substring in a string.
lastIndexOf() – find the index of the last occurrence of a substring in a string.
substring() – extract a substring from a string.
slice() – extract a part of a string.
includes() – check if the string contains a substring.
replaceAll() – replace all occurrences of a substring that matches a pattern with a new one.
startsWith() – check if a string starts with another string.
endsWith() – determine if a string ends with another string.

Section 12. Array Operations

Array length property – show you how to use the length property of an array effectively.
Array destructuring – show you how to assign the elements of an array to variables.
Spread operator – learn how to use the spread operator effectively.
push() – show you how to add an element to the end of an array.
pop() – show you how to remove an element from the end of an array.
splice() – manipulate elements in an array such as deleting, inserting, and replacing elements.
slice() – copy elements of an array.
index() – locate an element in an array.
every() – check if every element in an array passes a test.
some() – check if at least one element in an array passed a test.
sort() – sort elements in an array.
map() – transform array elements.
filter() – filter elements in an array
forEach() – loop through array elements.
reduce() – reduce elements of an array to a value.
join() – concatenate all elements of an array into a string separated by a seperator.
flat() – flatten an array recursively up to a specified depth.
flatMap() – execute a mapping function on every element and flatten the result. It is the combination of the map() followed by the flat() method.
at() method – guide you on how to use the Array.prototype.at() method to access array elements.
of() – improve array creation.
from() – create arrays from array-like or iterable objects.
find() – find an element in an array
findIndex() – find the index of an element in an array.
includes() – allow you to check if an element is in an array.
concat() – merge two arrays into an array.
Multidimensional Array – learn how to work with multidimensional arrays in JavaScript.

Section 13. Modules

Modules – learn how to write modular JavaScript code.
Dynamic import – show you how to import a module dynamically via the function-like object import().
Top-level await – explain top-level await module and its use cases.

Section 14. Symbol

Symbol – introduce you to a new primitive type called symbol in ES6

Section 15. Collections

Map – introduce you to the Map type that holds a collection of key-value pairs.
Set – learn how to use the Set type that holds a collection of unique values.

Section 16. Error handling

try…catch – show you how to handle exceptions gracefully.
try…catch…finally – learn how to catch exceptions and execut a block whether the exceptions occur or not.
throw – show you how to throw an exception.
Optional catch binding – omit the exception variable in the catch block.

Section 17. Regular Expressions

Regular expressions – learn how to create regular expressions in JavaScript and how to use them to search and replace strings using patterns and flags.
Character classes – show you how to form a regular expression with character classes that allow you to match any character in the character sets.
Anchors – learn how to use anchors in regular expressions to match at the beginning or end of a string.
Sets and Ranges – guide you on how to use the sets and ranges to match a set of characters.
Word Boundaries – show you how to use the word boundaries in the regular expressions to carry the match whole word only.
Quantifiers – learn how to use quantifiers to match a number of instances of a character, group, or character class in a string
replace() – replace a substring in a string with a new one.
match() – match a string against a regular expression.
search() – locate a substring in a string using a regular expression.

Section 18. JavaScript var, let, and const

let – declare block-scoped variables using the let keyword.
let vs. var – understand the differences between let and var.
const – define constants using the const keyword.

Section 19. Proxy & Reflection

Proxy – learn how to use the proxy object that wraps another object (target) and intercepts the fundamental operations of the target object.
Reflection – show you how to use ES6 Reflection API to manipulate variables, properties, and methods of objects at runtime.

Section 20. JavaScript Runtime

Execution Contexts – understand execution contexts including global and function execution contexts.
Call Stack – understand the call stack.
Event Loop – show you how JavaScript handles asynchronous operations using the event loop.
Hoisting – learn how hoisting works in JavaScript.
Variable scopes – introduce you to the variable scopes.

Section 21. Primitive Wrapper Types

Primitive wrapper types – learn how primitive wrapper types work in JavaScript.
Boolean – introduce you to the Boolean primitive wrapper type.
Number – learn about the Number primitive wrapper type.
BigInt – introduce you to the BigInt type that represent the big integers.