diff --git a/fundamentals/bug-challenge-es6/__tests__/bug-challenge-tests.js b/fundamentals/bug-challenge-es6/__tests__/bug-challenge-tests.js index 93c9d5480..f4cfcee69 100644 --- a/fundamentals/bug-challenge-es6/__tests__/bug-challenge-tests.js +++ b/fundamentals/bug-challenge-es6/__tests__/bug-challenge-tests.js @@ -1,14 +1,15 @@ import BugChallenge from '../bug-challenge'; import '../jest-helpers'; -const challenge = new BugChallenge(); - describe('Bug challenge ES6', () => { + let challenge; beforeEach(() => { console.clear(); + challenge = new BugChallenge(); }); + describe('bug1', () => { it("should list the names and ages of people", () => { @@ -102,7 +103,7 @@ describe('Bug challenge ES6', () => { describe('bug7', () => { it("should first run with stopOnError=all and then with stopOnError=null", () => { - challenge.bug6(); + challenge.bug7(); expect(console.logs).toEqual([ 'run: stopOnError=all', diff --git a/fundamentals/bug-challenge-es6/bug-challenge.js b/fundamentals/bug-challenge-es6/bug-challenge.js index a08418a39..fc09a75b0 100644 --- a/fundamentals/bug-challenge-es6/bug-challenge.js +++ b/fundamentals/bug-challenge-es6/bug-challenge.js @@ -41,46 +41,55 @@ export default class BugChallenge { age: 40 }]; - for (let person in people) { + for (let person of people) { console.log(`${person.name} is ${person.age}`); } } - + /* bug1: I replace the keyword 'in' within the for loop with 'of' */ + bug2() { const array = [1, 2, 3, 4]; - - for (let i = 0; i < array.length; i++) { - console.log(array.pop()); - } + + while (array.length > 0) { + console.log(array.pop()); + } } - + /* bug2: I used console log and the functions pop() so that every time the function loops + it prints out the last element in the array. So that it is reversed.*/ + bug3() { const array = {}; array[0] = 'a'; array[1] = 'b'; array[2] = 'c'; - + + let total = 0; - for (let key in obj) { - total += key; + for (let key in array) { + total += parseInt(key); } console.log(total); } - + /* bug3: First I replace the empty curly bracket with an empty square bracket as it is an array. + Then I increment the index number of the array and assigned it to the variable total. */ + bug4() { // We list all movies, except the top 3. - var index = 3; - for (index; index < this.top10Movies.length; index++) { + + for (let index = 3; index < this.top10Movies.length; index++) { console.log(`movie: ${this.top10Movies[index]}`); } // We also list all actors, except the top 3. - for (index; index < top10Actors.length; index++) { + + for (let index = 3; index < this.top10Actors.length; index++) { console.log(`actor: ${this.top10Actors[index]}`); } } - + /* bug4: I declared the index variable within both for loop and intialize it with 3. So that we + can eliminate the first 3 movies. */ + bug5() { const defaultMethod = 'GET'; const defaultUseCaching = true; @@ -88,19 +97,26 @@ export default class BugChallenge { function fetch(options) { const url = options.url; const method = options.method || defaultMethod; - const useCaching = options.useCaching || defaultUseCaching; + const useCaching = options.useCaching && options.defaultUseCaching ; console.log(`fetch: ${method} ${url} (useCaching=${useCaching})`); } + fetch({ url: 'http://www.example.com', - useCaching: false - }); + useCaching: false, + }); + + } + /* bug5: I deleted the default value for caching on the const 'useCaching'. Although I need more explanation + on this. And I hope I have done the right thing here. */ + + bug6() { - function run(options) { + function run(options = {}) { if (options.script == undefined) { options.script = 'main.js'; } @@ -110,28 +126,33 @@ export default class BugChallenge { run(); } - + /* bug6: I have declared the script property within the parameter and as an empty bracket. + So it is undefined which meets the if statement.*/ + bug7() { function run(options = {}) { - if (options.stopOnError == undefined) { + if (options.stopOnError === undefined) { options.stopOnError = 'all'; - } - - console.log(`run: stopOnError=${options.stopOnError}`); + } + console.log(`run: stopOnError=${options.stopOnError}`); } - + run(); run({stopOnError: null}); } - - bug8() { - for (var i = 0; i < 5; i++) { - setTimeout(function () { + /* bug7: The comparison operator inside the if statement must compare for the exact value and + type '===' inorder to run the second callback*/ + + bug8() { + for (let i = 0; i < 5; i++) { + setTimeout(() => { console.log(i+1); }, 100*i); } } - + /* bug8: I replaced 'var' with the keyword 'let' so that it can be used only with function. And I + also replaced the anonymous function with the arrow function.*/ + bug9() { const cars = [{ make: 'Volvo', @@ -148,27 +169,34 @@ export default class BugChallenge { }]; function findCars(make) { - return cars.filter(car => car.make = make); + return cars.filter(car =>car.make === make); } for (let bmw of findCars('BMW')) { console.log(`${bmw.make} ${bmw.type}`); } } - + /*bug9: The argument 'BMW' should be equal to the property of the cars.make and not assigned as it + used to print them all as having the same value 'BMW' */ + bug10() { const command = 'printHelp'; switch (command) { case 'printMath': console.log(`√9=${Math.sqrt(9)}`); + break; case 'printHelp': console.log('Help'); + break; case 'quit': console.log('Quitting'); + break; } } - + /* bug10: The original code doesn't have the keyword 'break;' and the exection would go continously. + I add the keyword 'break' so that the exection can stop when a match is found.*/ + bug11() { class Game { constructor() { @@ -176,8 +204,8 @@ export default class BugChallenge { } addPlayers(names) { - names.forEach(function (name) { - this.players.push({name, points: 0}); + names.forEach((name) => { + this.players.push({name, points: 0}); }); } } @@ -189,13 +217,15 @@ export default class BugChallenge { console.log(`Player ${player.name} has ${player.points} points`); } } - + /* bug11: this.players fails, because the function’s this is undefined, outside the function. + Adding the arrow function lets you to use the player property outside. */ + bug12() { let y = 5; function printVector() { let x = 6; - y = 7; + let y = 7; console.log(`Printing vector at (${x}, ${y})`); } @@ -203,35 +233,48 @@ export default class BugChallenge { printVector(); console.log(`y=${y}`); } - + /* bug12: I added the keyword let for the value 7 so that it can only be used within the function. */ + bug13() { var notInTop10 = (movieName) => { - return !this.top10Movies.indexOf(movieName) + return this.top10Movies.indexOf(movieName) === -1 } console.log('Independence Day is ' + (notInTop10('Independence Day')?'not ':'') + 'in the top 10!'); console.log('AI is ' + (notInTop10('AI')?'not ':'') + 'in the top 10!'); console.log('Godfather is ' + (notInTop10('Godfather')?'not ':'') + 'in the top 10!'); console.log('Inception is ' + (notInTop10('Inception')?'not ':'') + 'in the top 10!'); } + /* bug13: The index of the first occurrence of the specified value if not found is -1. If the index is + not found that means it index is equal to -1 and prints out as not found within the top 10. */ + bug14() { - - console.log('AI is ' + (isInFirstPlace('AI')?'':'not ') + 'best movie ever') - console.log('Godfather is ' + (isInFirstPlace('Godfather')?'':'not ') + 'best movie ever') var isInFirstPlace = (movieName) => { return this.top10Movies[0] === movieName - } + } + console.log('AI is ' + (isInFirstPlace('AI')?'':'not ') + 'best movie ever'); + console.log('Godfather is ' + (isInFirstPlace('Godfather')?'':'not ') + 'best movie ever'); + } + /* bug14:Putting the console.log statements after the function declaration solved the problem. That is + because functions are hoisted up, and variables are not (only their declaration is).*/ + bug15() { - var getAlphabeticalFirst = function() { - return this.top10Actors.sort()[0] + var getAlphabeticalFirst = () => { + return this.top10Actors.sort()[0]; } console.log(`The first actor when sorted alphabetically is ${getAlphabeticalFirst()}`) } + /* bug15: using an arrow function makes sure that whatever is `this` outside of the function, is + also `this` inside the function. If you use `function`, the function will have a very different + `this`. That's one of the advantages of using the arrow functions.*/ + bug16() { const ranking = this.top10Actors.indexOf('Al Pacino'); - // var thirdRankedActor = this.top10Actors['2']; - console.log(`Al Pacino is ranked ${ranking + '1'}`) + console.log(`Al Pacino is ranked ${ranking + 1}`) } + /* bug16: Before the number 1 was within a string so it was concatenated. The result was '31'. + Now it is adding the index of the passed parameter(3) and adding 1 to return 4. + */ }