JavaScript Notes - Codecademy

JavaScript - data types

• String - any grouping of words or numbers, surrounded by single quotes ('....') or double quotes ("...").
• Number - any number, including numbers with decimals, without quotes: 4, 8, 15, 1.5, etc.
• Boolean - this is always one of two words, either true or false, with no quotations
• A String Interpolation is when you insert a variable into a string.
• In JavaScript, variables hold and store data.

Math operators

• Don't need to be very good at math to do math in JavaScript
• Simple operators used:
• Addition(+), subtraction (-), multiplication (*), and devision (/).
• !!!REMEMBER THAT WHEN USING NUMBERS, NO QUOTATIONS ARE TO BE USED!!!

Modulus

• A modulus (mod) is typed with a %.
• It shows us the remainder of a devision
• E.g., we take 13 / 5 - 5 goes up to 13 twice (10) and the remainder is 3
• This is done by typing in 13 % 5

Functions - math.random

• JavaScript has built in functions to make our lives easier
• Sometimes, we need to generate a random number within a program.
• We can do that with the Math.random(); code.
• This code (Math.random();) will return a random number between 0 and 1.
• To generate a random number between 0 and 50, we could multiply this result by 50, like this:
• Math.random() * 50;
• The problem with this is that the number will most likely be a decimal number.
• Luckily for us, JavaScript has another handy function, called Math.floor(); that will help us with that problem.
• Math.floor(); will round down to the nearest whole number. It is used like this:
• Math.floor(Math.random() * 50);

Comments

