SlideShare a Scribd company logo
Introduction to
JavaScript #1
@danielknell
Basics
Basics
•Expressions
•Conditionals
•Loops
Expressions
Expressions
•Math and Numbers
•Strings and Concatenation
•Special
•Booleans and Comparison
•Functions
•Objects and Arrays
http://artsn.co/js-repl
Numbers and Math
42
42.5
× ÷ + −
Math
4 * 2;
4 / 2;
4 + 2;
4 - 2;
100 % 3;
99 + (9 / 9);
-3;
-(3+1);
Mathmagical
Take a 4 digit
number
e.g. 1234
Shuffle the digits
e.g. 2413
Subtract the smaller
from the larger
e.g. 2413 - 1234
Sum the digits of the
result
e.g. 566 → 5 + 6 + 6 → 1 + 7 → 8
Sum the digits of the
result
e.g. 566 % 8
0
Variables
Variables
var x = 5;
var y = 99 + (9 / 9);
var z = x * y;
More Math
var x = 5;
x++;
x--;
Strings and
Concatenation
Strings
"hello";
'world';
"hello" + "world";
Strings
"five plus two equals: " + (5 + 2);
Strings
var who = 'world';
var greeting = "hello" + who;
greeting[0]
Special
null
null
var x = null;
undefined
undefined
var x;
Boolean and
Comparison
True / False
False-ish
0
""
null
undefined
Boolean Math
true && true;
false || true;
!false;
Comparison
1 == "1";
1 != "2";
2 > "1";
1 < "2";
2 >= "1";
1 <= "2";
1 === 1;
1 !== "1";
Functions
Functions
function greet(who) {
return "hello" + who;
}
greet("world");
Functions
var greet = function(who) {
return "hello" + who;
}
greet("world");
Arrays and Objects
Arrays
var a = [1, 2, "three"];
a[0]; // 1
a[2]; // "three"
a.length; // 3
a[3]; // undefiend
Arrays
var a = [1, 2, "three"];
a.push("four");
a; // [1, 2, "three", "four"]
var last = a.pop();
a; [1, 2, "three"]
last; // "four"
var first = a.shift();
a; [2, "three"]
first; // 1
a.unshift("one");
a; ["one", 2, "three"]
Objects
var coords = { x: 1, "y": 2 };
coords["x"]; // 1
coords.y; // 2
coords.z; // undefined
{ var: 1 }
{ "var": 1 }
Conditionals
Conditionals
http://www.flickr.com/photos/blahflowers/4765476166
Conditionals
Conditionals
if the light is green
cross the road
else
stop
Conditionals
if (light === 'green') {
crossTheRoad();
}
else {
stop();
}
Conditionals
switch (light) {
case 'blue':
case 'green':
crossTheRoad();
break;
case 'red':
stop();
break;
default:
lookConfused();
}
Loops
Loops
http://www.flickr.com/photos/blahflowers/4765476166
Loops
Loops
while light is red
wait
cross the road
Loops
while (light === 'red') {
wait();
}
crossTheRoad();
Loops
do {
wait();
} while (light === 'red');
crossTheRoad();
Loops
for (var i = 0; i < 8; i++) {
potato(i);
}
more();
Loops
while (light === 'red') {
if (axeMurder === true) {
break;
}
wait();
}
crossTheRoad();
Loops
do {
wait();
if (light === 'flashing green') {
continue;
}
} while (light === 'red');
crossTheRoad();
Combined
Combined
http://www.flickr.com/photos/davelevy/7190079438
Combined
Combined
while light is not green
if light is red
wait
if light is amber
get ready
GO GO GO!
Combined
while (light != 'green') {
switch (light) {
case "red":
wait();
break;
case "amber":
getReady();
break;
default:
lookConfused();
}
}
goGoGo();
Complex Objects
Complex Objects
var person = {
name: "bob"
, greet: function() {
return "hi " + this.name + "!";
}
}
person.greet();
Complex Objects
var person = {
name: "bob"
, greet: function() {
return "hi " + this.name + "!";
}
}
console.log(person.greet());
Fizz Buzz
Fizz Buzz
•Count to 100 printing each number
•For numbers divisible by 3 print “Fizz”
instead
•For numbers divisible by 5 print “Buzz”
instead
•For numbers divisible by 3 and 5 print
“FizzBuzz” instead
Fizz Buzz
Fizz Buzz
•Count to 100 printing
each number
•For numbers divisible by
3 print “Fizz” instead
•For numbers divisible by
5 print “Buzz” instead
•For numbers divisible by
3 and 5 print
“FizzBuzz” instead
Thats All Folks
email: contact@danielknell.co.uk
twitter: @danielknell
website: http://danielknell.co.uk/

