Modern Javascript for Beginners 2020 + Javascript Projects

Learn to build a web page with HTML structure (head, title, body, paragraph) and a script at the end of the body to manipulate elements, add forms, and interactive buttons.

set up a real world web project in brackets by creating html, javascript, and css files and using live preview to see changes in real time.

Open the Chrome developer tools, navigate to the console to test code, log values with console.log for intermediate outputs, and read error messages with line numbers to debug safely.

Understand JavaScript statements as the building blocks of code structure, where each line performs one action, ends with a semicolon, and differs from comments.

Learn to write JavaScript comments to explain code, using // for single-line and /* */ for multi-line, knowing comments aren’t executed or shown in the browser.

Learn to output in JavaScript by using the Document Object Model (DOM) to write statements that display strings on the page and show results in the console.

Enable strict mode with 'use strict' to activate ES5 and modern JavaScript. Place it at the top of your script to apply globally.

Explore how variables, declared with let, act as named storage in JavaScript, holding numbers, strings, booleans, and user input for dynamic programs and real-world examples like a shopping cart.

Explore reserved words and keywords in JavaScript, learn why you cannot use them in variable declarations, and diagnose syntax and strict mode errors in the console.

Examine how var created variables in JavaScript before 2015 and why developers moved to let for better scope. Learn about strict mode, declaring variables, and preferring English names for readability.

Learn how constants in JavaScript stay fixed, using const to declare values that cannot be reassigned. Contrast with let for changeable variables; some programmers use all caps for constants.

Learn how to declare and assign variables with strings, numbers, and booleans, use camel casing for multi word names, and log values to the console.

Learn how JavaScript uses dynamic data types, letting a variable hold different types. Explore infinity and NaN, and how 1/0 yields infinity while other non-numeric results become NaN.

Explore string literals in JavaScript using double quotes, single quotes, and backticks (ES6), learn concatenation, embedding variable values with backticks, and perform simple calculations and booleans in outputs.

Explore complex data types in JavaScript by examining arrays and objects, learn how arrays hold multiple values and how objects store properties and values.

Explore the typeof operator to determine a variable’s data type in JavaScript. See how numbers, strings, booleans, and expressions affect type, including empty strings, and nested expressions, with console.log outputs.

Explore undefined and null in JavaScript: uninitialized variables have type undefined and may later receive a value, while null represents nothing alongside primitive types and objects.

Explore type conversion in JavaScript, a dynamic language, using predefined type conversion functions and the string function to turn numbers and booleans into strings.

Use the Number() function to convert strings and values to numbers, trim spaces, respect case sensitivity, and apply true to 1, false to 0, with NaN for invalid conversions.

Learn Boolean conversion in JavaScript by turning numbers and strings into true or false with the Boolean function, and identify truthy and falsy values.

Learn how to display outputs in JavaScript using alert, prompt, and confirm boxes, with examples of concatenating strings, using variables, and basic user input.

Master the assignment operator in JavaScript by using the = sign to assign and reassign values to let variables, explore declaring multiple variables, and inline declaration and assignment.

Explore basic JavaScript calculations and outputs using core mathematical operators—addition, subtraction, multiplication, division, modulus, and exponentiation—while learning variable assignment, reassignment, prompts, and dynamic, real-time results.

Learn to build complex operations in JavaScript using compound assignment operators like +=, -=, *=, /=, and %=, and see how to reduce expressions with a console log.

Explore increment and decrement operators in JavaScript, including post and pre forms, and how assignment order affects variables like a and b during left-to-right evaluation.

Learn how the plus operator concatenates strings in JavaScript, not adds numbers, and how string concatenation behaves with precedence, left-to-right evaluation, and parentheses.

Explore JavaScript comparison operators, learn value versus type comparisons using == and ===, and see boolean results for equality and strict equality with numbers, strings, and booleans.

Explore javascript comparison operators, focusing on not equal to and strictly not equal to, and learn how value and type influence equality checks.

