Welcome to the JavaScriptTutorial.net website! This JavaScript Tutorial helps you learn the JavaScript programming language from scratch quickly and effectively.
If you find yourself in any of the following situations:
- Unsure about where to start learning JavaScript.
- Tired of simply copying and pasting JavaScript code without really understanding how it works.
- Feel stuck to add richer and more compelling features to your websites and web applications because you don’t know how to get much out of JavaScript.
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 uses 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 (||
).
Section 4. Control flow Statements
- if – show you how to 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 theswitch
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 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.
- 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 isnull
orundefined
. - 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
andsuper
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 arrow functions.
- Rest parameter – introduce you to the rest parameters 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 firstPromise
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.
- Promise.withResolvers() – return a new Promise with resolve and reject functions.
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 asynchronous iterators to access asynchronous data sources sequentially.
- Async generators – show you how to create an async generator.
Section 11. Modules
- Modules – learn how to write modular JavaScript code.
- Export – explain in detail how to export variables, functions, and classes from a module.
- Import – guide you on how to import default exports and named exports from another module.
- Dynamic import – show you how to import a module dynamically via the function-like object
import()
. - Top-level await – explain the top-level await module and its use cases.
Section 12. Symbol
- Symbol – introduce you to a new primitive type called
symbol
in ES6
Section 14. Error handling
- try…catch – show you how to handle exceptions gracefully.
- try…catch…finally – learn how to catch exceptions and execute 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 15. JavaScript var, let, and const
- let – declare block-scoped variables using the
let
keyword. - let vs. var – understand the differences between
let
andvar
. - const – define constants using the
const
keyword.
Section 16. 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 17. 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 18. 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 the
BigInt
type that represents the big integers. - String type – introduce you to the String type.
Section 19. Advanced Operators
- 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 isnull
orundefined
. - Exponentiation operator – introduce you to the exponentiation operator (
**
) that calculates a base to the exponent power, which is similar toMath.pow()
method.