JavaScript Fundamentals Sprint Challenge

README.md

@@ -30,14 +30,32 @@ Edit this document to include your answers after each question. Make sure to lea
 
 1. Describe the biggest difference between `.forEach` & `.map`.
 
+    Both methods will run a function on every element of the array provided. `forEach` can change the original array and does not by default return a new array, whereas `map` returns a new array with the results of the function.
+
 2. What is the difference between a function and a method?
 
+    A method is a function that lives on the prototype of another object. It is a property of that object.
+
 3. What is closure?
 
+    Closure is a function's ability to reach outside of its own scope for context and variables. We can think of it like an 'enclosure' -- it has its own scope, and it keeps memory of things in its own scope, but it can look outward for other functions, variables, etc.
+
+
 4. Describe the four rules of the 'this' keyword.
 
+    * 1. Window/Global binding: When called in the global scope, 'this' refers to the window/console object -- i.e., can be all of JavaScript when the window object is the browser.
+
+    * 2. Implicit binding: When used within a function, 'this' refers to the object that function is a method of (i.e., the object that method is being called on).
+
+    * 3. New binding: When 'this' is used inside a constructor function, it refers to the object that is being constructed.
+
+    * 4. Explicit binding: When using the `call` or `apply` methods, 'this' refers to whatever object is directly passed as the first argument.
+
+
 5. Why do we need super() in an extended class?
 
+    Super() passes the given arguments up to the constructor of the parent class to map to whatever props are on the parent, and then the child constructor takes whatever leftover props are defined in the object you passed in, and maps them into the props defined in the child constructor. It's the way to construct the properties that are defined on the parent class for the new object in the extended/child class.
+
 ## Project Set up
 
 Follow these steps to set up and work on your project:

challenges/classes.js

@@ -1,7 +1,43 @@
 // 1. Copy and paste your prototype in here and refactor into class syntax.
 
+// **NOTE: I'm calling this CuboidMaker2 because I'm using 'const' to declare variables and I was getting a js error because CuboidMaker was already declared in prototypes.js. This throws a js loader error locally but works in Chrome. **//
+
+class CuboidMaker2 {
+    constructor (length, width, height) {
+        this.length = length;
+        this.width = width;
+        this.height = height;
+    }
+    volume() {
+        return this.length * this.width * this.height;
+    }
+    surfaceArea() {
+        return 2 * (this.length * this.width + this.length * this.height + this.width * this.height);
+    }
+}
+
+const cuboid2 = new CuboidMaker2(4, 5, 5);
+
+
 // Test your volume and surfaceArea methods by uncommenting the logs below:
-// console.log(cuboid.volume()); // 100
-// console.log(cuboid.surfaceArea()); // 130
+console.log(cuboid2.volume()); // 100
+console.log(cuboid2.surfaceArea()); // 130
+
+// Stretch Task: Extend the base class CuboidMaker with a sub class called CubeMaker.  Find out the formulas for volume and surface area for cubes and create those methods using the dimension properties from CuboidMaker.  Test your work by logging out your volume and surface area.
+
+class CubeMaker extends CuboidMaker2 {
+    constructor (length, width, height){
+        super(length, width, height);
+    }
+    cubeVolume() {
+        console.log(this.length ** 3);
+    }
+
+    cubeSurfaceArea() {
+        console.log(this.length ** 2 * 6);
+    }
+}
 
-// Stretch Task: Extend the base class CuboidMaker with a sub class called CubeMaker.  Find out the formulas for volume and surface area for cubes and create those methods using the dimension properties from CuboidMaker.  Test your work by logging out your volume and surface area.
+const cube = new CubeMaker(9, 9, 9);
+cube.cubeVolume();
+cube.cubeSurfaceArea();

challenges/functions.js

@@ -7,25 +7,40 @@
   * In the body of the function return the callback with the two parameters that you created
 */
 
+function consume(param1, param2, cb) {
+  return cb(param1, param2);
+};
+
 
 /* Step 2: Create several functions to callback with consume();
   * Create a function named add that returns the sum of two numbers
   * Create a function named multiply that returns the product of two numbers 
   * Create a function named greeting that accepts a first and last name and returns "Hello first-name last-name, nice to meet you!"
 */
 
+function add(param1, param2) {
+  console.log(param1 + param2);
+};
+
+function multiply(param1, param2) {
+  console.log(param1 * param2);
+}
+
+function greeting(param1, param2) {
+  console.log(`Hello ${param1} ${param2}, nice to meet you!`)
+}
 
 /* Step 3: Check your work by un-commenting the following calls to consume(): */
-// consume(2,2,add); // 4
-// consume(10,16,multiply); // 160
-// consume("Mary","Poppins", greeting); // Hello Mary Poppins, nice to meet you!
+consume(2,2,add); // 4
+consume(10,16,multiply); // 160
+consume("Mary","Poppins", greeting); // Hello Mary Poppins, nice to meet you!
 
 
 // ==== Closures ==== 
 
 // Explain in your own words why `nestedfunction()` can access the variable `internal`.
 
-// Explanation: 
+// Explanation: due to closure, functions can reach outside to access variables defined outside of their own scope. Function B nested inside of function A can read variables defined in function A's scope.
 
 
 const external = "I'm outside the function";

challenges/objects-arrays.js

@@ -8,27 +8,54 @@
 
 // tyrannosaurus, carnivorous, 7000kg, 12m, Late Cretaceous
 
+const tRex = {
+  name: 'tyrannosaurus', 
+  diet: 'carnivorous', 
+  weight: '7000kg', 
+  length: '12m', 
+  period: 'Late Cretaceous'
+};
+
 // stegosaurus, herbivorous, 2000kg, 9m, Late Jurassic
 
