JavaScript Web Developer Masterclass with NodeJS and ES6

Master how to build JavaScript objects with unique keys, attach functions, and use the constructor pattern with new to create reusable donut objects.

Explore how JavaScript stores data types using variables, arrays, and objects, with examples of numbers, strings, and key-value objects. Learn to use typeof, console log, and variable reassignment and counting.

Learn JavaScript variable naming rules, including reserved words and the no-start-with-number constraint; explore underscore prefixes, case sensitivity, and how variables can reference other variables or function results.

Understand how var is function-scoped in javascript and how let introduces block scope in ES6. See how variables behave inside and outside blocks and how let prevents unintended reassignment.

Explore const versus let by demonstrating block scoped constants, which cannot be reassigned, while showing how arrays and objects inside a const can still be mutated.

Learn the basics of the if statement in JavaScript: test a condition, run a block when true, and use comparison operators like === with console logs.

Master JavaScript comparisons: use triple equals for strict equality and operators like greater than, less than, and greater than or equal to, shown with bank balance, item cost, and tax.

Learn how nested if statements control flow, check balance against cost and tax, and understand scope with let, const, and var in JavaScript.

Explore how the return keyword gives a function’s computed value back to the caller, contrasting it with console.log, and see basic examples of doubling numbers, adding results, and function hoisting.

Examine how nested functions create closures, letting inner functions access outer variables while outer scope stays hidden. See how a funnel metaphor formats names and builds a data object.

Discover how primitive values are passed by value in functions, so original numbers and strings stay unchanged. Learn how objects and arrays can be mutated, altering the original data.

Explore how JavaScript handles an indefinite number of arguments with the old arguments object and the modern rest parameters, converting to arrays and applying a multiplier.

Learn how switch statements evaluate an expression, match cases with break, use strict equality, and apply a default catch-all to replace long if-else chains in JavaScript.

Implement a JavaScript switch mapping numbers to low, mid, and high ranges with a default, and build a set volume function that logs the range using triple equals.

Explore how to use a switch statement inside a function to return a donut flavor, then pass that return value to another function and log the selection.

Master loops in JavaScript by understanding how to repeat actions set number of times, exploring for, while, do while, and for in and for of loops, and avoiding infinite loops.

Explore the difference between do while and while loops in JavaScript through a purchase check. See how a total money variable, a check function, and console output drive the logic.

Learn to control loops in JavaScript using break and continue. Master for and while loops, and use labels to break or continue outer and inner loops.

Explore the for-of loop with arrays, strings, and other iterable objects, and see how sets remove duplicates using new Set(original array) while comparing iterations.

Learn to manipulate web page lists with getElementById, select list items by tag name, and update innerText using loops to change content dynamically.

Explore how to select multiple elements with querySelectorAll, use IDs and classes for precise styling, and apply styles via the DOM using a for loop and descendant selectors.

Use getElementById to grab an element by its id, inspect it in the console, and then reassign the id to a new value like bottom to see the dom update.

Remove elements from the DOM using removeChild, check direct children, and refactor into a reusable function that removes by type, demonstrated with a chocolate ice cream list.

Explore event propagation and bubbling, stop propagation with mouse events, and implement document-wide listeners to toggle backgrounds via dynamic class changes on targets.

Explore the common design pattern of event delegation by attaching a single click listener to a parent element and filtering events using the target node name.

Use the DOMContentLoaded event to run code after the HTML is loaded and parsed, without waiting for images. Attach an event listener to delay execution until the DOM is ready.

Adjust image styling with JavaScript by setting width and height auto to preserve proportions, using 500 pixels as an example. Leverage the load event and looping to resize images efficiently.