JavaScript
Technologies That Drive the Web
By: Engr. Richard P. Cabales
Comment in JavaScript
// This is an in-line comment.
/* This is a
multi-line comment */
By: Engr. Richard P. Cabales
Declare JavaScript Variables
var myName;
By: Engr. Richard P. Cabales
Storing Values with the Assignment
Operator
var a;
var b = 2;
a = 7;
By: Engr. Richard P. Cabales
Assigning the Value of One Variable
to Another
var a;
a = 100;
var b;
b=7;
b=a;
By: Engr. Richard P. Cabales
Initializing Variables with the
Assignment Operator
var a = 9
By: Engr. Richard P. Cabales
Understanding String Literals
var myFirstName = "Richard"
var myLastName = ’Cabales’
By: Engr. Richard P. Cabales
Understanding Uninitialized
Variables
var a; var a = 5;
var b; var b = 10;
var c; var c = "I am a";
a = a + 1; a = a + 1;
b = b + 5; b = b + 5;
c = c + " String!"; c = c + " String!";
By: Engr. Richard P. Cabales
Understanding Case Sensitivity in
Variables
// Declarations
var studlyCapVar;
var properCamelCase;
var titleCaseOver;
// Assignments in camel case
studlyCapVar = 10;
properCamelCase = "A String";
titleCaseOver = 9000;
By: Engr. Richard P. Cabales
Differences Between the var and let
Keywords
var camper = "James"; let camper = "James";
var camper = "David"; let camper = "David";
console.log(camper); console.log(camper);
By: Engr. Richard P. Cabales
Declare a Read-Only Variable with
the const Keyword
const PI = 3.14159;
let str = "is cool!";
str = "is the value of PI!";
console.log(PI, str);
By: Engr. Richard P. Cabales
Add Two Numbers with JavaScript
const sum = 10 + 10;
By: Engr. Richard P. Cabales
Add Two Numbers with JavaScript
const sum = 10 + 10;
By: Engr. Richard P. Cabales
Subtract One Number from Another
with JavaScript
const difference = 45 - 33;
By: Engr. Richard P. Cabales
Multiply Two Numbers with
JavaScript
const product = 8 * 10;
By: Engr. Richard P. Cabales
Divide One Number by Another with
JavaScript
const quotient = 66 / 33;
By: Engr. Richard P. Cabales
Increment a Number with JavaScript
let myVar = 87;
myVar++;
By: Engr. Richard P. Cabales
Decrement a Number with
JavaScript
let myVar = 11;
myVar--;
By: Engr. Richard P. Cabales
Multiply Two Decimals with
JavaScript
const product = 2.0 * 2.5;
By: Engr. Richard P. Cabales
Multiply Two Decimals with
JavaScript
const product = 2.0 * 2.5;
By: Engr. Richard P. Cabales
Divide One Decimal by Another with
JavaScript
const quotient = 4.4 / 2.0;
By: Engr. Richard P. Cabales
Divide One Decimal by Another with
JavaScript
const quotient = 4.4 / 2.0;
By: Engr. Richard P. Cabales
Finding a Remainder in JavaScript
const remainder = 11%3;
By: Engr. Richard P. Cabales
Compound Assignment With
Augmented Addition
let a = 3;
let b = 17;
let c = 12;
a += 12; // a = a+12
b += 9; // b = b+9
c += 7; // c = c+7
By: Engr. Richard P. Cabales
Compound Assignment With
Augmented Subtraction
let a = 11;
let b = 9;
let c = 3;
a -= 6; //a = a - 6;
b -= 15; //b = b - 15;
c -= 1; //c = c - 1;
By: Engr. Richard P. Cabales
Compound Assignment With
Augmented Multiplication
let a = 5;
let b = 12;
let c = 4.6;
a *= 5; //a = a * 5;
b *= 3; //b = b * 3;
c *= 10 //c = c * 10;
By: Engr. Richard P. Cabales
Compound Assignment With
Augmented Division
let a = 5;
let b = 12;
let c = 4.6;
a /= 5; //a = a * 5;
b /= 3; //b = b * 3;
c /= 10 //c = c * 10;
By: Engr. Richard P. Cabales
Escaping Literal Quotes in Strings
const myStr = "I am a \"double quoted\" string inside \"double quotes\".";
By: Engr. Richard P. Cabales
Quoting Strings with Single Quotes
const doubleQuoteStr = "This is a string";
const singleQuoteStr = 'This is also a string';
const conversation = 'Finn exclaims to Jake, "Algebraic!"';
const goodStr = 'Jake asks Finn, "Hey, let\'s go on an adventure?"';
const badStr = 'Finn responds, "Let's go!"';
const myStr = '<a href="http://www.example.com" target="_blank">Link</a>';
By: Engr. Richard P. Cabales
Escape Sequences in Strings
const myStr="FirstLine\n\t\\SecondLine\nThirdLine";
By: Engr. Richard P. Cabales
Concatenating Strings with Plus
Operator
const myStr = "This is the start. " + "This is the end.";
By: Engr. Richard P. Cabales
Constructing Strings with Variables
const myName = "Richard Cabales";
const myStr = "Hello, my name is " + myName + ", how are you?";
By: Engr. Richard P. Cabales
Appending Variables to Strings
const someAdjective = "Exciting";
let myStr = "Learning to code is ";
myStr += someAdjective
By: Engr. Richard P. Cabales
Find the Length of a String
console.log(“Richard Cabales".length);
let lastNameLength = 0;
const lastName = "dela Cruz";
lastNameLength = lastName.length;
By: Engr. Richard P. Cabales
Use Bracket Notation to Find the
First Character in a String
const firstName = "Charles";
const firstLetter = firstName[0];
let firstLetterOfLastName = "";
const lastName = "Lovelace";
firstLetterOfLastName = lastName[0];
By: Engr. Richard P. Cabales
Understand String Immutability
let myStr = "Bob";
myStr[0] = "J";
let myStr = "Bob";
myStr = "Job";
let myStr = "Jello World";
myStr = "Hello World";
By: Engr. Richard P. Cabales
Use Bracket Notation to Find the
Nth Character in a String
const lastName = "Lovelace";
const thirdLetterOfLastName = lastName[2];
By: Engr. Richard P. Cabales
Use Bracket Notation to Find the
Last Character in a String
const firstName = "Ada";
const lastLetter = firstName[firstName.length - 1];
By: Engr. Richard P. Cabales
Use Bracket Notation to Find the
Last Character in a String
const firstName = "Ada";
const lastLetter = firstName[firstName.length - 1];
By: Engr. Richard P. Cabales
Use Bracket Notation to Find the
Nth-to-Last Character in a String
const firstName = "Augusta";
const thirdToLastLetter = firstName[firstName.length - 3];
By: Engr. Richard P. Cabales
Word Blanks
var myNoun = "dog";
var myAdjective = "big";
var myVerb = "ran";
var myAdverb = "quickly";
var wordBlanks = "The " + myAdjective + " " + myNoun + " " + myVerb + " " + my
Adverb + ".";
By: Engr. Richard P. Cabales
Store Multiple Values in one Variable
using JavaScript Arrays
const sandwich = ["peanut butter", "jelly", "bread"];
const myArray = ["peanut butter",5];
By: Engr. Richard P. Cabales
Nest one Array within Another Array
(multi-dimensional array)
const myArray = [["Computer Engineering", 50], ["Civil Engineering", 55]];
console.log(myArray[0][0])
console.log(myArray[0][1])
console.log(myArray[1][0])
console.log(myArray[1][1])
By: Engr. Richard P. Cabales
Modify Array Data With Indexes
const ourArray = [50, 40, 30];
ourArray[0] = 15;
By: Engr. Richard P. Cabales
Access Multi-Dimensional Arrays
With Indexes
const arr = [
[1, 2, 3],
[4, 5, 6],
[7, 8, 9],
[[10, 11, 12], 13, 14]
];
const subarray = arr[3];
const nestedSubarray = arr[3][0];
const element = arr[3][0][1];
console.log(subarray)
console.log(nestedSubarray)
console.log(element)
By: Engr. Richard P. Cabales
Manipulate Arrays With push
Method
const arr1 = [1, 2, 3];
arr1.push(4, 5);
const arr2 = ["Stimpson", "J", "cat"];
arr2.push(["happy", "joy"]);
By: Engr. Richard P. Cabales
Manipulate Arrays With pop Method
const threeArr = [1, 4, 6];
const oneDown = threeArr.pop();
console.log(oneDown);
console.log(threeArr);
By: Engr. Richard P. Cabales
Manipulate Arrays With shift
Method
const ourArray = ["Stimpson", "J", ["cat"]];
const removedFromOurArray = ourArray.shift();
console.log(removedFromOurArray)
console.log(ourArray)
By: Engr. Richard P. Cabales
Manipulate Arrays With unshift
Method
const ourArray = ["Stimpson", "J", "cat"];
ourArray.shift();
ourArray.unshift("Happy");
console.log(ourArray)
By: Engr. Richard P. Cabales