Javascript
Arithmetic, Conditionals & Loops
Learning Outcomes
Reading Input From The User
Arithmetic Operators
Conditionals, Relational Operators & Logical Operators
Loops
For, while , do while
In what context are we going to be using JavaScript ?
To Build Console Applications
IN MODERN DEVELOPMENT :
WE DON’T USE JAVASCRIPT TO BUILD CONSOLE APPLICATIONS
IN MODERN DEVELOPMENT, WE USE JAVASCRIPT TO BUILD INTERACTIVE WEB APPS WITH PRETTY USER INTERFACES
When first learning a language, it’s best to focus on the language features! Building console applications help you to do such!
Console Applications
READING INPUT FROM USER
Reading Input From User – Browser vs. Terminal
Getting input from the user depends on where the Javascript is being run.
OPTION 1. Input from the browser:
Create a GUI textbox for the user to enter data
OPTION 2. Input from the command line (Node.Js)
Install the prompt-sync package into Node.js
Import the prompt-sync package at the top of your Javascript file
Open terminal
npm install prompt-sync
or
npm i prompt-sync
Reading Input From User – Server Side
Using prompt-sync, the Javascript for reading input looks like this:
// importing the prompt-sync package
// whenever you want to ask for user input, use the prompt(…) syntax
const prompt = require(“prompt-sync”)()
// get user input
const name = prompt(“What’s your name?”)
const age = prompt(“What’s your age?”)
console.log(`Hello ${name}, you are ${age} years old!`)
REMINDER: This code requires you to install the prompt-sync package into Node.js
Comparing C vs. Javascript
Compare the similarities and differences between input/output in C and Javascript
#include
int main()
{
int age;
printf(“Enter your age: “);
scanf(“%d”, &age);
printf(“You are %d years old”,age);
return 0;
}
const prompt = require(“prompt-sync”)()
const name = prompt(“What’s your name?”)
const age = prompt(“What’s your age?”)
console.log(`Hello ${name}, you are ${age} years old!`)
Reading Input From User – Server Side
User input is always saved as the String data type.
const prompt = require(“prompt-sync”)()
…
const age = prompt(“What’s your age?”)
console.log(“What is the data type of age?”)
console.log(typeof(age))
Expected Output:
What’s your age?100
What is the data type of age?
String
If you need to use the data in calculations, then convert input to a Number using parseInt(..) or parseFloat(…)
ARITHMETIC OPERATORS
Arithmetic Operators
All arithmetic operators compute the result of a specific arithmetic operation and returns its result.
Subtraction:
varA – varB
Modulus
varA % varB
Addition:
varA + varB
Division:
varA / varB
Multiplication
varA * varB
Exponent
base ** exponent
CONTROL CONSTRUCTS
What are Control Constructs ?
Control Constructs
Control Structures can be considered as the building blocks of computer programs. They determine when and which statements and/or commands are executed
The basic Control Structures in programming languages are:
Selection (Decision Making- Conditionals): which are used to execute one or more statements if a condition is met.
If
If else
If else if
Switch case
Iteration(loops): which purpose is to repeat a statement a certain number of times or while a condition is fulfilled.
For – When know how many times something is going to repeat
While
Do while
SELECTION CONSTRUCT
OR
CONDITIONALS
Conditionals
Often times a computer program must make choices on which way to proceed, e.g., if the ball is in bounds, do one thing, else, do something different
If the data has all been processed, end the program, else continue to the next data item… while the player has lives left continue the game.
Conditional statements, conditional expressions and conditional constructs are features of a programming language, which perform different computations or actions depending on whether a programmer-specified boolean condition evaluates to true or false
Types of Conditionals Constructs
if
If else
If else if
switch
RELATIONAL OPERATORS
Relational Operators
Values can be compared with the same operators as in C
The comparisons will always produce either a true or false value
Greater than:
varA > varB
Less than:
varA < varB
Equality:
varA == varB
Not equal:
varA != varB
Greater than or equal to
varA >= varB
Less than or equal to
varA <= varB
Comparison Operators - Equals sign
In Javascript, there are three different usages of the equals symbol
Single Equals - Assignment =
Store a value into a variable
Double Equals - Value comparison ==
Compare the values of two variables
Returns true if the value is the same
Data types do NOT have to be the same
Triple Equals - Strict comparison ===
Compare the value and data types of two variables
Returns true if value and data types are the same
Strict equality checking is the most preferred!
Comparison Operators - Equals sign
Single equal: Assigning a value to a variable
// assign the value of 3 to the variable a
const a = 3
Double equals: Used to compare the values of two variables
// outputs true because both values are technically 3
console.log(3 == “3”)
Triple equals: Used to compare the values & types of two variables
// outputs false. Values are same, but types are different
console.log(3 === “3”)
LOGICAL OPERATORS
Logical Operators
logical operator is a symbol or word used to connect two or more expressions such that the value of the compound expression produced depends only on that of the original expressions and on the meaning of the operator
Logical OR:
(bool expression1)
||
(bool expression2)
Logical AND:
(bool expression1)
&&
(bool expression2)
NOT
!(bool expression1)
Rules of Logical AND vs Logical OR
Expression Outcome Expression Outcome
true AND true = true true OR true = true
true AND false = false true OR false = true
false AND false = false false OR false = false
IF
IF ELSE
IF ELSE ELSE IF
SWITCH
ITERATION CONSTRUCT
Loops
Loops
Loops are among the most basic and powerful of programming concepts.
A loop in a computer program is an instruction(s) that repeats until a specified condition is reached.
In a loop structure, the loop asks a question. If the answer requires action, it is executed.
FOR LOOP
For Loop
WHILE LOOP
While Loop
DO WHILE LOOP
Do While
Keywords with loops
break- Break leaves the loop completely and executes the statements after the loop.
continue - continue leaves the current iteration and executes with the next value in the loop. break completely exits the loop