# Exploring Basic JavaScript
First, the weird history of JavaScript
Javascript is a flexible language. This can be helpful or confusing depending on how look at it. Some of JS is imperative (for loops) and some is declarative (array methods). This will make sense later.
In this class, we'll learn through tutorials and live coding sessions. They will be feature-driven as opposed to language-driven. We will also start with vanilla JavaScript without jQuery to avoid any confusion. We'll introduce libraries formally in later classes—but if you are comfortable, feel free to use them now.
# Recap
With Simone, you've learned:
- How to include a
scriptvia a tag in yourhtmlfile, or as an external script linked from yourhtmlfile (very similar to CSS in<head>vs. external stylesheet) - The console and
console.logmethod - Primitives like strings, numbers booleans, objects, and arrays
- How to define a variable
- Operators (+, –, etc.)
- Indexing an array (
myArray[0]) - Functions
!! What is everyone confused about so far? !!
# Let's do a walk through of dynamic content manipulation in JavaScript
# Objectives to cover over the next two weeks:
- Manipulating existing static content vs. generating dynamic content
- Static content = elements written in
HTMLmanually - Dynamic content = using data (i.e., a list of image sources) to create
HTMLelements
- Static content = elements written in
- Randomizing
- Using HTML elements with JavaScript like buttons, sliders, dropdowns, etc.
- How to use someone elses code + code commenting (learn how to NOT plagiarize!)
# What parts of the language we need to learn to meet our objectives:
- Selecting elements from the document (HTML = document)
- working with array and (maybe) objects
- using JavaScript's built-in array methods manipulate and generate content
- What's the difference between iteration with a method and looping? Why use one vs. the other?
- setting the
innerHTMLof an element to set your generated/manipulated content - template literals
Math.random()and array shuffling for randomization- JavaScript events like onClick
In-Class Code
Check at the README file on Andrew's Site for our in-class coding examples. I'll maintain this throughout the semester so be sure to check when you need help remembering what we did in class