Le wagon javascript for beginners - ARF

JavaScript
for
Beginners
@andrerferrer

You can find the slides at
bit.ly/JS-for-beginners

In-browser
language
(since 1995)

Workshop Outline
Theoretical intros
Basic concepts to understand
Live-code demos
We code, you don’t :)
Your turn
Take your time & have fun

Strings
"John"
"JohnLennon"
"a"
""

var firstName = "John";
"John"

console.log(firstName);
"John"

if (weather ==="rainy") {
console.log("Take an umbrella");
}

if (weather === "rainy") {
} else {
console.log("Take yoursunglasses");
}

if (weather ==="rainy") {
} else if (weather ==="stormy"){
console.log("Stay at home");
} else{
console.log("Take yoursunglasses");
}

var result= a && b;
Logical
and
a b result
false false false
false true false
true false false
true true true

var rain = true;
var wind = true;
if (rain && wind) {
console.log("Really stay at home");
}

var result= a || b;
Logical
or
a b result
false false false
false true true
true false true
true true true

var day = "Saturday";
if (day === "Saturday" || day === "Sunday") {
console.log("It's the week-end!");
}

var result= !a;
Logical not
a result
true false
false true

var sunny= true;
if (!sunny) {
console.log("Cancel the beach");
}

var weather = "raining";
if (weather !== "sunny") {
console.log("Cancel the beach");
}

Array
var students = [ "john", "paul", "ringo" ];
students.length // => 3
students[0] // => "john"
students[2] // => "ringo"
students[1] // => "paul"

#forEach
var heroes = ["Thor", "Hulk", "Captain
America", "Iron Man"];
heroes.forEach( (hero) => {
console.log(hero)
});

While
var i = 0;
while (i < heroes.length) {
console.log(heroes[i]);
i = i + 1;
}

function name(parameters) {
body
(return statement)
}
Old way

const name = (parameters) => {
body
(return statement)
}
New way

function fullName(first, last) {
var name = first + " " + last;
return name;
}
Example: Full
Name

fullName("John", "Lennon");
Calling a
function
Function
name
argument
s

Strings and Numbers
● bit.ly/01-Age-next-year
● bit.ly/02-Full-name
● bit.ly/03-Palindromes

Arrays
● bit.ly/04-Merge-and-sort
● bit.ly/05-Word-counter
● bit.ly/06-Playlist-array

Conditionals
● bit.ly/07-Odd-or-even
● bit.ly/08-Can-you-vote
● bit.ly/09-Find-max

Thank you!
Feel free to contact us!
milene@lewagon.org
● bit.ly/applyLWRJ

More Related Content