Web Fundamentals

Taught by Alexandra Ackerman
Code available at https://github.com/newschool-webfundamentals
Presentations available at newschool-webfundamentals.github.io

Agenda

  • Introduction to numbers, operators, comparators and strings in JS
  • Introduction to variables in JS
  • Mad libs lab
  • Discuss homework

Last class we went over jQuery. Today I'd like us to focus on some JavaScript fundamentals.

By the end of today, you should be familiar with:

  • Numbers
  • Strings
  • Booleans
  • Operators
  • Comparators
  • Variables

Numbers

All numbers in JavaScript are treated as floating point numbers

Operators

  • + addition
  • - subtraction
  • * multiplication
  • / division

Comparison and Logical Operators

Returns a boolean value: True or False

Strings

A sequence of characters surrounded by quotation marks

Adding two strings together is concatination

You can also compare two strings using comparator operators

Now you know three data types in JavaScript.

  • Numbers: integers & floating points
  • Strings: characters in quotes
  • Boolean: true and false

But how do we manage and manipulate data?

Variables

JavaScript variables are containers for storing data values. It's a lot like algebra class.

You declare variables using the "var" keyword. The reason they are called variables is because they can change or be adapted over time.

Let's say we want a program to calculate the length and width of a triangle

length is 10, width is 5

We can break the problem down like we would a recipe

  • Make a variable with the value of length
  • Make a variable with the value of width
  • Multiply length and width to get the area

We use variables to "remember" the values and instructions of these scripts

Scripts frequently need to achieve the same goal even when they are run with different data, so variables can be used to represent values in your scripts that are likely to change.

Variables can be any of the data types we discussed today. They are containers for data.

You can redeclare the value of a variable, without using the keyword "var"

Quick note about viarble names

Let's expl how to use variables with a calculators lab

First step, we need to know the user's income. We'll focus on getting values from inputs later, but for now let's start with a simple variable

Then we want thirty percent of our income

Since this is the yearly income, we should divide it by number of months.

Finally, we want a message to show the person using the calculator

Functions are a block of code designed to run the same task multiple times. This brings our scripts together.

Demo & Lab