Intro to JavaScript

Values, Data Types, Variables

JavaScript: Where did this thing come from?

  • 1990s - Netscape, 10 days
  • 2000s - The Browser Wars
  • 2005 - jQuery
  • ~2010 - Front-End Frameworks
  • 2012 - Node.js

JavaScript: It's Everywhere

REPL: Read, Evaluate, Print, Loop

Type Code Here

Let's type some things in

> 5
5
> "Hello World"
'Hello World'

Type this

Get this

Type this

Get this

What's happening here?

Read

The REPL "Reads" what you typed in

Evaluate

It tries to evaluate it, turning it into a single value

> 5
> 5 + 5

10

What's happening here?

Print

The REPL "Prints" what it Evaluated

Loop

The whole thing starts over

> 5 + 5
10

Let's try it

> 5 + 5

> 5 * 6 + 10 * 7

> 44 / 4 * 11

> 55 * 5 * 5 * 5 * 5

> 55 % 10

Type these in

Let's talk about Data Types

Numbers

Strings

Booleans

Null

Undefined

1
5
3.14
5.26
1000000
"Hello World"

"Good to meet you"

"These are Strings"

"a"

"123"
true
false
null
undefined

Let's talk about Operators

Binary Operators (have two operands)

+ - / * %

Takes two numbers, makes another number

+

Takes two strings, puts them together

Takes two values, returns a boolean

> < == === != !==
Operator What it does
+ Adds two numbers, concatenates strings
- Subtracts two numbers
/ Divides two numbers
* Multiplies two numbers
% Divides two numbers, returns the remainder

Let's talk about Operators

Operator What it does
< Tests to see if one number is less than another
> Tests to see if one number is greater than another
== Tests to see if two values are the same
=== Tests to see if two values are the same, and the same type
!=, !== Tests to see if two values are not the same
&& Checks to see if two values are both true
|| Checks to see if at least one value is true

Let's talk about Operators

Let's try it!

> true && true

> true && false

> false && true

> true || false

> false || true

> 5 > 10

> 10 < 15

> 5 == 5

> "5" == 5

> "5" === 5

> 5 == "5" && "5" === 5

What happened?

Why does true && false give us false?

Why does "5" == 5 give us true? Why does "5" === 5 give us false?

Variables

Think of it like a box with a label

x

var x

"var" creates a box, then you give it a label

Variables - The Assignment Operator

x

var x = 5

5

When we use the assignment operator, we put something in the box

Variables - The Assignment Operator

var x = 5

x = 10

We can always reuse the box, but we lose the original value

5

x

10

Variables point to values

var x = 10

var m = 2

var b = 3

var y = m * x + b



var text = "Anyone remember algebra?"
Name Value
x 10
m 2
b 3
y 23
text Anyone remember algebra?

Intro to JavaScript

By LizTheDeveloper

Intro to JavaScript

  • 1,796

More from LizTheDeveloper