Animations

• Basic Example

API

• Google Maps
• Validation API
• Validation API Example

Arrays

• Array Methods
• Array Add Using length()
• Array Properties
• Basics
• Get values examples
• concat()
• destructuring
• fill()
• filter()
• find()
• foreach()
• includes()
• indexOf()
• isArray()
• join()
• map()
• pop()
• push()
• reduce()
• reverse()
• shift()
• slice()
• some()
• sort()
• splice()
• Spread
• toString()
• valueOf()

Async

• Basics
• fetch()
• await

Basics

• Basics
• Best Practices
• Break Reference Label
• Common DOM Properties
• Constructor Property
• Defer
• Escape Characters
• Keywords
• Operators
• Regions
• Scopes
• Ternary Operator
• Truthy & Falsy
• Value Of
• VS Code

Challenges

• even numbers using map()
• Aggregate Array

Classes

• Basics

Console

• Console Examples

Dates

• Date Formats
• Date Get Methods
• Date Methods
• Date Set Methods
• Instantiating New Date
• Time Zones
• Converting UTC to Local

Debugging

• Basics
• Console
• Debugger
• Strict Mode
• Try Catch

DOM Elements

• Accessing DOM Elements
• Adding DOM Elements
• Deleting DOM Elements

DOM Methods

• common methods
• document ready
• getElementByClassName()
• getElementById()
• getElementByTagName()
• querySelectorAll()
• setAttribute()

DOM Navigation

• Basics
• child nodes
• children
• create new nodes
• remove child
• replace child
• root nodes

DOM Properties

• Changing Properties
• Cookie Property
• innerHTML and innerText

Event Listeners

• addEventListener
• addEventListener to multiple tags
• onchange
• onclick
• Events
• onmouseover - onmouseout
• onmouseup - onmousedown
• onclick vs click
• onblur - onfocus
• onload
• onunload
• preventDefault

Flow Control

• for loops (various)
• while loops (various)

Forms

• Loop thru form controls
• preventDefault()
• Setting form controls

Functions

• Anonymous Functions
• Arguments
• Arrow Functions
• Functions are objects
• Function Expressions
• "IIFE" Functions
• Invoking vs Calling
• Reference Example
• Recursive vs Non Recursive
• Scope of Arrow Functions
• Self Invoking Functions

Global Functions

• Boolean()
• Common Global Functions
• encodeUri() - decodeUri()
• eval()
• IsNan()
• Number()
• parseFloat()
• parseInt()
• Type conversions

JSON

• Basics
• JSON.parse()
• JSON.stringify()

Keywords

• const
• return
• this

Libraries (3rd party)

• shuffle()

Math

• Common Math Functions
• floor()
• min() / max()
• random()
• round()
• toFixed()
• toPrecision()

Modules

• Modules Basics
• Named Exports
• Export Default
• Aggregating Exports
• Importing
• Module Demo

Objects

• Adding / Deleting Object Properties
• Assign (cloning)
• Built In Constructors
• Creating a new Object
• Comparing Objects
• Constructors
• Delete A Property
• Destructuring and Spreading
• Functions in Objects
• Looping Thru Properties
• Object Literals
• Properties

Snippets

• IsDate
• IsNumeric
• LeftPad

String

• charAt() / charCodeAt()
• indexOf()
• lastIndexOf()
• length
• RegEx Basics
• RegEx Example
• RegEx Patterns
• match()
• replace()
• search()
• slice()
• split()
• String Template Literals
• substring()
• toString()
• toUpperCase() / toLowerCase()

Types

• data types
• number
• typeof

Widgets

• Daily Earnings Clock

Window Object

• Browser Object Model
• Common Methods
• History Object
• Local Storage
• Location Object
• Navigator Object
• PopUps
• setInterval() / clearInterval()
• setTimeout() / clearTimeout() REDO THIS
• Window Inner Height / Inner Width
• Window Object
• Window Screen Object

// In HTML:
<element onchange="myScript"></element>

// In JavaScript:
object.onchange = function(){myScript};

// In JavaScript, using the addEventListener() method:
object.addEventListener("change", myScript);

function ShowColor()
{
    let colorList = document.getElementById("ColorList");
    let color = colorList.options[colorList.selectedIndex].text; //.value would get you the value and not the text

    let demo1 = document.getElementById("demo1");
    demo1.innerHTML = color;
}