Intro to Programming

using JavaScript

Created by aaron cruz / @mraaroncruz

Overview of Programming

Programming is basically

• Types
• Variables
• Lists
• Objects
• Functions
• Loops
• Control Flow
• Expressions

Variables

A variable is a named place where you can store information you can use later

Example

Storing numbers for addition

Demonstration

Arrays (Lists)

An ordered list of data that can be accessed by index. Index starts at zero.

Example

List of users; Temperatures for the week

var users = ["Bob", "Lisa", "Aaron"];
alert(users[0])
// => alerts "Bob"

Demonstration

Objects (Hashes, Dictionaries)

A data structure based on keys and values. Keys must be strings but values can be any of the other Types.

Example

Any complex data structure.

• state of game
• users

• data returned from external service e.g. Twitter, Weather

  var bob = { firstName: "Bob", lastName: "Smith", phone: "333444343"}; alert(bob.firstName); // => alerts 'Bob'

Demonstration

Functions

A piece of code that performs a task

Example

Adding two numbers together; Trahsforming a list of data.

function addTwo (n) {
  alert(n + 2)
}
addTwo(4);
// => alerts 6

or return a value

function addTwo (n) {
  return n + 2;
}
var newValue = addTwo(4);
alert(newValue);
// => alerts 6

Demonstration

Loops

A variable is a named place where you can store information you can use later

for

takes as arguments

Example

for (var i = 0; i < 10; i += 1) {
  alert(i);
}

while

Example

Storing numbers for addition

Demonstration

Control Flow

Your code making decisions

if/else

If this is true, then do something, otherwise do something else

Example

Act on received data, only if you really received data

var n = 4;
if (n === 3) {
  alert("there is a problem here");
} else {
  alert("At least it doesn't equal 3"
}

Demonstration

Hello World example

// save the "Hello World!" string in a variable named 'hello'
var hello = "Hello World!";

// built in JavaScript 'alert' pops up dialog in browser with it's argument
alert(hello);

JavaScript Documentation

Mozilla (Firefox) Javascript Developer Docs

https://developer.mozilla.org/en/docs/JavaScript

Or in Spanish!

https://developer.mozilla.org/es/docs/JavaScript

THE END

By aaron cruz / @mraaroncruz