Variables

    - declare JavaScript variables with var, let or const. 
    - If the value of the variable can change, like a total, use let. If the value is set, like prices, use const. Variables can hold any data type.

var x = 5;
var y = 6;
var z = x + y;

z

Data types- there are 8 JS data types.

List a few data types that you already know
Number String Boolean

1. String: a series of characters, written with single or double quotes

let text = "Mort";
text

'Mort'

let text2 = 'Yeung';
text2

'Yeung'

2. Number: can be integers or decimals.

    - You can also have exponential notation for large/small numbers

3. Bigint: used to store integer values that are too big to be represented by a normal JS number

    - JavaScript integers are only accurate up to 15 digits

let number = 1234567890123456789012345n;
let Largenum = BigInt(1234567890123456789012345)

let typeLargenum = typeof Largenum;
typeLargenum

'bigint'

Largenum

1234567890123456824475648n

4. Boolean: true or false, used in conditional testing

Boolean(10 > 9)

Write a boolean statement that outputs true

Boolean()

5. Undefined: a variable without a value, has the value undefined/empty values

let name;  
name

grade = undefined;

6. Null: represents the intentional absence of any object value

    - variable is empty at the moment and may have a value later

let result;

result = Boolean(undefined);
console.log(result); // false

result = Boolean(null);
console.log(result); // false

false
false

7. Symbol: used to represent unique values that can be used as identifiers/keys in objects.

    - They are also used to create private properties and methods in classes.
    - unique and immutable, so they can be used as unique identifiers in objects and classes.
    - useful for creating constants that can be shared across different parts of your code.

// Create a Symbol
const mySymbol = Symbol();

console.log(mySymbol);
// expected output: Symbol()

Symbol()

const myObject = {
    [mySymbol]: 'Hello World'
  };
  
  console.log(myObject);

//Edit/add to the code above so that it outputs "Hello World"

8. Object: an unordered collection of key-value pairs. Each key-value pair is called a property.

    - object: written with curly braces {}, name:value pairs
    - array: written with square brackets, separated by commas

Object

Identify the name/keys in the object below: name, breed, color, age
Identify the values in the object below: Elly, Rottweiler, black, 4

const dogs = {name: "Elly", breed:"Rottweiler", age:4, color:"black"}
dogs

{ name: 'Elly', breed: 'Rottweiler', age: 4, color: 'black' }

Array

const songs = ["Love Story", "Blank Space", "I Knew You Were Trouble"];
songs

[ 'Love Story', 'Blank Space', 'I Knew You Were Trouble' ]

Const

    - We use const to declare variables whose value can be initialized only at the time of declaration.  
    - Const means that the identifier cannot be reassigned.

const cost1 = 2;
const cost2 = 11;
let totalCost = cost1 + cost2;

totalCost

13

Conditionals: control behavior, decides whether or not pieces of code can run.

- If: if a condition is true it is used to specify execution for a block of code.
- Else: if the same condition is false it specifies the execution for a block of code.
- Else If: new test if the first condition is false.

if (10 > 5) {
    var outcome = "True";
}

outcome;

'True'

if ("red" === "blue") {
    var outcome = "if block";
} else {
    var outcome = "else block";
}
outcome;

'else block'

let temperature = 54
if (temperature < 70) {
    cast = "Chilly";
  } else if (temperature < 60) {
    cast = "Cold";
  } else {
    cast = "Warm";
  }

cast

Create a conditional statement about how you would greet someone based on the time of day.

let currentTime = 5
if (currentTime < 70) {
    greeting = "Good morning!";
  } else if (temperature < 60) {
    greeting = "Good afternoon!";
  } else {
    greeting = "Good evening!";
  }

  greeting

Functions:

- defining: define with function + functionName(parameter) { function code }.  It can be unnamed/anonymous can be defined based on a condition.
- calling: simply put the function name with a parameter and semicolon, or a function can call itself (recursive)

Iteration:

    - for loop: repeats until a specified condition evaluates to false
    - do...while: repeats until a specified condition evaluates to false
    - while statement: executes its statements as long as a specified condition evaluates to true
    - label: provides a statement with an identifier that lets you refer to it later in the code. ex. you can use a label to identify a loop, and then use the break or continue statements to    indicate whether a program should interrupt the loop or continue its execution
    - break: used to terminate a loop, switch, or in conjunction with a labeled statement
    - continue: can be used to restart a while, do-while, for, or label statement
    - for...in: iterates a specified variable over all the enumerable properties of an object
    - for...of statement creates a loop Iterating over iterable objects, invoking a custom iteration hook with statements to be executed for the value of each distinct property

JavaScript in HTML- Questions

Where do you store the JavaScript Code?
- It can be stored directly in an HTML file between script tags, or it can be saved as a separate .js file and included in an HTML document using a script tag with a src attribute pointing to the JavaScript file. JavaScript code can also be stored in external libraries or frameworks, which can be linked to an HTML document using a script tag.
How do you import a JS file into HTML?
- You can use the script tag with the src attribute. The src attribute should contain the file path or URL of the JavaScript file that you want to include
What is onClick?
- onClick is a JavaScript event that is triggered when an element is clicked
- It can be used to execute JavaScript code when a user clicks on a button, link, image, or any other element that has a click event associated with it. The onClick event can be added as an attribute to an HTML element, and the value of the attribute should be the JavaScript code that you want to execute when the element is clicked.
What tag do you use to write JavaScript code?
- is used to write JavaScript code in an HTML document. The tag, or it can be included as the value of the src attribute when referencing an external JavaScript file

Hacks

Add notes in this notebook DONE
Complete the code portions, questions, and prompts throughout the notebook DONE
Extra Credit: code a small JavaScript game