+const stego = {
+  name: 'stegosaurus', 
+  diet: 'herbivorous', 
+  weight: '2000kg', 
+  length: '9m', 
+  period: 'Late Jurassic'
+};
+
 // velociraptor, carnivorous, 15kg, 1.8m, Late Cretaceous
 
+const velo = {
+  name: 'velociraptor', 
+  diet: 'carnivorous', 
+  weight: '15kg', 
+  length: '1.8m', 
+  period: 'Late Cretaceous'
+};
+
 // Using your dinosaur objects, log answers to these questions:
 
 // How much did tyrannosaurus weigh?
-console.log();
+console.log(tRex.weight);
 
 // What was the diet of a velociraptor?
-console.log();
+console.log(velo.diet);
 
 // How long was a stegosaurus?
-console.log();
+console.log(stego.length);
 
 // What time period did tyrannosaurus live in?
-console.log();
+console.log(tRex.period);
 
 
 // Create a new roar method for the tyrannosaurus.  When called, return "RAWERSRARARWERSARARARRRR!" Log the result.
-console.log();
+tRex.roar = () => {
+  return "RAWERSRARARWERSARARARRRR!";
+}
+console.log(tRex.roar());
 
 
 // ==== Arrays ====
@@ -50,20 +77,35 @@ const graduates = [{"id":1,"first_name":"Cynde","university":"Missouri Southern
 
 Once you have the new array created, sort the universities alphabetically and log the result. */
 const universities = [];
-console.log(universities)
+graduates.forEach((grad) => {
+  universities.push(grad.university);
+})
+universities.sort();
+console.log(universities);
 
 /* Request 2: Create a new array called contactInfo that contains both first name and email of each student. 
 
 The resulting contact information should have a space between the first name and the email information like this: 
 Name email@example.com
 
 Log the result of your new array. */
+
 const contactInfo = [];
+contactInfo.push(graduates.map((grad) => {
+  return `${grad.first_name} ${grad.email}`;
+}));
+
 console.log(contactInfo);
 
 
 /* Request 3: Find out how many universities have the string "Uni" included in their name. Create a new array called uni that contains them all. Log the result. */
 const uni = [];
+graduates.forEach((grad) => {
+  if (grad.university.includes('Uni')){
+    uni.push(grad.university);
+  };
+});
+
 console.log(uni);
 
 
@@ -89,6 +131,11 @@ The zoo wants to display both the scientific name and the animal name in front o
 
 */
 const animalNames = [];
+
+zooAnimals.forEach((animal) => {
+  animalNames.push(`Name: ${animal.animal_name}, Scientific: ${animal.scientific_name}.`)
+});
+
 console.log(animalNames);
 
 /* Request 2: .map()    
@@ -98,28 +145,47 @@ The zoos need a list of all their animal's names (names only, not scientific) co
 */
 
 const lowerCase = [];
+
+lowerCase.push(zooAnimals.map((animal) => {
+  return animal.animal_name.toLowerCase();
+}))
+
 console.log(lowerCase); 
 
 /* Request 3: .filter() 
 
-The zoos are concenred about animals with a lower population count. Find out which animals have a population less than 5.
+The zoos are concerned about animals with a lower population count. Find out which animals have a population less than 5.
 
 */
 const lowerPopulation = [];
+
+lowerPopulation.push(zooAnimals.filter((animal) => {
+  if (animal.population < 5){
+    return animal;
+  }
+}))
+
 console.log(lowerPopulation);
 
 /* Request 4: .reduce() 
 
 The zoos need to know their total animal population across the United States.  Find the total population from all the zoos using the .reduce() method.
 
 */
-const populationTotal = 0;
+const populationTotal = [];
+populationTotal.push(zooAnimals.reduce((acc, animal) => {
+  acc += animal.population;
+  return acc;
+}, 0))
+
 console.log(populationTotal);
 
 
 /* 
 
 Stretch: If you haven't already, convert your array method callbacks into arrow functions.
 
+Stretch Done!
+
 */
 

challenges/prototypes.js

@@ -6,28 +6,44 @@
   Create a constructor function named CuboidMaker that accepts properties for length, width, and height
 */
 
+function CuboidMaker (length, width, height) {
+  this.length = length;
+  this.width = width;
+  this.height = height;
+}
 
 /* == Step 2: Volume Method ==
   Create a method using CuboidMaker's prototype that returns the volume of a given cuboid's length, width, and height
 
   Formula for cuboid volume: length * width * height
 */
 
+CuboidMaker.prototype.volume = function(){
+  return this.length * this.width * this.height;
+}
+
 
 /* == Step 3: Surface Area Method ==
   Create another method using CuboidMaker's prototype that returns the surface area of a given cuboid's length, width, and height. 
 
   Formula for cuboid surface area of a cube: 2 * (length * width + length * height + width * height)
 */
 
+CuboidMaker.prototype.surfaceArea = function(){
+  return 2 * (this.length * this.width + this.length * this.height + this.width * this.height);
+}
+
 
 /* == Step 4: Create a new object that uses CuboidMaker ==
   Create a cuboid object that uses the new keyword to use our CuboidMaker constructor
   Add properties and values of length: 4, width: 5, and height: 5 to cuboid.   
 */
 
+const cuboid = new CuboidMaker(4, 5, 5);
+
+
 // Test your volume and surfaceArea methods by uncommenting the logs below:
-// console.log(cuboid.volume()); // 100
-// console.log(cuboid.surfaceArea()); // 130
+console.log(cuboid.volume()); // 100
+console.log(cuboid.surfaceArea()); // 130