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