Free Online Course · Self-paced

Modern JavaScript Tutorial (ES6+ Hands-On)

Free, hands-on JavaScript tutorial - strings, numbers, arrays, objects, ES6+ features, classes, async/await, the DOM, error handling, and common error fixes. 75+ runnable lessons covering modern JavaScript. Each linked article states what to expect when you run its snippets in Node or the browser.

  • 121 parts
  • ~414 min total
  • Beginner to Intermediate
  • Updated Jun 2026
Modern JavaScript Tutorial (ES6+ Hands-On)
By Last updated

JavaScript is the only language that runs natively in every browser, and increasingly the most popular language on servers (via Node.js) too. This tutorial covers modern JavaScript - ES6 and later - the way you will actually write it in real codebases. We skip the legacy quirks where possible and focus on idiomatic, current syntax.

Roadmap diagram: example clusters of JavaScript topics from syntax through async DOM and tooling as a learning graph

We start with strict mode in JavaScript, scope, and the equality rules (== vs ===), then walk through every core data type (numbers, strings, arrays, objects), modern syntax (arrow functions, template literals, destructuring, spread, nullish coalescing), classes and design patterns, async with Promises and async/await, DOM manipulation, error handling, and finally a chapter dedicated to fixing the most common JavaScript errors you will hit. Every snippet runs in the browser console or Node.js REPL with zero setup.

The chapter list on this page is the full course index: every JavaScript lesson is linked here. On other JavaScript pages, the sidebar shows a shorter spine of core topics in learning order so navigation stays light; use this hub whenever you need the complete list—including method deep-dives, jQuery, design patterns, and troubleshooting fixes.

Click Start the course to begin, or jump to the chapter you need - Arrays, Async, and DOM Manipulation are the most-bookmarked. When you finish, the next course is /nodejs-tutorial/ for server-side JavaScript.

What you'll learn

  • Write modern ES6+ JavaScript - let/const, arrow functions, template literals, destructuring, spread
  • Work fluently with strings, numbers, arrays, and objects using the right method for each job
  • Build classes with inheritance and apply singleton / observer / mediator patterns correctly
  • Handle async code with Promises, async/await, and chained then() without footguns
  • Manipulate the DOM, handle events, and build interactive UIs without a framework
  • Debug the most common JavaScript errors (call stack, undefined, module imports, headers)

Prerequisites

  • Any modern browser (Chrome/Firefox/Edge) with DevTools
  • Node.js LTS installed (optional but recommended for running snippets)
  • Basic HTML/CSS knowledge for the DOM chapter

Syllabus

