Learn to Code With JavaScript

✍ Scribed by Darren Jones

• Publisher: SitePoint
• Year: 2021
• Tongue: English
• Leaves: 405
• Edition: 1
• Category: Library

✦ Synopsis

A hands-on, practical Introduction to coding!

Do you want to learn to code? Perhaps you want to learn how to build the next social media sensation or blockbuster game? Or perhaps you just want to get some valuable coding experience under your belt? This easy-to-follow, practical, and fun guide is the perfect place to start on your coding journey. You'll be learning to program with JavaScript - the most popular programming language on Earth. And it runs in web browsers, making it particularly suited to creating web-based apps and games. But the principles and techniques that you'll learn will provide you with a foundation to go on and learn many other languages, too.

You'll learn:

• Programming basics, including data types, variables and more
• How to use logic to control the flow of a program
• How to use loops to repeat code over and over again
• How to write functions that can be used to store code in reusable blocks
• How to store data in collections such as arrays, sets and maps
• How to create objects that store properties and actions
• And much more!

Along the way, you'll build a collection of fun applications, including games and interactive web pages. Start learning to code today!

✦ Table of Contents

Learn to Code with JavaScript
Notice of Rights
Notice of Liability
Trademark Notice
About Darren Jones
About SitePoint
Table of Contents
Preface
Who Should Read This Book?
Conventions Used
Code Samples
Tips, Notes, and Warnings
Hey, You!
Ahem, Excuse Me ...
Make Sure You Always ...
Watch Out!
Supplementary Materials
Press Start
Programming
Algorithms
Milk after Tea
Pseudocode
A Brief History of Programming
JavaScript
The History of JavaScript
JavaScript Versions
Backward Compatibility
Hello, World! Your First JavaScript Program
The Console?
Enter? Return?
JavaScript in the Browser
The Structure of a Web Page
Online Editors and Working Offline
I Can Code a Rainbow
Rebecca Purple
A Programmer’s Mindset
Challenges
Summary
Programming Basics
Comments
Programming Grammar
Statements
Ending Lines with Semicolons
Blocks
Whitespace
Data Types
symbol, bigint and undefined
Map and Set
What Type Are You?
Operators
Variables
Declaring and Assigning Variables
Duck Typing
TypeScript
Constants
Constants in JavaScript
Assignment
Undefined
Naming Variables
Symbols in Variable Names
Pop-up Interaction
Alert Box
Prompt Box
Confirm Box
Hello name
Auto-updating Preview
Challenges
Summary
Letters and Words
Chars and Strings
Empty Strings
Creating Strings in JavaScript
Escaping Values
Find the Char
Finding Chars
How Long Is a String?
String Arithmetic
The concat() Method
Finding the Last Character in a String
What’s In a Name?
Changing Cases
The More Things Change …
Trimming Space
More Methods
Template Literals
Mad Libs
Challenges
Summary
Numbers
Integers and Floats
Numeric Literals
Exponential Notation
When Is a Number Not a Number?
Arithmetic Operations
Varying Variables
Increments
How Old?
Calculations with Numbers and Strings
Converting Between Strings and Numbers
Random Numbers
Random … ish
More Methods
Challenges
Summary
Collections
Arrays
Arrays in JavaScript
Adding Values to Arrays
Removing Values from Arrays
Finding the Length of an Array
No Second Chances
Popping and Pushing
Shifting and Unshifting
The Spread Operator
Slicing and Splicing
Finding If a Value Is in an Array
Joining Array Items into a String
Reversing the Order of Array Items
Sorting Array Values
Alphabetical Numbers
More Methods
Multi-dimensional Arrays
Challenges
Summary
Logic
Booleans
Logical Operators
Guess Who?
Negation (Logical NOT)
Logical AND
Logical OR
Comparison
Equality
Soft Equality
Hard Equality
Inequality
Greater Than and Less Than
Flow Control
If Statements
Else Statements
The Ternary Operator
What’s Your Favorite Animal?
Switch Statements
Taking a break
Rock Paper Scissors
Challenges
Summary
Going Loopy
What’s a Loop?
Infinite Loops
While Loops
Ten Green Bottles
Do–while Loops
For Loops
Nested Loops
Loop Variables
Challenges
Summary
Functions
Subroutines, Procedures and Functions
Functions in JavaScript
Defining a Function
Calling Functions
Function Expressions
Assignment and Semicolons
Calling vs Referencing a Function
Arrow Functions
Return Values
Returning Undefined
Parameters and Arguments
Default Parameters
Random Integers
Assigning Return Values to Variables
Callbacks
Overwriting a Function Declaration
Sorting Arrays with a Callback
Sorting Through sort()
Choosing the Right Type of Function
Challenges
Summary
Objects
Properties and Methods
Creating Objects in JavaScript
Trailing Commas
Methods
Guess Again
Creating Objects from Variables
Properties and Methods
Calling Methods
Adding More Properties and Methods
Frozen Objects
Changing Properties
Removing Properties
Nested Objects
this
Roll the Dice
Challenges
Summary
The Document Object Model
The Document Object Model
HTML Document vs the DOM
Inspecting the DOM
Getting an Element
Updating the HTML
Getting Multiple Elements
Getting Elements by Tag Name
Getting Elements by Their Class Name
Get Element vs Get Elements
Query Selectors
CSS Selectors
Navigating the DOM Tree
Child Nodes
Parent Node
Creating Dynamic Markup
Creating an Element
Adding Text with textContent
Adding Elements to the Page
Building Elements Node by Node
Insert Before
Removing Elements from a Page
Gone but Not Gone
Replacing Elements on a Page
Getting and Setting Attributes
Getting an Element’s Attributes
Setting an Element’s Attributes
Multiple Classes and setAttribute
The className Property
Multiple Classes and className
The classList Property
Doing It with Style
Hyphens in CSS Property Names
Being Classy
A Simple To-do List
Challenges
Summary
The Main Event
Event-based Programming
Event Listeners
Event Handlers
Click Events
Clicking Elements
The Event Object
To e or Not to e?
Forms
Submitting a Form
Referencing a Form Element
A Form’s action Attribute
Preventing Default Behavior
Keyboard Events
Live Input
Mouse Events
Mouse Move
Mouse Over
Mouse Up and Down
Removing Event Listeners
Naming addEventListener Functions
Just a Basic Example
Simple To-do List
Event Delegation
Challenges
Summary
Going Loopy Over Arrays
Spreading Strings
Array Iteration Methods
Efficient Arrow Functions
forEach
An Array of Cards
Map
Reduce
Adding vs Multiplying
Filter
Guess Who Filter
Find
Every
Some
Iterating over Objects
Keys and Values
To-do List Project
Forking Pens
Challenges
Summary
Let’s Get Functional
Named Parameters
The Rest Parameter
Recursive Functions
Scope
Block Scope
Hoisting
Functions That Return Functions
Closures
Closure Countdown!
Functional Programming
Pure Functions
A Benefit of const
Pure Array Updates
Updating an Array Value with Pure Functions
Higher-order Functions
Challenges
Summary
Getting Classy
Copying Objects in JavaScript
Console Issues
Shallow and Deep Copies
Copying Arrays and Functions
Object-oriented Programming
Encapsulation
Polymorphism
Inheritance
Classes
Classes vs Prototypes
Classes in JavaScript
Class Naming Convention
Parentheses
Classy Components
Inheritance in JavaScript
Custom HTML Elements
The Pet Unicorn Game
Challenges
Summary
It’s About Time
The UNIX Epoch
Times and Dates
Counting the Months
Getter Methods
UTC vs GMT
Setter Methods
Time Zone Milliseconds
Date and Time Support
What Day Will It Be?
Timing Functions
setTimeout
Asynchronous Programming
Delay and Sleep
Intervals
requestAnimationFrame
Stopwatch
Animation
Jumping Frog
Cookie Grabber Game
Challenges
Summary
End Of Line
Coding Best Practice
Coding Tools
Style Guides
Version Control
Testing
Going Further with JavaScript
Advanced JavaScript
Libraries
Node.js
Deno
Learn Another Language
Always Learning
Carry On Coding
Web Applications
Game Development
Mobile App Development
Desktop App Development
Internet of Things
Challenges
Summary