Vanilla JS With Examples

Introduction

• Variables & data types
• Operations & expressions
• Functions & scope
• Arrays & Objects
• Conditional statements & loops

DOM manipulation

• Getting elements in the DOM
• Looping through arrays and objects
• Getting, setting, and removing classes
• Manipulating styles
• Getting and setting attributes
• Listening for events in the DOM

Strings, Arrays, and Objects

• Removing whitespace from a string
• Transforming text to uppercase and lowercase
• Converting strings to integers
• Replacing a portion of text with different text
• Getting a portion of a string
• Splitting a string into an array based on a character
• Adding items to an array or object
• Merging two or more arrays or objects together
• map, filter, reduce

DOM Injection

• Detecting when the DOM is ready
• Adding text and HTML to an element
• Creating new elements
• Removing elements from the DOM

DOM Traversal

• Climb up and down the DOM
• Filter nodes by selectors
• Detect when an element is in the viewport
• Calculate distances to the top of the bottom of the viewport

Browser Storage

• Cookies
• The localStorage and sessionStorage APIs
• Storing arrays and objects
• Expiring localStorage data
• Query strings

APIs and JavaScript Security

• Common HTTP methods
• Calling API endpoints with XHR
• Transforming API response data
• API authentication js
• Third-party data and XSS attacks

Writing Plugins

• Code structure and design
• Settings and user options
• Events and callbacks
• JS Modules

Async Operations

Event Loop

Observables