Explore comparison operators in JavaScript, including greater than, less than, and their equal variants, and apply them in if statements to control program flow.

Explore how string comparisons work in javascript, covering equal, greater than, and less than. See how ASCII and Unicode values influence multi-character strings.

Explore how JavaScript compares different types using equal and triple equal operators, and how numeric strings and empty strings convert to numbers in relational comparisons.

Explore how logical operators—and, or, not—work with comparison operators to produce true or false results, using parentheses and examples to evaluate complex expressions.

Learn the ternary operator in JavaScript to conditionally assign values using the syntax condition ? valueIfTrue : valueIfFalse, as shown with age outputs like toddler or grown up.

Explore operator precedence in JavaScript, mastering how parentheses set execution order, left-to-right evaluation, and the effects of postfix and prefix operators and the logical not.

Explore JavaScript strings: use single or double quotes, backticks for template literals and multi-line text, escape characters with backslashes, and perform string concatenation and embedded expressions.

Learn how to create strings as objects in JavaScript using new String(), compare them with primitive strings, and understand value versus type in strict equality.

Learn how to work with strings in JavaScript by computing length, finding indices of characters or substrings, and using indexOf and lastIndexOf with case sensitivity and search start positions.

Learn the JavaScript search method, which finds the first occurrence of a substring and supports regular expressions, unlike indexOf, which does not take a second parameter.

Explore the string slice method in JavaScript, extracting a substring by start and end indices, with end-exclusive behavior and support for negative indices from the string end.

Learn string methods in JavaScript, focusing on substring and substr, compare start-end indices versus length, and note that substring rejects negative indices while substr accepts them.

Master the javascript string replace method to substitute substrings and reassign results. Learn to use regular expressions for case-insensitive and global replacements, including handling first occurrences.

Explore string methods in javascript by converting between lower case and upper case with to lower case and to upper case, and by concatenating strings using the concat method.

Discover how the JavaScript trim method removes leading and trailing spaces from a string, with no parameters, without affecting spaces inside.

Explore JavaScript string methods to find a character at a position with charAt, get its code with charCodeAt, and split or join strings into arrays.

Explore using numbers in JavaScript, including integers and floating point numbers, exponential notation for large or small values, and how precision limits affect arithmetic, and fixes like scaling by 10.

Explore how plus either concatenates or adds based on strings and numbers, observe left-to-right evaluation, and see that other operators perform math on numeric strings, with isNaN detecting non-numeric values.

Learn how hexadecimal and octal prefixes affect number interpretation, understand browser numeric limits for integers and floating points, and explore JavaScript infinity and NaN behavior through examples.

Create numbers as objects in JavaScript with new Number, compare them to primitive numbers using typeof and strict equality, and learn that distinct number objects remain unequal despite identical values.

Convert numbers to strings in JavaScript using the toString method, displaying decimal, hexadecimal, octal, and binary formats. See 50 convert to each base and verify the result is a string.

Explore the exponential method in JavaScript, converting numbers to exponential notation with a chosen number of decimal points, using e for the exponent and understanding rounding and strings.

Master toFixed and toPrecision to control decimal length and precision, understand their string outputs, rounding rules, and how to convert results back to numbers.

Convert strings back to numbers with the number method before calculations. Date values convert to milliseconds since 1970, while booleans map to 1 or 0 and non-numeric strings yield NaN.

Understand how parseInt and parseFloat convert strings to numbers. ParseInt truncates decimals and returns NaN if a letter starts the string; parseFloat preserves decimals and stops at non-numeric characters.

Explore JavaScript number properties, including max value, min value, infinity, and not a number, and learn finite and integer checks that return a new value without mutating the original.

Explore conditional statements, including if and switch, to run code based on true or false conditions. Learn to structure if blocks with braces and test comparisons using logical operators.

Learn to use else if statements in JavaScript to test multiple conditions, chain if-else blocks, and handle final cases with a concluding else, including syntax nuances.

