JavaScript Tutorial

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

JavaScript Tutorial

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

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 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

Section 6. Objects & Prototypes

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

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.
  • 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 13. 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 14. Error handling

Section 15. 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 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 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.