14 chapters · 121 lessons · ~414 min of reading

  1. 1 Getting Started 5 lessons
    1. Part 1 use strict mode 2 min read
    2. Part 2 Global variables and scope 5 min read
    3. Part 3 == vs === - the equality rules 5 min read
    4. Part 4 Check if a variable is undefined 4 min read
    5. Part 5 Calling vs invoking a function 3 min read
  2. 2 Numbers and Math 15 lessons
    1. Part 6 Math.abs() 2 min read
    2. Part 7 Math.ceil() 2 min read
    3. Part 8 Math.floor() 2 min read
    4. Part 9 Math.pow() and exponents 2 min read
    5. Part 10 Exponentiation in JavaScript 4 min read
    6. Part 11 Number.toFixed() 2 min read
    7. Part 12 Math.random() 2 min read
    8. Part 13 Math.sqrt() 2 min read
    9. Part 14 Math.max() 2 min read
    10. Part 15 Math.min() 2 min read
    11. Part 16 Math.cbrt() 2 min read
    12. Part 17 Math.fround() 2 min read
    13. Part 18 Round down a number 2 min read
    14. Part 19 Integer division 7 min read
    15. Part 20 <= operator 2 min read
  3. 3 Strings 17 lessons
    1. Part 21 Template literals (backticks) 3 min read
    2. Part 22 String.includes() - contains check 2 min read
    3. Part 23 String.startsWith() 2 min read
    4. Part 24 String.trim() 2 min read
    5. Part 25 String.toLowerCase() 2 min read
    6. Part 26 String.indexOf() 3 min read
    7. Part 27 Replace a substring 3 min read
    8. Part 28 String.replaceAll() 2 min read
    9. Part 29 replaceAll() with regex patterns 2 min read
    10. Part 30 String.trimEnd() Coming soon
    11. Part 30 Variables inside regex patterns 2 min read
    12. Part 31 Convert SRT subtitles to plain text 4 min read
    13. Part 32 Remove the last character of a string 3 min read
    14. Part 33 Convert a string to an array 5 min read
    15. Part 34 Compare strings 6 min read
    16. Part 35 Check if a string is a number 5 min read
    17. Part 36 Validate an email address 2 min read
  4. 4 Arrays 16 lessons
    1. Part 37 Add an item to an array 4 min read
    2. Part 38 Array.pop() 3 min read
    3. Part 39 Array.unshift() 3 min read
    4. Part 40 Slice an array 4 min read
    5. Part 41 slice() method reference 2 min read
    6. Part 42 Array.splice() 2 min read
    7. Part 43 Array.join() 6 min read
    8. Part 44 Copy an array 6 min read
    9. Part 45 Remove duplicates from an array 2 min read
    10. Part 46 Remove a specific element 2 min read
    11. Part 47 Flatten a nested array 3 min read
    12. Part 48 Check if an array is empty 4 min read
    13. Part 49 Spread operator (...) 2 min read
    14. Part 50 Sort an array 2 min read
    15. Part 51 Array.findIndex() 4 min read
    16. Part 52 Set and HashSet-style uniqueness 4 min read
  5. 5 Data structures, DOM utilities, and patterns 7 lessons
    1. Part 53 Linked list implementation 4 min read
    2. Part 54 Infinite loops (intentional and accidental) 4 min read
    3. Part 55 XOR operator and bitwise patterns 2 min read
    4. Part 56 Create and manipulate SVG 2 min read
    5. Part 57 Detect ad blockers in the browser 5 min read
    6. Part 58 Simulate Tab key events 2 min read
    7. Part 59 Conditional logic with jQuery 2 min read
  6. 6 Objects, JSON, Destructuring 9 lessons
    1. Part 60 Object literals 4 min read
    2. Part 61 Check if a key exists in an object 7 min read
    3. Part 62 Object.hasOwnProperty() 4 min read
    4. Part 63 Clone an object 5 min read
    5. Part 64 Deep copy an object 7 min read
    6. Part 65 Merge objects 3 min read
    7. Part 66 Object and array destructuring 7 min read
    8. Part 67 JSON.stringify() with pretty-print 2 min read
    9. Part 68 JSON.parse() 2 min read
  7. 7 Functions 5 lessons
    1. Part 69 Arrow functions 4 min read
    2. Part 70 The arguments object 4 min read
    3. Part 71 Optional parameters and defaults 2 min read
    4. Part 72 Functions as values (first-class) 4 min read
    5. Part 73 Recursion (factorial example) 3 min read
  8. 8 Control Flow and Loops 5 lessons
    1. Part 74 Nullish coalescing (??) 5 min read
    2. Part 75 Double-negation (!!) for boolean coercion 5 min read
    3. Part 76 forEach vs for...in vs for...of 7 min read
    4. Part 77 Loop through an object's keys 4 min read
    5. Part 78 for loop with index 2 min read
  9. 9 Classes and OOP 5 lessons
    1. Part 79 JavaScript classes 5 min read
    2. Part 80 Subclasses and extends 3 min read
    3. Part 81 instanceof operator 3 min read
    4. Part 82 Singleton pattern 2 min read
    5. Part 83 Observer pattern 3 min read
  10. 10 Async - Promises and async/await 10 lessons
    1. Part 84 async / await 3 min read
    2. Part 85 Promise.all() 2 min read
    3. Part 86 Promise.race() 4 min read
    4. Part 87 Promise.resolve() 3 min read
    5. Part 88 Promise.reject() 3 min read
    6. Part 89 Chain promises with .then() 2 min read
    7. Part 90 Wait for async work to finish 2 min read
    8. Part 91 setTimeout() 4 min read
    9. Part 92 Wait N seconds in JavaScript 2 min read
    10. Part 93 Run a function every second (setInterval) 4 min read
  11. 11 Date and Time 5 lessons
    1. Part 94 Get the current date 5 min read
    2. Part 95 Add days to a date 4 min read
    3. Part 96 Format dates 6 min read
    4. Part 97 Convert a date to ISO string 2 min read
    5. Part 98 Compare dates 2 min read
  12. 12 DOM Manipulation and Events 15 lessons
    1. Part 99 Get a DOM element 3 min read
    2. Part 100 querySelector / querySelectorAll 3 min read
    3. Part 101 Get and set textContent 3 min read
    4. Part 102 Element.replaceWith() 2 min read
    5. Part 103 Remove a DOM element 3 min read
    6. Part 104 Node.appendChild() 4 min read
    7. Part 105 Node.insertBefore() 4 min read
    8. Part 106 window.scrollTo() 2 min read
    9. Part 107 Redirect to a URL 3 min read
    10. Part 108 Open a new tab from JS 3 min read
    11. Part 109 addEventListener() 6 min read
    12. Part 110 Keyboard events 6 min read
    13. Part 111 Mouse events 3 min read
    14. Part 112 Event bubbling explained 4 min read
    15. Part 113 Copy to clipboard 4 min read
  13. 13 Error Handling 3 lessons
    1. Part 114 try / catch / finally 3 min read
    2. Part 115 return vs throw 3 min read
    3. Part 116 Throw custom errors 2 min read
  14. 14 Common Errors and Troubleshooting 5 lessons
    1. Part 117 Fix: Cannot use import statement outside a module 6 min read
    2. Part 118 Fix: Maximum call stack size exceeded 2 min read
    3. Part 119 Fix: Cannot set headers after they are sent 8 min read
    4. Part 120 Fix: Objects are not valid as a React child 3 min read
    5. Part 121 Fix: ipython is not defined 11 min read
Deepak Prasad

R&D Engineer

Founder of GoLinuxCloud with more than 15 years of expertise in Linux, Python, Go, Laravel, DevOps, Kubernetes, Git, Shell scripting, OpenShift, AWS, Networking, and Security. With extensive experience, he excels across development, DevOps, networking, and security, delivering robust and efficient solutions for diverse projects.

  • Go (programming language)
  • Python (programming language)
  • DevOps
  • Computer Security
  • Cloud Computing
  • Kubernetes
  • Linux
  • Ansible (software)