Master the switch statement as a multi-case conditional. Use cases, breaks, and a default to control flow, with input conversion from prompts.

Discover how JavaScript loops repeat statements using the for loop's initialization, condition, and increment. See an example that prints numbers 1 to 5 while the condition holds.

Explore advanced for loop patterns in JavaScript, including initializing outside the loop, multiple variables, and optional conditions, with examples of increment, decrement, and using break to prevent infinite loops.

Explore the while loop in JavaScript, compare it to the for loop, learn initialization outside, condition inside, increment inside, and how to convert between loop types when appropriate.

Learn to use the do-while loop, including its do-first execution, initialization, block, and trailing while condition, and compare it to the while loop.

Explore break and continue statements in loops and switches. See how break exits loops, how continue skips iterations, and how labels enable breaking out of a code block.

Explore arrays in JavaScript by creating and accessing elements with brackets or new Array, understand zero-based indices and length, and add elements or mix data types in a single array.

Learn how to create arrays as objects in JavaScript, avoid using the new Array method and initialize with square brackets, and check array types with Array.isArray and instanceof Array.

Learn how to loop through an entire array with a for loop, initialize a sum to zero, and accumulate the total by adding each element using the array length.

Learn how the JavaScript array length property reveals the number of elements, accessed as array.length with no parentheses, and guides dynamic iteration, including using length-1 for the last element.

Explore core array methods in javascript, including push and pop for adding and removing elements, and convert arrays to strings with toString and join using custom separators.

Explore how to create two-dimensional arrays in javascript by nesting arrays within arrays to store values. Learn to access elements with indices and manipulate data with push, pop, and join.

Explore the JavaScript date object, create current date and time with new Date(), and display it in the user’s browser time zone; learn zero-based months and customizing output formats.

Explore JavaScript's math object with its properties and methods, including pi, rounding, ceiling, floor, truncation, power, and square root, to simplify math in code.

Explore JavaScript math object methods such as Math.abs, sin, cos, log, min, max, and random. Learn to convert decimals to integers using floor and ceiling for common ranges.

Learn how JavaScript functions encapsulate reusable blocks of code, defined by a function declaration and invoked with a function call to run the code.

Learn to define a function that accepts two numbers as parameters, returns their sum, and demonstrate calling it with literals or variables to use the returned value.

Explore how local variables live inside functions and how function, block, and global scopes govern access, with examples showing access errors and variable behavior across scopes.

Harness default parameter values in JavaScript to provide fallbacks for missing arguments, including numbers, strings, booleans, and function calls, and learn how an empty return stops execution.

Learn to return multiple lines and values from a JavaScript function by wrapping in parentheses and using backticks or concatenation, with the return starting on the same line.

Explore function expressions, or anonymous functions, in JavaScript by assigning a function to a variable, and compare them to function declarations, including differences in hoisting and block scope.

Learn to create self-invoking functions using function expressions and anonymous functions in JavaScript, by wrapping the function in parentheses and invoking with trailing parentheses.

Learn how arrow functions in ES6 shorten JavaScript function definitions, using fat arrows, with single-parameter rules, one-line syntax, and the need for parentheses for multiple parameters.

Learn to use the arguments object inside a function to access all passed parameters as an array with arguments[i] and arguments.length, enabling you to sum many values efficiently.

Learn recursive functions by substituting loops with self-calling logic, using a base case to sum numbers 1 to n, and see how recursion underpins data structures and common coding interviews.

Learn to spread an array into function arguments with the spread operator, passing items as separate parameters. Use it with Math.max, Math.min, and array combinations.

Discover rest parameters, using three dots in the function definition to accept any number of arguments and collect them into an array for iteration.

Explore how to schedule function executions in JavaScript using setTimeout and setInterval, pass arguments, and cancel timeouts with clearTimeout, including timer identifiers.

Learn how to use setInterval to schedule repeated function executions, including stopping with clearInterval, with examples like timers and hourly backups.