JavaScript
Introduction | |
Move code to a file in same dir | |
.h : Header Files | |
Overload |
Ctrl + Shift + I or F12 to open the Dev Tools
alert("Hello World!")
// is a comment
2**4 is 16
10/2
5
15 % 14
1
6%2
0
clear() - to clear the console
//STRINGS
"Django is cool"
"Django"+" is super cool"
"Django is super cool"
"django".length
6
"x x".length
3
"hello \n start a new line"
"hello
start a new line"
"hello \t give me a tab"
"hello give me a tab"
"hello \"quotes\" "
"hello "quotes" "
"hello \" jelly"
"hello " jelly"
"hello"[0]
"h"
Strings
"hello"[4]
"o"
"look at the dog"[12]
"d"
Variables
//VARIABLES
// let varName = value;
let bankAccount = 100;
bankAccount
100
let deposit = 50;
let total = bankAccount + deposit
total
150
let greeting = "Welcome back: ";
let name = "Andrei";
alert(greeting+name);
let myVariable
undefined
let bonus = null;
undefined
Some methods
alert("Hey!")
undefined
console.log("Hey I am in the console");
Hey I am in the console
prompt("Enter something")
"I type some text here"
let age = prompt("Enter your age: ")
undefined
age
"111"
Connecting JavaScript to HTML
<script src="script.js"></script>
Inside the script file:
alert("Welcome to www.aredel.com");
Ibs to kg
Скрипт
let weightInKg;
weightInKg = weightInIbs * 0.454;
alert("It is "+weightInKg+" kg");
console.log("Conversion completed");
Test it here
Operators
true
true
false
false
3>2
true
2>3
false
2>2
false
2 >= 2
true
1 <= 3
true
2 == 2
true
"www.heihei.ru" == "www.heihei.ru"
true
"2" == 2
true
"2" === 2
false
5 !== "5"
true
5 != "5"
false
true == 1;
true
true === 1;
false
false == 0
true
false === 0
false
null == undefined
true
null === undefined
false
NaN == Nan
false
Logical operators
1 === 1
true
2 === 2
true
//AND
undefined
1 === 1 && 2 === 2
true
1===1 && 2===2 && 1===2
false
//OR
undefined
1 === 2 || 1 === 1
true
//NOT
undefined
(1===1)
true
!(1===1)
false
!!(1===1)
true
!!!!!(1===1)
false
Control Flow
IF statement
if (condition) { //Execute some Code } else if (condition two) { //Execute some other Code } else { //Execute some backup Code }
Example 1
let id == 100;
console.log(id === 100 ? 'CORRECT' : 'INCORRECT')
Example 1
let hot = false
let temp = 60
if (temp>80){
hot=true
}
console.log(hot)
Example 2
let hot = false let temp = 100 if (temp > 80) { console.log("Hot Outside!"); } else if (temp <= 89 && temp >= 50) { console.log("Average temp Outside"); } else if (temp < 50 && temp >= 32) { console.log("Its pretty cold out!"); } else { console.log("Its very cold out!"); }
While Loop
while (condition){
// Execute some code while
// this condition is true
}
Example 1
let x = 0;
while (x < 5){
console.log("x is currently: "+x);
console.log("x is still less than 5, adding 1 to x");
x = x+1;
}
Example 2
let x = 0;
while (x < 5){
console.log("x is currently: "+x);
if (x===3){console.log("X IS EQUAL TO THREE!");
break;
}
console.log("x is still less than 5, adding 1 to x");
x = x+1;
}
Example 3
// Write a while Loop that prints out
// only the even numbers from 1 to 10
let num = 1;
while (num < 11){
if (num%2 === 0){
console.log(num);
}
num = num+1;
}
For Loops
For Loops allow you to continually execute code a specific number of times.
Javascript has three types of For Loops:
For - loops throught a number of times
For/In - loops through a JS object
For/of - used with arrays
A quick note, previously we used the notation:
num = num +1
num += 1
num++
These are all the same
For Loop Syntaxis
for (statement1;statement2;statement3) { // Execute some code } Statement 1 is executed before the loop (the code block) starts. for (let i = 0;statement2;statement3) { // Execute some code } // Statement 2 defines the condition for running the loop for (let i = 0; i<5;statement3) { // Execute some code }
Example 1
for (let i = 0; i < 5; i++) { console.log("Number is "+i); }
Example 2
let word = "ABCDEFGHIJK"
for (let i = 0; i < word.length; i++){
console.log(word[i]);
}
Example 3
let word = "ABABABABAB" for (let i = 0; i < word.length; i=i+2) { console.log(word[i]); }
Spy Test
let LastName=prompt("Hello, please enter our Last Name"); console.log(LastName); let FirstName=prompt("Hello, please enter our First Name"); console.log(FirstName); let Age=prompt("Hello, please enter your Age"); console.log(Age); let Height=prompt("How tall are you?"); console.log(Height); let Pet=prompt("What is your pets name"); console.log(Pet); alert("Thank you so much for the information."); let nameCond = null let ageCond = null let heightCond = null let petCond = null if (LastName[0]===FirstName[0]) {nameCond=true;} else{nameCond=false;} if (Age<30&&Age>20){ageCond=true;} else{ageCond=false;} if (Height>170){heightCond=true;} else{heightCond=false;} if (Pet[Pet.length-1]==="y") {petCond=true;} else{petCond=false;} if (nameCond && ageCond && heightCond && petCond){ // My secret message console.log("Welcome Comrade! Youve passed the Spy Test") }else{ console.log("Sorry, nothing to see here.") }
Errors
Uncaught TypeError: Cannot read property 'textContent' of undefined
Uncaught TypeError: Cannot read property 'textContent' of undefined
Uncaught SyntaxError: Unexpected token '<'l
JavaScript | |
Array Sorting | |
Vertical Scrolling | |
Get Screen Size | |
Mocha Framework | |
TicTacToe | |
Errors |