Full Access Locked
You are viewing this roadmap in Preview Mode. Upgrade your membership to unlock all missions.
Your Journey
0 / 107 MissionsJavaScript Intro – What is JavaScript?
<p> Write a simple JavaScript program that displays a message in the browser console. </p> <pre> Expected Output Example: Hello, JavaScript! </pre> <p> This challenge helps you confirm that JavaScript is working correctly. </p>
JavaScript Output
<p> Create a JavaScript program that displays text using different output methods. </p> <pre> Expected Output Example: Hello World Welcome to JavaScript </pre> <p> This lesson shows the most common ways to display output in JavaScript. </p>
JavaScript Syntax
<p> Write a simple JavaScript program that declares a variable and displays its value using JavaScript syntax rules. </p> <pre> Expected Output Example: Hello JavaScript </pre> <p> This challenge helps you understand the basic syntax rules of JavaScript. </p>
JavaScript Comments
<p> Write a JavaScript program that uses both single-line and multi-line comments. </p> <pre> Expected Output Example: JavaScript Comments Example </pre> <p> This challenge will help you learn how to add comments to your JavaScript code. </p>
JavaScript Variables
<p> Create a JavaScript program that declares a variable, assigns a value to it, and displays the value. </p> <pre> Expected Output Example: 10 </pre> <p> This challenge helps you learn how to store and use data in JavaScript. </p>
JavaScript Let
<p> Create a JavaScript program that uses the <code>let</code> keyword to declare a variable and then updates its value. </p> <pre> Expected Output Example: 20 </pre> <p> This challenge helps you understand how the <code>let</code> keyword works in JavaScript. </p>
JavaScript const Keyword
<p> Create a JavaScript program that declares a constant using <code>const</code> and displays its value. </p> <pre> Expected Output Example: 100 </pre> <p> This challenge helps you understand how constants work in JavaScript. </p>
JavaScript Operators
<p> Create a JavaScript program that uses arithmetic operators to calculate a result and display it. </p> <pre> Expected Output Example: 15 </pre> <p> This challenge helps you understand how operators work in JavaScript. </p>
JavaScript Arithmetic Operators
<p> Write a JavaScript program that uses arithmetic operators to perform a calculation and display the result. </p> <pre> Expected Output Example: 20 </pre> <p> This challenge helps you practice basic math operations in JavaScript. </p>
JavaScript Assignment Operators
<p> Create a JavaScript program that uses assignment operators to update a variable value and display it. </p> <pre> Expected Output Example: 15 </pre> <p> This challenge helps you understand how assignment operators modify values. </p>
JS Functions
Create f() returns 'Hi' and log call
JS Objects
Create obj {a:1} and log obj.a
JS Events
The console.log is our primary JS event tool here.
JS Strings
Log 'JS' and 'Rules'
String Length
Log length of 'Hello'
String Slice
Slice 'Apple, Banana' 0 to 5
String Substring
Substring 'Apple' 0, 2
String Replace
Replace 'a' with 'b' in 'aaa'
String Uppercase
Uppercase 'js'
JS Arrays
Create array [1, 2] and log
Access Array
Log first item of [10, 20]
Array Length
Log length of [1, 2, 3]
Array Push
Push 3 to [1, 2] and log
Array Pop
Pop from [1, 2] and log
Array Join
Join ['A', 'B'] with '-'
Array Shift
Shift [1, 2] and log
Array Unshift
Unshift 0 to [1, 2]
Array Concat
Concat [1] and [2]
Array Splice
Splice out index 1 from [1, 2, 3]
JS Booleans
Log 10 > 9
JS Comparison
Log 5 === '5'
JS If Else
If 1<2 log 'Yes'
JS Else
Else log 'No'
JS Else If
Else if check
JS Switch
Switch case 1 log 'One'
Loop For
Loop 0 to 2
Loop For In
Loop keys of {a:1}
Loop For Of
Loop [1, 2] values
While Loop
While i<3
Break and Continue
Break for if i==1
JS Sets
Create Set [1, 1, 2] and log size
JS Maps
Create Map set 'a' to 1
Type Conversion
Convert String '10' to Number
JS Bitwise
Log 5 & 1
JS RegExp
Search 'w3' in 'W3' case insensitive
JS Errors
Try throw and log
JS Scope
Global vs Local (Theory lesson)
JS Hoisting
Log x before var declaration
Strict Mode
Log 'Strict'
this Keyword
Log this in simple object
Arrow Functions
Arrow function returns 'Hi'
JS Classes
Class with constructor
Class Inheritance
Subclass logs parent
Static Methods
Static log 'S'
JS Modules
Simulate module export logic
JS JSON
Parse '{"a":1}'
JS Debugging
Use debugger (Theory)
Destructuring
Destructure [1, 2]
Spread Operator
Spread [1, 2] into [0, ...]
Object Definitions
let o = {p:1}; console.log(o.p)
Object Properties
let o = {p:1}; console.log(o['p'])
Object Methods
Call o.f()
Object Display
Log values of {a:1}
Object Accessors
Use getter 'g'
Object Constructors
Function Person(n) and log new
Object Prototypes
Check if P.prototype
Object Reference
Modify ref
Object Assign
Copy {a:1}
Object Entries
Entries of {a:1}
Func Definitions
const f = function() { return 1; }; console.log(f())
Func Parameters
function f(a=1) { return a; } console.log(f())
Func Invocation
function f() { return 'Hi'; } console.log(f())
Func Call
Call f with context
Func Apply
Apply f with args
Func Bind
Bind f to obj
Func Closures
Counter closure
Async Intro
Use setTimeout theory
JS Promises
Log 'Promise'
Async Await
Log 'Async'
Template Literals
Log `Hi ${1}`
Nullish Coalescing
Log null ?? 'Hi'
Optional Chaining
Access o?.a?.b
Short Circuit
Log true && 'A'
Logical Assignment
let x=0; x ||= 1; log x
Array find
Find >1 in [1, 2]
Array findIndex
Index of 2 in [1, 2]
Array some
Check if some > 1
Array every
Check if every > 0
Array filter
Filter > 1
Array map
Map x*2
Array reduce
Sum [1, 2, 3]
Array flat
Flat [[1], 2]
Array isArray
Check []
String trim
Trim ' a '
String padStart
Pad '1' to '001'
Math max
Max of 1, 2
Math min
Min of 1, 2
Math random
Check if < 1
Math round
Round 4.7
Math ceil
Ceil 4.1
Math floor
Floor 4.9
Date Output
Check type
JSON Stringify
Stringify {a:1}
Typeof Array
Type of []
JS Symbols
typeof Symbol()
Global check
typeof globalThis
Path Completion
Complete all missions to earn your certificate of mastery.