Javascript 101

Best practice

Scope

• While it’s important to know what global scope is, it’s best practice to not define variables in the global scope.
• While we use block scope, we still pollute our namespace by reusing the same variable name twice. A better practice would be to rename the variable inside the block.
• Scope refers to where variables can be accessed throughout the program, and is determined by where and how they are declared.
• Blocks are statements that exist within curly braces {}.
• Global scope refers to the context within which variables are accessible to every part of the program.
• Global variables are variables that exist within global scope.
• Block scope refers to the context within which variables are accessible only within the block they are defined.
• Local variables are variables that exist within block scope.
• Global namespace is the space in our code that contains globally scoped information.
• Scope pollution is when too many variables exist in a namespace or variable names are reused.

Arrays

• .pop() (remove last item) and .push() (add item to array) mutate the array on which they’re called

• .shift() method to remove the first item from the array

• .unshift() adds an item to the beginning of the array

• .slice()removes things in an array in an un-mutated way

• .indexOf() returns the index number value of an item in the array

• When you pass an array into a function, if the array is mutated inside the function, that change will be maintained outside the function as well.

• Nested array — When an array contains another array, uses bracket notation

  • if we wanted to access the elements within the nested array we can chain, or add on, more bracket notation with index values

  const nestedArr = [[1], [2, 3]];
   
  console.log(nestedArr[1]); // Output: [2, 3]
  console.log(nestedArr[1][0]); // Output: 2

• Arrays are lists that store data in JavaScript.

• Arrays are created with brackets [].

• Each item inside of an array is at a numbered position, or index, starting at 0.

• We can access one item in an array using its index, with syntax like: myArray[0].

• We can also change an item in an array using its index, with syntax like myArray[0] = 'new string';

• Arrays have a length property, which allows you to see how many items are in an array.

• Arrays have their own methods, including .push() and .pop(), which add and remove items from an array, respectively.

• Arrays have many methods that perform different tasks, such as .slice() and .shift(), you can find documentation at the Mozilla Developer Network website.

• Some built-in methods are mutating, meaning the method will change the array, while others are not mutating. You can always check the documentation.

• Variables that contain arrays can be declared with let or const. Even when declared with const, arrays are still mutable. However, a variable declared with const cannot be reassigned.

• Arrays mutated inside of a function will keep that change even outside the function.

• Arrays can be nested inside other arrays.

• To access elements in nested arrays chain indices using bracket notation.

  Learning how to work with and manipulate arrays will help you work with chunks of data!

Loops

• A for loop contains three expressions separated by ; inside the parentheses:
  1. an initialization starts the loop and can also be used to declare the iterator variable.
  2. a stopping condition is the condition that the iterator variable is evaluated against— if the condition evaluates to true the code block will run, and if it evaluates to false the code will stop.
  3. an iteration statement is used to update the iterator variable on each loop.
• The for loop syntax looks like this:

for (let counter = 0; counter < 4; counter++) {
  console.log(counter);
}

• To reverse the loop, you would start with the highest value, change the direction of the operator, and use the subtraction math

for (let counter = 3; counter >= 0; counter--){
  console.log(counter);
}

• in loops, i= index

• In situations when we want a loop to execute an undetermined number of times, while
   loops are the best choice.

• When we have a loop running inside another loop, we call that a nested loop. One use for a nested for loop is to compare the elements in two arrays. For each round of the outer for loop, the inner for loop will run completely.

const myArray = [6, 19, 20];
const yourArray = [19, 81, 2];
for (let i = 0; i < myArray.length; i++) {
  for (let j = 0; j < yourArray.length; j++) {
    if (myArray[i] === yourArray[j]) {
      console.log('Both arrays have the number: ' + yourArray[j]);
    }
  }
}

• For each element in the outer loop array, myArray, the inner loop will run in its entirety comparing the current element from the outer array, myArray[i], to each element in the inner array, yourArray[j]. When it finds a match, it prints a string to the console.

Higher order functions

• Functions are first class objects — they can have properties and methods (eg., .length, .name, .toString())
• Higher order functions are functions that accept functions as parameters and/or returns functions.
• Functions that get passed in as a parameter is called a callback function

Resources

Name	Description	URL	Tag
Arrays	Documentation re: Arrays are lists of ordered, stored data. They can hold items that are of any data type.	https://www.codecademy.com/resources/docs/javascript/arrays	javascript
Dwitter	Javascript experiments in a twitter-like feed	https://www.dwitter.net/	creative coding, javascript