More Related Content

PDF
Formal Semantics of SQL and Cypher
PPTX
Rules of derivatives 2.2
DOCX
supporting t-sql scripts for Heap vs clustered table
TXT
Ass2 1 (2)
PDF
C6 6.3
PDF
Hidden loops
PDF
Removing structural duplication
PPTX
An introduction to javascript
Formal Semantics of SQL and Cypher
Rules of derivatives 2.2
supporting t-sql scripts for Heap vs clustered table
Ass2 1 (2)
C6 6.3
Hidden loops
Removing structural duplication
An introduction to javascript

Viewers also liked (20)

PPT
Java Script
PDF
An Introduction to JavaScript: Week 5
PPTX
The big bang theory of social recruiting
PPTX
The big bang theory - UNIT 2
PDF
Introduction to JavaScript: Week Two
PPTX
8. java script
PDF
An Introduction to JavaScript: Week 3
PDF
The Big Bang Theory: Nine Steps To Building Your Meetup Empire
PPT
JAVA SCRIPT
PDF
Unchallengeable miracle of Holy Quran
PDF
An Introduction to JavaScript: Week 4
PPTX
Introduction to Java Script
PPTX
Big Bang Theory
PPT
Java script -23jan2015
PPT
Chapter 1 - How the world begin
PPTX
Big Bang Theorychandler
PDF
Large-Scale JavaScript Development
PPTX
Qur’an and its sciences
PPT
The Quran and Computational Linguistics
PPT
Java script Learn Easy
Java Script
An Introduction to JavaScript: Week 5
The big bang theory of social recruiting
The big bang theory - UNIT 2
Introduction to JavaScript: Week Two
8. java script
An Introduction to JavaScript: Week 3
The Big Bang Theory: Nine Steps To Building Your Meetup Empire
JAVA SCRIPT
Unchallengeable miracle of Holy Quran
An Introduction to JavaScript: Week 4
Introduction to Java Script
Big Bang Theory
Java script -23jan2015
Chapter 1 - How the world begin
Big Bang Theorychandler
Large-Scale JavaScript Development
Qur’an and its sciences
The Quran and Computational Linguistics
Java script Learn Easy
Ad

Similar to An Introduction to JavaScript: Week One (20)

PDF
JavaScript for beginners
PPTX
Introduction to Client-Side Javascript
PPTX
Introduction to JavaScript
PPTX
CSC PPT 13.pptx
PDF
CoffeeScript
PDF
GeoGebra JavaScript CheatSheet
PDF
Handout - Introduction to Programming
PPT
Javascript
PPTX
Javascript 101
PPTX
JavaScript 1 for high school
PDF
Javascript 101 - Javascript para Iniciantes
PPTX
03. Week 03.pptx
PPTX
JavaScript Advanced - Useful methods to power up your code
PPT
Javascript
PPT
13665449.ppt
PPTX
Javascript best practices
PPTX
Learn java script
PPTX
JavaScript / Web Engineering / Web Development / html + css + js/presentation
KEY
JavaScript Neednt Hurt - JavaBin talk
PDF
JavaScript from Scratch: Getting Your Feet Wet
JavaScript for beginners
Introduction to Client-Side Javascript
Introduction to JavaScript
CSC PPT 13.pptx
CoffeeScript
GeoGebra JavaScript CheatSheet
Handout - Introduction to Programming
Javascript
Javascript 101
JavaScript 1 for high school
Javascript 101 - Javascript para Iniciantes
03. Week 03.pptx
JavaScript Advanced - Useful methods to power up your code
Javascript
13665449.ppt
Javascript best practices
Learn java script
JavaScript / Web Engineering / Web Development / html + css + js/presentation
JavaScript Neednt Hurt - JavaBin talk
JavaScript from Scratch: Getting Your Feet Wet
Ad

