In the following code, name the data types used, describe the scope for the variables, and spot the: statement, variable, expression, operator, function, argument, and return value.

function calculateTip(total) {
  const tipPercent = 0.15;
  return (total * tipPercent);
}

const billTotal = 10.00;
const billTip   = calculateTip(billTotal);
const receipt   = 'Total: ' + billTotal + ' Tip: ' + billTip;
console.log(receipt);

Use if to tell JS which statements to execute, based on a condition.

if (condition) {
  // statements to execute
}

const x = 5;

if (x > 0) {
  console.log('x is a positive number!');
}

An 'if' statement tests a condition to see if it is true. If the condition is true, the code inside the 'if' statement is run. If the condition is not true, the 'if' statement exits without being run. A simple 'if' statement looks like this... Since the value of 'x' is 5, and 5 is greater than 0, the condition is evaluated as true and the code inside our 'if' statement is executed.

Use these operators to compare two values for equality, inequality, or difference.

  const myFavoriteNumber = 28;

Common mistake: Do not confuse = (the assignment operator) with ==.

https://developer.mozilla.org/en/JavaScript/Guide/Expressions_and_Operators#Comparison_operators A comparison operator compares its operands and returns a logical value based on whether the comparison is true. The operands can be numerical, string, logical, or object values. Strings are compared based on standard lexicographical ordering, using Unicode values. In most cases, if the two operands are not of the same type, JavaScript attempts to convert the operands to an appropriate type for the comparison. (The sole exceptions to this rule are === and !==, which perform "strict" equality and inequality and which do not attempt to convert the operands to compatible types before checking equality.) This generally results in a numerical comparison being performed. The following table describes the comparison operators, assuming the following code: Why can't we just use '='? The equals sign is always an 'assignment operator' in Javascript. That means that whenever Javascript encounters a '=' it will try to assign the value on the right side of the '=' to the entity on the left side. So in the following example, the value of 'x' is overwritten... const x = 5; if (x = 6){ console.log(x); //x will equal 6 }

These are typically used in combination with the comparison operators:

const posNum = 4;
const negNum = -2;

When combining together multiple conditions, use parentheses to group:

const myAge = 28;
if ((myAge >= 0 && myAge < 3)  || myAge > 90) {
  console.log('You\'re not quite in your peak.');
}

Logical operators are typically used with Boolean (logical) values; when they are, they return a Boolean value. However, the && and || operators actually return the value of one of the specified operands, so if these operators are used with non-Boolean values, they may return a non-Boolean value. The logical operators are described in the following table. https://developer.mozilla.org/en/JavaScript/Guide/Expressions_and_Operators#Logical_operators The 'and' (&&) and 'or' (||) operators allow us to test several conditions in one 'if' statement. To execute the same code if either 'x' or 'y' is 5 we can use the 'or' operator... if (x === 5 || y === 5) { //execute if the value of x is 5 or the value of y is 5 } If we want to execute some code only if both 'x' and 'y' have the value 5, we use the 'and' operator... if (x === 5 && y === 5) { //execute if the value of x is 5 and the value of y is 5 } It is important to remember that in both scenarios conditions are tested left to right, and only continue testing if needed.

If you don't use a comparison or logical operator, JS tries to figure out if the value is "truth-y".

const catsRule = true;
if (catsRule) {
  console.log('Yay cats!');
}

Values that are "false-y": false, the empty string (""), the number 0, undefined, null.

const name = '';
if (name) {
  console.log('Hello, ' + name);
}
const points = 0;
if (points) {
  console.log('You have ' + points + ' points');
}
let firstName;
if (firstName) {
  console.log('Your name is ' + firstName);
}

JS evaluates logical operators from left to right and stops evaluating as soon as it knows the answer.

(false && anything) => false
(true || anything) => true

const numerator = 5;
const denominator = 0;
if (denominator !== 0 && (numerator / denominator > 0)) {
  console.log('Thats a valid, positive fraction');
}

Use else to give JS an alternative statement to execute.

const age = 28;
if (age > 16) {
  console.log('Yay, you can drive!');
} else {
  console.log('Sorry, but you have ' + (16 - age) + ' years til you can drive.');
}

You can use else if if you have multiple exclusive conditions to check:

const age = 20;
if (age >= 35) {
  console.log('You can vote AND hold any place in government!');
} else if (age >= 25) {
  console.log('You can vote AND run for the Senate!');
} else if (age >= 18) {
  console.log('You can vote!');
} else {
  console.log('You have no voice in government!');
}

The while loop tells JS to repeat statements as long as a condition is true:

while (expression) {
  // statements to repeat
}

let x = 0;
while (x < 5) {
  console.log(x);
  x = x + 1;
}

Beware: It's easy to accidentally cause an "infinite loop."

Also, otice how we're using let instead of const!

The for loop is another way of repeating statements, more specialized than while:

for (initialize; condition; update) {
  // statements to repeat
}

for (let i = 0; i < 5; i = i + 1) {
  console.log(i);
}

We use i, j, k, etc. Harder to do an infinite loop, but still possible.

To prematurely exit a loop, use the break statement:

for (let current = 100; current < 200; current++) {
  console.log('Testing ' + current);
  if (current % 7 == 0) {
    console.log('Found it! ' + current);
    break;
  }
}

An array is a type of data-type that holds an ordered list of values, of any type:

const arrayName = [element0, element1, ...];

Yup, arrays use const - even though you can update the stuff inside them, it's still the same array!

const rainbowColors = ['Red', 'Orange', 'Yellow', 'Green', 'Blue', 'Indigo', 'Violet'];
const raceWinners = [33, 72, 64];
const myFavoriteThings = ['Broccoli', 60481, 'Love Actually'];

The length property reports the size of the array:

console.log(rainbowColors.length);

You can access items with "bracket notation". The index starts at 0.

const arrayItem = arrayName[indexNum];

const rainbowColors = ['Red', 'Orange', 'Yellow', 'Green', 'Blue', 'Indigo', 'Violet'];
const firstColor = rainbowColors[0];
const lastColor = rainbowColors[6];

You can also use bracket notation to change the item in an array:

const myFavoriteThings = ['Broccoli', 60481, 'Love Actually'];
myFavoriteThings[0] = 'Celery Root';

Or to add to an array:

myFavoriteThings[4] = 'Playgrounds';

You can also use the push method:

myFavoriteThings.push('Dancing');

Use a for loop to easily process each item in an array:

const rainbowColors = ['Red', 'Orange', 'Yellow', 'Green', 'Blue', 'Indigo', 'Violet'];
for (let i = 0; i < rainbowColors.length; i++) {
  console.log(rainbowColors[i]);
}

or a string:

const rainbowColorsLetters = 'ROYGBIV';
for (let i = 0; i < rainbowColorsLetters.length; i++) {
  console.log(rainbowColorsLetters[i]);
}