JavaScript Fundamentals
The course teaches JavaScript fundamentals, covering variables, types, operators, control flow, functions, scope, objects, arrays, and basic DOM manipulation, enabling learners to write clean, interactive web code.
Who Should Take This
Anyone who builds or maintains websites, from junior developers to aspiring front‑end engineers, who has little or no prior JavaScript experience, will benefit. They seek to understand core language concepts, gain confidence manipulating the DOM, and lay a solid foundation for future asynchronous programming and framework work.
What's Included in AccelaStudy® AI
Adaptive Knowledge Graph
Practice Questions
Lesson Modules
Console Simulator Labs
Exam Tips & Strategy
20 Activity Formats
Course Outline
68 learning goals
1
Variables and Types
3 topics
Declarations and Scoping
- Identify the differences between var, let, and const declarations and describe how block scoping, hoisting, and the temporal dead zone affect each
- Describe JavaScript's primitive types including string, number, bigint, boolean, undefined, null, and symbol and explain how typeof behaves for each
- Implement variable declarations using destructuring assignment for arrays and objects to extract values into named bindings
- Analyze the temporal dead zone behavior for let and const and evaluate common initialization errors that arise from accessing variables before declaration
Type Coercion and Conversion
- Explain JavaScript's type coercion rules including how abstract equality (==) performs implicit conversion and why strict equality (===) is preferred
- Implement explicit type conversions using Number(), String(), Boolean(), parseInt(), and parseFloat() and handle edge cases like NaN and Infinity
- Analyze common type coercion pitfalls such as adding strings to numbers, comparing null and undefined, and truthy/falsy evaluation of empty arrays and objects
- Implement explicit checks for NaN using Number.isNaN, null using strict equality, and undefined using typeof to write defensive guard clauses
Strings and Template Literals
- Implement template literals with embedded expressions, multi-line strings, and tagged templates for custom string processing
- Implement string methods including slice, substring, includes, startsWith, endsWith, split, replace, and replaceAll for text manipulation
- Describe the difference between primitive string values and String objects and explain how autoboxing enables method calls on primitive strings
2
Operators and Control Flow
3 topics
Operators
- Identify arithmetic, comparison, logical, and assignment operators and describe operator precedence rules and grouping with parentheses
- Implement nullish coalescing (??) and optional chaining (?.) operators to safely access nested properties and provide default values
- Compare the behavior of logical OR (||) with nullish coalescing (??) for default value assignment and evaluate when each operator is appropriate
Conditional and Loop Statements
- Implement if-else chains, switch statements, and ternary expressions to handle multi-branch decision logic
- Implement for loops, for...of loops for iterables, for...in loops for object enumeration, while loops, and do...while loops with break and continue statements
- Analyze the differences between for...in and for...of and evaluate the risks of using for...in on arrays including prototype chain enumeration
- Implement labeled statements with break and continue to control flow in nested loops and explain when labeled control flow improves clarity
Error Handling
- Describe how try-catch-finally blocks work in JavaScript and explain the throw statement for raising custom errors
- Implement custom error classes by extending the built-in Error class with additional properties and meaningful error messages
- Evaluate error handling strategies for synchronous code and analyze when to catch versus propagate errors in function call chains
3
Functions and Scope
3 topics
Function Syntax and Parameters
- Describe function declarations, function expressions, and arrow functions and explain the differences in hoisting behavior and this binding between them
- Implement functions with default parameters, rest parameters (...args), and the spread operator for argument forwarding
- Implement higher-order functions that accept functions as arguments or return functions, using patterns like callbacks and function factories
- Analyze how arrow functions capture the enclosing this value lexically and evaluate scenarios where arrow functions versus regular functions produce different behavior
Scope, Closures, and this
- Explain lexical scoping, the scope chain, and how closures capture variables from their enclosing lexical environment
- Implement closures for practical patterns including data privacy, memoization, and partial application of function arguments
- Analyze the this keyword binding rules across global context, object methods, arrow functions, and explicit binding with call, apply, and bind
- Implement the module pattern and immediately-invoked function expressions (IIFE) to create private scope and encapsulate state before ES modules
Iterators and Generators
- Implement generator functions using function* and yield to create lazy iterables that produce values on demand
- Describe the iterator protocol including Symbol.iterator and the next() method and explain how for...of consumes iterables
- Compare generator functions with array methods for processing large datasets and evaluate memory efficiency trade-offs of lazy versus eager evaluation
4
Objects and Arrays
3 topics
Object Fundamentals and Classes
- Describe object literal syntax including computed property names, shorthand methods, and shorthand property assignment
- Implement object manipulation using Object.keys, Object.values, Object.entries, Object.assign, and the spread operator for shallow cloning and merging
- Analyze the prototype chain and explain how property lookup, hasOwnProperty, and Object.create establish prototype-based inheritance
- Implement ES6 classes with constructors, instance methods, static methods, getters, setters, and extends for class-based inheritance
- Implement ES modules using import and export syntax including named exports, default exports, re-exports, and dynamic import() for code splitting
Array Methods and Manipulation
- Implement array creation methods and common mutating operations including push, pop, shift, unshift, splice, and sort with custom comparators
- Implement non-mutating array methods including map, filter, reduce, find, findIndex, some, every, and flat to transform and query collections
- Analyze the difference between shallow and deep copying of arrays and objects and evaluate techniques including structuredClone, JSON round-tripping, and spread for different scenarios
- Implement array destructuring with rest elements, default values, and swapping patterns to extract values concisely from function returns and API responses
Map, Set, and Weak Collections
- Describe the Map and Set collections and explain their advantages over plain objects and arrays for key-value storage and uniqueness constraints
- Implement Map and Set with iteration methods and explain when to prefer Map over plain objects for dynamic key collections
- Describe WeakMap and WeakSet and explain how weak references enable garbage collection of keys and their use in caching and private data patterns
- Implement Symbol as a unique property key and describe how well-known symbols like Symbol.iterator and Symbol.toPrimitive customize object behavior
5
DOM Basics
2 topics
DOM Selection and Manipulation
- Describe the Document Object Model tree structure and explain how HTML elements map to DOM nodes with properties, attributes, and methods
- Implement element selection using getElementById, querySelector, querySelectorAll, and getElementsByClassName and traverse the DOM using parentNode, children, and sibling properties
- Implement DOM manipulation by creating, appending, removing, and replacing elements using createElement, appendChild, removeChild, and replaceWith
- Implement inline style manipulation using element.style and classList methods (add, remove, toggle, contains) to dynamically change element appearance
Events and Event Handling
- Describe the event model including event types, the Event object, event bubbling, capturing, and the event propagation phases
- Implement event listeners using addEventListener with click, input, submit, keydown, and load events and remove listeners to prevent memory leaks
- Implement event delegation by attaching a single event listener to a parent element to efficiently handle events from dynamically created child elements
- Analyze the differences between preventDefault, stopPropagation, and stopImmediatePropagation and evaluate when each is needed for form handling and nested event scenarios
- Implement form handling by reading input values, preventing default form submission, and validating user input with custom validation logic before processing
6
Async Fundamentals
3 topics
Event Loop and Callbacks
- Describe the JavaScript event loop, call stack, microtask queue, and macrotask queue and explain how single-threaded execution handles asynchronous operations
- Implement callback-based asynchronous patterns using setTimeout, setInterval, and event-driven callbacks and identify the callback hell anti-pattern
- Analyze the execution order of synchronous code, microtasks (Promise callbacks), and macrotasks (setTimeout) to predict program output
- Describe the difference between microtasks and macrotasks and explain why Promise.resolve().then() executes before setTimeout with zero delay
Promises
- Describe Promise states (pending, fulfilled, rejected) and explain how then, catch, and finally handlers are chained for sequential async operations
- Implement Promise chains to sequence asynchronous operations including error handling with catch and recovery patterns
- Implement Promise.all, Promise.allSettled, Promise.race, and Promise.any to coordinate multiple concurrent asynchronous operations
- Implement the Promise constructor to wrap callback-based APIs into Promise-based interfaces for use with async/await code
Async/Await and Fetch
- Implement async functions and await expressions to write asynchronous code that reads like synchronous sequential logic
- Implement error handling in async/await using try-catch blocks and analyze how rejected promises propagate through async function call chains
- Implement the fetch API to make HTTP requests and process JSON responses using async/await with proper error handling for network failures and non-OK status codes
- Compare callback-based, Promise-based, and async/await patterns and evaluate the readability, error handling, and composability trade-offs of each approach
- Implement AbortController to cancel in-flight fetch requests and explain how abort signals propagate through async operations for timeout handling
- Analyze common async pitfalls including unhandled promise rejections, sequential versus parallel await, and the async function always returns a Promise behavior
Hands-On Labs
15 labs
~325 min total
Console Simulator
Practice in a simulated cloud console or Python code sandbox — no account needed. Each lab runs entirely in your browser.
Scope
Included Topics
- ES2024+ JavaScript syntax and semantics, variable declarations and scoping, primitive and reference types, type coercion, operators, control flow, functions (declarations, expressions, arrows), closures, scope chain, this binding, objects, arrays, Map/Set, ES6 classes, DOM selection and manipulation, event handling, event loop, callbacks, Promises, async/await, and the Fetch API
Not Covered
- Frontend frameworks (React, Vue, Angular, Svelte)
- Build tools and bundlers (Webpack, Vite, Rollup)
- TypeScript
- Node.js beyond basic runtime concepts
- Server-side rendering and SSR frameworks
- Web Components and Shadow DOM
- Service Workers and Web Workers
- WebSocket and real-time communication protocols
Ready to master JavaScript Fundamentals?
Adaptive learning that maps your knowledge and closes your gaps.
Subscribe to Access