frontendmasters/fm-snippets

Code snippets for course annotations.

fm-snippets's Issues

generic countBy instead of a hard coded "odd" or "even" solution

When working through the callback exercises, I came across Challenge 14 described below

Challenge 14

Create a function countBy that accepts an array and a callback, and returns an object. countBy will iterate through the array and perform the callback on each element. Each return value from the callback will be saved as a key on the object. The value associated with each key will be the number of times that particular return value was returned.

and the solution provided is as follows

function countBy(array, callback) {
  let result = {};
  let odd = 0;
 let even = 0;
 for (let num of array) {
  let key = callback(num);
  key === "odd" ? (result[key] = ++odd) : (result[key] = ++even);
 }
  return result;
}

This is not a generic solution as it looks for a hardcoded "odd" key

i.e.

const isEvenOdd = num => num %2 === 0 ? "even" : "odd"
console.log(countBy([1,2,3,4,5], isEvenOdd)) // logs : { odd: 3, even: 5 }

but this solution fails for other callbacks passed
eg:

const fizzBuzz = (num) => {
 if(num % 3 === 0 && num % 5 === 0) { return "FizzBuzz" }
  else if(num % 3 === 0) { return "Fizz" }
  else if(num % 5 === 0) { return "Buzz" }
  else { return "Others" }
}

console.log(countBy([12, 13, 14, 15, 16, 17, 18, 19, 20], fizzBuzz)) // should log : {Fizz: 2, Others: 5, FizzBuzz: 1, Buzz: 1}

Issue in challenge 23 of callback.js file

in the If case, the solution code is returning 1 directly instead of the index of the current element(i) as mentioned in the problem statement.

The challenge description:

Define a function myFunc that takes an array and a callback. myFunc should pass each element from the array (in order) into the callback. If the callback returns true, myFunc should return the index of the current element. If the callback never returns true, myFunc should return -1;

Below is the code mentioned in the solution:

function myFunc(array, callback) {
for (let i = 0; i < array.length; i++) {
if (callback(array[i])) return 1;
}
return -1;
}

Issue in Challenge 4 in callbacks.js

The description of the challenge states that the function must not return anything.

Challenge 4 decription:

Create a function called forEach that takes an array and a callback, and runs the callback on each element of the array. forEach does not return anything.

However the solution clearly has a return keyword.
Challenge 4 solution:

function forEach(array, callback) {
	let arr = []
  for(let i=0; i<array.length; i++) {
    arr.push(callback(array[i]))
  }
	return arr
}

Also for challenge 5, the definition states that I should use the forEach however without forEach returning the challenge is not possible.

Challenge 5 decription:

In challenge 3, you've created a function called map. In this challenge, you're going to rebuild the map function by creating a function called mapWith. This time you're going to use forEach inside of mapWith instead of using a for loop.

I don't know whether the challenges description are wrong or the provided solution but there is a mismatch.

Missing part of assignment.

fm-snippets/2018-01-22-javascript-hard-parts/fem-JavaScriptTheHardParts-ClosuresSolutions.js

Line 106 in 0286522

function delay(func, wait) {

Hi, in the solution you are missing part of the assignment that says to pass any arguments after wait to the callback function.

Challenge 3 Part 2 solution is not correct

The Challenge 3 Part 2 solution does not accurately imitate the behavior of setInterval. I found something like:

const sayHowdy = () => console.log("Howdy")

function everyXsecsForYsecs(callback, intervalTime, totalTime) {
  for (let i = 0; i < totalTime/intervalTime; i++) {
    setTimeout(sayHowdy, (intervalTime * (1000 * i)))
  }
}

everyXsecsForYsecs(sayHowdy, 3, 13) // howdy logs 5 times
everyXsecsForYsecs(sayHowdy, 3, 20) // howdy logs 7 times

This solution is obviously going to be somewhat inaccurate when it comes to running the callback function PRECISELY as many times as you'd want it to, but the behavior is much closer to setInterval I think.

Anyone please correct me if I'm wrong!

[JavaScript the Hard Parts] Refactor intersection to use reduce

How to refactor intersection code as suggested @ CSBin so that it uses reduce?

See code here

fm-snippets/2018-01-22-javascript-hard-parts/fem-JavaScriptTheHardParts-CallbacksSolutions.js

Lines 62 to 82 in 0286522

	// Extension 3 //
	function intersection(arrays) {
	//note: 'arguments' is a built-in object corresponding, in this case, to what was passed in for arrays
	let result = [];
	for (let k = 1; k < arguments.length - 1; k++) { //loops through arrays
	//console.log(arrays[k]);
	for (let i = 0; i < arguments[0].length; i++) { //loops through first array
	for (let j = 0; j < arguments[k].length; j++) { //loops through k'th array
	if (arguments[0][i] === arguments[k][j]) { //checks if the value is the same as in the first array
	if (!result.includes(arguments[0][i])) { //checks if number is already noted
	result.push(arguments[0][i]) //adds the number to our array with elements in all arrays
	}
	}
	}
	}
	}
	return result;
	}
	console.log(intersection([5, 10, 15, 20], [15, 88, 1, 5, 7], [1, 10, 15, 5, 20]));
	// should log: [5, 15]

intersection doesn't look at all arrays

intersection will not look at last array because you substract 1 from length of arguments. If you had 4 arrays which would be similar to removing the -1 on arguments, the solution produces a result with numbers not
in second array

challenge 9

In challenge 9, it doesn't log what it is considered to.
should log: { hi: 'HI', bye: 'BYE', later: 'LATER' } but logs {bye: 'BYE', later: 'LATER' }

Comment Questions in the solutions file.

Presently, I am working on the closure.js file in the javascript-hard-parts, I think it would be preferable to have the questions commented above the solutions provided just for easier learning. Thank you.

OOP Exercise Solution Not Working

The following solution, although it's correct, does not seem to be working for me:

fm-snippets/2018-01-22-javascript-hard-parts/fem-JavaScriptTheHardParts-OOPSolutions.js

Lines 107 to 110 in e1b4b77

	/*** CHALLENGE 3 of 3 ***/
	PersonConstructor.prototype.introduce = function () {
	console.log("Hi, my name is " + this.name)
	}

I get the following error:
Type Error on line 132: mike.introduce is not a function

The intersection solution is not correct

The current solution for the intersection only works with two arrays.
The -1 from the length means there will always be one item left in the array.
for (let k = 1; k < arguments.length - 1; k++)

The condition only checks the item of first array against the other arrays in sequence, if an item from any array matches an item from the first array it will return true. There is no check for an item to exist in all array.
if (arguments[0][i] === arguments[k][j])

Why should we define step

https://github.com/FrontendMasters/fm-snippets/blame/60b530b794cad7ffd435effc0c988f99531226a1/javascript-hard-parts-v2/closures.js#L54

do we need to define step here?
wouldn't be sufficient to have the function like this

function addByX(x) {
	function addBy(input) {
    return input + x
  }
  return addBy
}

Challenge 3-part2 solution in Asynchronocity solutions doesn't work as expected

The solution to part2 of challenge 3 in asynchronocity exercise in hardparts doesn't work as expected. It doesn't print "Howdy" messages at the interval of 2 seconds. It print all 5 at the sametime after the "End of Challenge 3" message gets logged.