JavaScript All-in-One For Dummies

Title Page
Copyright Page
Table of Contents
Introduction
Why This Book?
JavaScript is a huge topic
How this book is different
Learn JavaScript as it’s used
Understand similarities between the most popular libraries
Adapt to new technologies
Conventions Used in This Book
Foolish Assumptions
Icons Used in This Book
Beyond the Book
Where to Go from Here
Book 1 JavaScript Fundamentals
Chapter 1 Jumping into JavaScript
JavaScript, the Basics
JavaScript is a programming language
A look at programming language levels
Machine code is processor-specific
High-level languages are abstractions
Compilation makes programs portable
A short and epic history of JavaScript
The two superpowers
The early battles
Eich is back with a brand-new invention
Imitation is the sincerest form of flattery
The long road to standardization
How JavaScript changes
Reading and Copying JavaScript Code
How the web works
Front end and back end
The front end is open, the back end is closed
The value of a service
JavaScript on the server
Starting Your Development Environment
Installing Visual Studio Code
Learning to use Visual Studio Code
Creating a new project
Learning the one essential command
Writing Your First JavaScript Program
JavaScript is made of statements
JavaScript is case-sensitive
JavaScript ignores white space
JavaScript programmers use camelCase and underscores
camelCase
Underscore
Dashes
Running Code in the Console
Rerunning Commands in the Console
Running Code in a Browser Window
Running JavaScript from HTML event attributes
Running HTML inside script elements
Including JavaScript files in your HTML
Chapter 2 Filling Your JavaScript Toolbox
Installing Node.js
Configuring Visual Studio Code
Getting prettier
Installing Live Server
Documenting Your Code
Line comments
Block comments
The README file
The basics of Markdown
Coding Responsibly with Git
Introducing Git
Installing Git
Configuring and testing Git
Learning the basics of Git
Moving forward with Git and GitHub
Chapter 3 Using Data
Making Variables with let
Declaring variables
Initializing variables
Using variables
Naming variables
Making Constants with const
When to use constants
Naming constants
Taking a Look at the Data Types
JavaScript is loose and dynamic
Passing by value
String data type
Escaping characters
Creating strings with template literal notation
Working with string functions
Number data type
Working with number functions
Knowing when to convert between strings and numbers
bigInt data type
Boolean data type
Converting to Boolean
Getting Truthy and Falsy
NaN data type
Undefined data type
Symbol data type
Wrangling the Object: The Complex Data Type
Examining the Array — a Special Kind of Object
Getting a Handle on Scope
Chapter 4 Working with Operators and Expressions
Building Expressions
Operators: The Lineup
Operator precedence
Using parentheses
Assignment operators
Comparison operators
Arithmetic operators
Concatenation operator
Logical operators
Combining operators
Other Operators
Chapter 5 Controlling Flow
Choosing a Path
if . . . else statements
Multiple paths with if else
The ternary operator
Switch statements
Making Loops
for loops
for . . . in loops
for . . . of loops
while loops
do . . . while loops
break and continue statements
Chapter 6 Using Arrays
Introducing Arrays
Creating Arrays
Using the Array() constructor
Using array literal notation
Using the split function
Accessing Array Elements
Modifying Arrays
Deleting Array Elements
Programming with Array Methods
Pushing and popping
Shifting and unshifting
Slicing an array
Splicing an array
Looping with Array Methods
Passing callback functions to array methods
Reducing an array
Mapping an array
Filtering arrays
Destructuring Arrays
Spreading Arrays
Chapter 7 Making and Using Objects
Objects: The Basics
Creating Objects
Making objects using literal notation
Making objects using a constructor function
Making objects with class
Making objects with Object.create()
Modifying Objects
Using dot notation
Using square brackets notation
Comparing and Copying Objects
Understanding Prototypes
Deleting Object Properties
Chapter 8 Writing and Running Functions
Functions: An Introduction
Using Top-level functions
Using methods of built-in objects
Passing by value
Passing by reference
Writing Functions
Naming functions
Passing arguments
Using rest parameters
Using the arguments object
Passing functions as arguments
Setting default parameters
Writing a function body
Returning data
Using a return value as an argument
Creating conditional code with return
Function declaration scope and hoisting
Declaring Anonymous functions
Defining function expressions
Writing anonymous functions as arrow functions
Simplifying arrow functions
Knowing the limits of arrow functions
Arrow functions don't have this
Arrow functions don't have the arguments object
Writing Methods
Understanding Context and this
Passing an object to a function
Setting the context of a function
Using call()
Using apply()
Using bind()
Passing a function from one object to another
Passing a function to a child to change the parent
Chaining Functions
Chapter 9 Getting Oriented with Classes
Encapsulation
Abstraction
Inheritance
Polymorphism
Base Classes
Recognizing that classes aren’t hoisted
Using class expressions
Making instances of base classes
Derived Classes
Constructors
Properties and Methods
Creating methods in a class
Overriding methods in a derived class
Defining methods, properties, and fields
Public members
Private members
Static members
Practicing and Becoming comfortable with Classes
Chapter 10 Making Things Happen with Events
Understanding the JavaScript Runtime Model
Stacking function calls
Heaping objects
Queuing messages
The Event Loop
JavaScript is single-threaded
Messages run until they’re done
Listening for Events
Listening with HTML event attributes
Listening with Event handler properties
Using addEventListener()
Selecting your event target
Setting addEventListener()’s parameters
The Event object
Listening on multiple targets
Dispatching events programmatically
Triggering built-in events
Creating and triggering custom events
Removing event listeners
Preventing default actions
Chapter 11 Writing Asynchronous JavaScript
Understanding Asynchronous JavaScript
Reading synchronous code
Events to the rescue
Calling you back
Making Promises
Writing promises
Introducing async functions
Converting nested callbacks to async functions
Converting promise chains to async functions
Handling errors with async/await
Using AJAX
Getting data with the Fetch API
Getting a response with fetch()
Parsing the Response
Calling other Response methods
Response.blob()
Response.text()
Handling fetch() errors
The fetch init object
Introducing HTTP
The request method
HTTP status codes
Making requests with CORS
Making a simple request
Making a non-simple request
Working with JSON data
Getting JSON data
Sending JSON data
Chapter 12 Using JavaScript Modules
Defining Modules
Exporting Modules
Named exports
Default exports
Importing Modules
Importing named modules
Importing default modules
Renaming Exports and Imports
Importing a Module Object
Loading Dynamic Modules
Importing Modules into HTML
Book 2 Meet Your Web Browser
Chapter 1 What a Web Browser Does
Interfacing with a Browser
Introducing the Browser Engine
The Rendering Engine
The JavaScript engine
Identifying and preventing render blocking
Unblocking your code with async and defer
Networking
Data storage
Chapter 2 Programming the Browser
Understanding Web APIs and Interfaces
Hooking into interfaces
Built-in browser APIs
Custom APIs
Getting Around the Navigator
Inspecting the navigator’s quirks
Navigator properties
Stealing a Glimpse Through the Window
Window properties
Window methods
Introducing the HTML DOM
Document properties
Document methods
Selecting element nodes
Selecting with getElementById()
Selecting using selectors
Creating and adding elements to the DOM
Element nodes
Element methods
Knowing Your History
Book 3 React
Chapter 1 Getting Started with React
Understanding ReactJS
Distilling “Thinking in React”
Building a React UI
Step 1: Design the component hierarchy
Step 2: Build a static version in React
Step 3: Identify the state
Step 4: Determine where the state should live
Step 5: Implement inverse data flow
React is component-based
React is declarative
React is just JavaScript
Initializing a Project with Vite
Introducing Vite
Launching the VS Code terminal
Touring the structure of a React app
node_modules
public
src
.gitignore
package-lock.json
package.json
vite.config.js
Modifying a React project
Introducing ReactDOM and the Virtual DOM
Chapter 2 Writing JSX
Learning the Fundamentals of JSX
JSX is not HTML
JSX is XML
Transpiling with Babel
Writing HTML output with JSX
Using built-in components
Attributes that are different in JSX
JSX uses camelCase
JSX must be valid XML
Using JavaScript Expressions in JSX
Conditionally Rendering JSX
Conditional rendering with element variables
Conditional rendering with &&
Conditional rendering with the conditional operator
Making a List
Styling React Apps and Components
Adding global styles
Using local styles
Using the style attribute
Using style objects
Making style modules
Other style strategies
Chapter 3 Building React Components
Thinking in Components
Designing your own elements
Returning valid values
Recognizing the Two Types of Data
Props
Getting reactive with state
How state enables reactivity
Function Components
Functions are stateless
Introducing useState()
Class Components
The Component Lifecycle
The mounting methods
Kicking it off with the constructor
Getting the derived state
Rendering the output
Finishing the mount
The updating methods
Optimizing with shouldComponentUpdate()
Getting a snapshot
Finishing the update
Unmounting a component
Using the Lifecycle in Function Components
Running effects less often
Performing an effect on unmounting
Composing Components
How inheritance works in object-oriented programming
Composition using explicit props
Composition using the children prop
Composition with custom hooks
Chapter 4 Using Data and Events in React
Event Handling in React
Using event attributes
Dispatching Synthetic Events
Specifying a handler function
Passing arguments to an event handler
Passing functions as props
Defining event handlers in class components
Defining methods using arrow syntax
Passing event handler functions from function components
Making Forms with React
Using controlled inputs
Using uncontrolled forms
Book 4 Vue
Chapter 1 Getting an Overview of Vue
Comparing Vue to React
Scaffolding Your First Vue.js Application
Bootstrapping with vue-create
Installing Volar
Exploring the structure of a Vue app
Going to the src
Mounting a Root Component
Configuring an app
Mounting multiple apps
Exploring Vue's Two Styles
The Options API
The Composition API
Deciding which API to use
Installing Vue DevTools
Chapter 2 Introducing Vue Components
Introducing the Single-File Component
The script element
The setup() function
The setup shortcut
Naming Components
Following the Component Lifecycle
onMounted()
onUpdated()
onUnmounted()
onBeforeMount()
onBeforeUpdate()
onBeforeUnmount()
onErrorCaptured()
Handling Errors in Components
Chapter 3 Making Vue Templates
Writing HTML Templates
Using JavaScript in Templates
Calling functions
JavaScript in templates is restricted
Using globals in templates
Introducing Directives
Built-in directives
Directive shorthand names
Passing arguments to directives
Dynamic arguments
Directive modifiers
Custom directives
Conditional Rendering
Conditional rendering with JavaScript
Conditional rendering using directives
Using v-show
Using v-if, v-else, and v-else-if
Rendering Lists
Using v-for with numbers and strings
Using v-for with objects
Using v-for with arrays
Specifying a key
Composing with Slots
Specifying fallback content
Naming slots
Adding Style to Components
Global CSS
Scoped CSS
Multiple style blocks
CSS modules
v-bind in CSS
Chapter 4 Using Data and Reactivity
Passing and Using Props
Defining props with