More from Event Handler (8)

PDF
Selling UCD: Getting buy-in and measuring the value of UX
PDF
Best Practice for UX Deliverables - 2014
PPT
From Chuck D to Chuck D: Evolution, Synthetic Biology and the History of Hip Hop
PPTX
Tumours and Tree Trunks - GeekyScience: Evolution
PDF
Best Practice for UX Deliverables
PPSX
The Missing Ingredient
PPTX
Productivity quickly
PPTX
Anna pickard geekyfinal
Selling UCD: Getting buy-in and measuring the value of UX
Best Practice for UX Deliverables - 2014
From Chuck D to Chuck D: Evolution, Synthetic Biology and the History of Hip Hop
Tumours and Tree Trunks - GeekyScience: Evolution
Best Practice for UX Deliverables
The Missing Ingredient
Productivity quickly
Anna pickard geekyfinal

Recently uploaded (20)

PPTX
Effective Security Operations Center (SOC) A Modern, Strategic, and Threat-In...
PDF
Chapter 3 Spatial Domain Image Processing.pdf
PDF
Encapsulation theory and applications.pdf
PDF
Build a system with the filesystem maintained by OSTree @ COSCUP 2025
PPTX
20250228 LYD VKU AI Blended-Learning.pptx
PDF
Reach Out and Touch Someone: Haptics and Empathic Computing
PDF
Optimiser vos workloads AI/ML sur Amazon EC2 et AWS Graviton
PDF
Mobile App Security Testing_ A Comprehensive Guide.pdf
PDF
Encapsulation_ Review paper, used for researhc scholars
PDF
Architecting across the Boundaries of two Complex Domains - Healthcare & Tech...
PDF
Spectral efficient network and resource selection model in 5G networks
PDF
MIND Revenue Release Quarter 2 2025 Press Release
PPT
Teaching material agriculture food technology
PPTX
VMware vSphere Foundation How to Sell Presentation-Ver1.4-2-14-2024.pptx
PDF
Per capita expenditure prediction using model stacking based on satellite ima...
PDF
Review of recent advances in non-invasive hemoglobin estimation
PDF
How UI/UX Design Impacts User Retention in Mobile Apps.pdf
PPTX
KOM of Painting work and Equipment Insulation REV00 update 25-dec.pptx
PDF
Empathic Computing: Creating Shared Understanding
PPTX
Digital-Transformation-Roadmap-for-Companies.pptx
Effective Security Operations Center (SOC) A Modern, Strategic, and Threat-In...
Chapter 3 Spatial Domain Image Processing.pdf
Encapsulation theory and applications.pdf
Build a system with the filesystem maintained by OSTree @ COSCUP 2025
20250228 LYD VKU AI Blended-Learning.pptx
Reach Out and Touch Someone: Haptics and Empathic Computing
Optimiser vos workloads AI/ML sur Amazon EC2 et AWS Graviton
Mobile App Security Testing_ A Comprehensive Guide.pdf
Encapsulation_ Review paper, used for researhc scholars
Architecting across the Boundaries of two Complex Domains - Healthcare & Tech...
Spectral efficient network and resource selection model in 5G networks
MIND Revenue Release Quarter 2 2025 Press Release
Teaching material agriculture food technology
VMware vSphere Foundation How to Sell Presentation-Ver1.4-2-14-2024.pptx
Per capita expenditure prediction using model stacking based on satellite ima...
Review of recent advances in non-invasive hemoglobin estimation
How UI/UX Design Impacts User Retention in Mobile Apps.pdf
KOM of Painting work and Equipment Insulation REV00 update 25-dec.pptx
Empathic Computing: Creating Shared Understanding
Digital-Transformation-Roadmap-for-Companies.pptx

An Introduction to JavaScript: Week One