• While writing JavaScript, we can add in comments in our code
• Comments are not evaluated when the code runs, and will therefore not be printed as part of the result
• Comments can be extremely useful when looking back on a code we made a long time ago, to rembember how and why we did certain things, and so other people can go through our code and imitate and learn from it.
• A single line comment will comment out a single line, and is denoted with two foreward slashes (//) preceding the line of JavaScript code, like this:
• //The five first decimals of pi
• console.log('Pi is equal to ' + 3.14159);
• A multi-line comment will comment out multiple lines, and is denoted with /* to begin the comment, and */ to en the comment, like this:
• /*
• console.log('All of this code');
• console.log('Is commented out');
• console.log('And will not be executed);
• */

Programs in JavaScript

• To write programs in JavaScript, we need to make our code reusable
• Part of making code reusable is removing the data we want to perform some logic on to leave only the logic. Then we can use our logic on any data. Here's what we mean:
• Imagine you're writing a weather app. Your thermometer outside reports the temperature in Celsius and your goal is to report the temperature in Fahrenheit.
• You write a program that takes a temperature like 15 degrees Celsius, then multiplies and divides it until you get the temperature in Fahrenheit.
• Once you've done this though, you see the temperature now reads 16 degrees Celsius. In order to find Fahrenheit again, you'd need to write a whole new program to convert 16 degrees Celsius to Fahrenheit.
• This would happen because the Celsius-to-Fahrenheit logic is operating directly on the Celsius data.
• Luckily, JavaScript offers variables. Variables allow us to assign data to a word, then we can use that word within our program instead of the data. Then, if the variable's value changes we only have to change the variable's value instead of re-writing the entire program.

Variables

• var means variable in JavaScript
• It's a keyword that will create a new variable for us
• Variables are useful in 2 ways
• - They allow us to use the same value, over and over, without having to write a string, or another data type, over and over
• - More importantly, we can assign them values that can be read and changed by the program, without altering our code.

More about JavaScript

• Making decisions with code is called control flow
• All programming is, is a list of instructions for computers
• Main difficulty with being a developer is translating our human-speak ideas into computer-speak ideas.
• We can ask JavaScript to both think like us, and make decisions like us.
• Many decisions we make during the day boil down to this:
• - "If something is true, let's do option 1, if it's false, then option 2"
• This sentence looks similar in JavaScript:
• - If the variable needCoffee is true, JavaScript will run one code block, and if a variable is false, it will run another
• Here, the needCoffee is the condition inside the if-parentheses. Since it's equal to true, the program will run the code between the first open curly brace {, and the first closing curly brace }. It will completely ignore the else {...} part. In this case, we'd see 'Finding Coffee' log into the console
• Code between curly braces are called blocks. an if/else statement has two code blocks.
• If we adjusted the if/else statement to be false, only the else code block would run.
• If/else statements are how we can process yes/no questions with code.

Adding symbols in JavaScript

• If we want to add a symbol in a string, we can add a backslash ( \ ) to make that symbol appear.
• E.g.:
• - ('I lead a muggle's life') would only print I lead a muggle in string.
• - ('I lead a muggle\'s life'), however, would print I lead a muggle's life in string.

if/else statements

• If/else statements are the code way to process yes/no questions
• We can make if/else statements more powerful by adding comparison operators.
• There are two comparison operators you might be familiar with:
• - Less than: <
• - More than: >
• You might also be familiar with these two:
• - Less than or equal to: <=
• - More than or equal to: >=
• Comparisons always need two things to compare, and they will always return a boolean true or false.
• There are two more really powerful comparisons that we can make.
• To check if two things are equal to each other, we can use three equal signs in a row, ===
• To check if two things do not equal each other, we can write exclamation point and then two equal signs, !==
• Note!!! Variables only use ONE equal sign (=) to assign value to a variable, but when COMPARING two valuables, make sure to use three (===).

More about if/else statements

• If we have an if/else statement that has multiple yes and/or no conditions, we can add conditions to the statement with else if.
• Sometimes, in English, we don't just say one of the things, we say both those things, or either of those things.
• - Both of those statements can be translated into computer-speak.
• To say, Both must be true, we use &&
• To say, Either must be true, we use ||
• To say, I want to make sure this is the opposite of what it really is, we use !
• To say, These should not be equal to each other, we use !==

Switch statements

• Else if is a great tool to use when we have a few different conditions that need to be considered. It is, however, limited. If we need to take 25 conditions into consideration, we'd have to write a lot of code to include them all, and it would be difficult to both read and understand.
• To deal with this, we can use a switch statement instead of the many else if conditions.
• To a computer, switch statements are the same as if/else statements, but switch statements can be easier to read and comprehend for humans.
• The switch keyword is used to initiate the statement and is followed by (...), that contains the condition that each case will compare to.
• Inside the block, {...}, there are cases. case is like the else if part of an if/else statement.
• Let's set the variable in the switch statement as groceryItem, and the word following the first case as tomato. If groceryItem equaled tomato, the first console.log would run.
• Just like with an if/else statement, there is a default condition in a switch statement. If none of the cases are true, this code will run.

Functions

• A function is a block of code designed to perform a task
• Functions are like recipes.
• Take data or variables, perform a set of tasks on them, return the results.
• Allow us to write a chunk of code once, then reuse it.
• Currently, we have no way to give a function a number
• Instead, we have parameters.
• Parameters are variables that we can set when we call the function
• We can set as many parameters as we like, as long as we declare them when we make the function, separated by commas.
• The purpose of a function is to take some input, perform some task on that input, then return a result.
• To return a result, we can use the return keyword
• Return will take the result of the operation and return it to whatever called it.
• Return makes programs more maintainable and flexible.
• - When functions return their value, we can use them together, and inside each other.

Scope

• Scope is a big idea in programming
• Scope refers to where in a program a variable can be accessed.
• - The idea is, that not all variables can be accessed everywhere within a program.
• - Think of it like an apartment building. Everyone who lives there is under the global scope of the building and its manager.
• If you write a variable outside the functions in a program, it's in the global scope and can be accessed anywhere in the program.
• In our theoretical apartment building, you have your own apartment. In the apartment, you have stuff that's just yours, no one can access it except for you. This is the functional scope.
• - When we write variables inside functions, only that function has access to those variables, in addition to the global scope variables everyone has access to.

Arrays

• Arrays are lists in JavaScript. They store information for us.
• Arrays always have square brackets, [ ... ]
• Every item in the array, the list, has a number.
• - JavaScript starts counting from 0, not from 1!!!
• Fun fact - you can access individual characters in a string inside an array!
• Arrays have built in properties. One of them is to call forth the length of the array, using .length.
• - Note! .length is also a property for strings.
• Arrays also have built in functions for us to use to do common tasks.
• - First, push() allows us to add items to the end of the array, making the array longer
• - Second, pop() allows us to pop one off the end of the array, making the array shorter

Loops

• One of a computer's greatest abilities is to be able to repeat a task, over and over
• Loops let us tell the computer to loop over a block of code so that we don't have to write out the code, again and again.
• Loops are especially helpful when we have an array where we'd like to do something to each item in the array, like logging each item to the console.
• There are two main types of loops:
• - for loops, which let us loop a block of code a known amount of times.
• - while loops, which let us loop a block of code an unknown amount of times.

Slide 17