From 009aa0d5db0673c289740bec483177f7d5fcf930 Mon Sep 17 00:00:00 2001 From: hruy28 Date: Fri, 2 Dec 2016 00:20:15 +0100 Subject: [PATCH 1/4] changes tosolve the bugs --- .../__tests__/bug-challenge-tests.js | 2 +- .../bug-challenge-es6/bug-challenge.js | 135 ++++++++++++------ 2 files changed, 91 insertions(+), 46 deletions(-) diff --git a/fundamentals/bug-challenge-es6/__tests__/bug-challenge-tests.js b/fundamentals/bug-challenge-es6/__tests__/bug-challenge-tests.js index 93c9d5480..bacee1532 100644 --- a/fundamentals/bug-challenge-es6/__tests__/bug-challenge-tests.js +++ b/fundamentals/bug-challenge-es6/__tests__/bug-challenge-tests.js @@ -102,7 +102,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..98438c6ec 100644 --- a/fundamentals/bug-challenge-es6/bug-challenge.js +++ b/fundamentals/bug-challenge-es6/bug-challenge.js @@ -41,33 +41,43 @@ 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()); + console.log(array.pop()); + console.log(array.pop()); + 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'; + const array = []; + array[0] = 0; + array[1] = 1; + array[2] = 2; let total = 0; - for (let key in obj) { + for (let key of array) { total += key; } console.log(total); } - + /* bug3: First I replace the empty curly bracket with an empty square bracket as it is an array. + Second I replace the string values with number values so that it can perform addition. Third + I replace the keyword 'in' with 'of'. */ + bug4() { // We list all movies, except the top 3. var index = 3; @@ -76,14 +86,17 @@ export default class BugChallenge { } // We also list all actors, except the top 3. - for (index; index < top10Actors.length; index++) { + var index = 3; + for (index; index < this.top10Actors.length; index++) { console.log(`actor: ${this.top10Actors[index]}`); } } - + /* bug4: The first for loop was working but the second one was saying undefined as we have not + specified the starting for the loop that is the the third index.*/ + bug5() { const defaultMethod = 'GET'; - const defaultUseCaching = true; + const defaultUseCaching = false; function fetch(options) { const url = options.url; @@ -98,9 +111,10 @@ export default class BugChallenge { useCaching: false }); } - + // bug5: I changed the default value for caching to false as the test was to disable caching for fetch. + bug6() { - function run(options) { + function run(options = {}) { if (options.script == undefined) { options.script = 'main.js'; } @@ -110,28 +124,37 @@ 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}); } - + /* bug7: The comparison operator inside the if statement must compare for the exact value and + type '===' inorder to run the second callback*/ + bug8() { - for (var i = 0; i < 5; i++) { - setTimeout(function () { - console.log(i+1); - }, 100*i); - } + for (var i = 1; i <= 5; i++) { + setDelay(i); + } + function setDelay(i) { + setTimeout(function () { + console.log(i); + }, 100); + + } } - + /* bug8: It set the timeout from within a function as the previous code has drawbacks. It printed the + number 6 five times as the variables passed don't keep their intial value.*/ + bug9() { const cars = [{ make: 'Volvo', @@ -148,27 +171,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() { @@ -177,8 +207,8 @@ export default class BugChallenge { addPlayers(names) { names.forEach(function (name) { - this.players.push({name, points: 0}); - }); + this.players.push({name, points: 0}); + }, this); } } @@ -189,13 +219,16 @@ export default class BugChallenge { console.log(`Player ${player.name} has ${player.points} points`); } } - + /* bug11: this.players fails, because the function’s this is undefined, it is not the same as the + this of the constructor. This method has a second parameter whose value is passed to the + callback as this.*/ + bug12() { let y = 5; function printVector() { let x = 6; - y = 7; + let y = 7; console.log(`Printing vector at (${x}, ${y})`); } @@ -203,35 +236,47 @@ 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: I put the console log within the function so as it can print after the function is executed. + Before it was returnig error message as it was outside the function.*/ + 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: When I changed the anonymous function to an arrow function it works. But how it + works is a puzzle to me. I need an explanation on this one.*/ + 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 + 4}`) } + /* 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 and returning 4. But the real ranking is + that he is first because of the previous function which has ranked them based on alphabet.*/ } From 79e8336e7f36572a87a116c1b300a3321f69d5be Mon Sep 17 00:00:00 2001 From: hruy28 Date: Fri, 2 Dec 2016 19:29:04 +0100 Subject: [PATCH 2/4] Changes to the codes based on joost suggestions --- .../__tests__/bug-challenge-tests.js | 5 +- .../bug-challenge-es6/bug-challenge.js | 73 +++++++++---------- 2 files changed, 37 insertions(+), 41 deletions(-) diff --git a/fundamentals/bug-challenge-es6/__tests__/bug-challenge-tests.js b/fundamentals/bug-challenge-es6/__tests__/bug-challenge-tests.js index bacee1532..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", () => { diff --git a/fundamentals/bug-challenge-es6/bug-challenge.js b/fundamentals/bug-challenge-es6/bug-challenge.js index 98438c6ec..7b72ff182 100644 --- a/fundamentals/bug-challenge-es6/bug-challenge.js +++ b/fundamentals/bug-challenge-es6/bug-challenge.js @@ -50,44 +50,40 @@ export default class BugChallenge { bug2() { const array = [1, 2, 3, 4]; - for (let i = 0; i < array.length; i++) { - console.log(array.pop()); - console.log(array.pop()); - console.log(array.pop()); - 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] = 0; - array[1] = 1; - array[2] = 2; - + array[0] = 'a'; + array[1] = 'b'; + array[2] = 'c'; + + let total = 0; - for (let key of array) { - total += key; + for (let key in array) { + total = ++key; } console.log(total); } /* bug3: First I replace the empty curly bracket with an empty square bracket as it is an array. - Second I replace the string values with number values so that it can perform addition. Third - I replace the keyword 'in' with 'of'. */ + 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. - var index = 3; - for (index; index < this.top10Actors.length; index++) { + + for (let index = 3; index < this.top10Actors.length; index++) { console.log(`actor: ${this.top10Actors[index]}`); } } @@ -96,12 +92,12 @@ export default class BugChallenge { bug5() { const defaultMethod = 'GET'; - const defaultUseCaching = false; + const defaultUseCaching = true; function fetch(options) { const url = options.url; const method = options.method || defaultMethod; - const useCaching = options.useCaching || defaultUseCaching; + const useCaching = options.useCaching; console.log(`fetch: ${method} ${url} (useCaching=${useCaching})`); } @@ -111,7 +107,10 @@ export default class BugChallenge { useCaching: false }); } - // bug5: I changed the default value for caching to false as the test was to disable caching for fetch. + + /* 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 = {}) { @@ -141,19 +140,15 @@ export default class BugChallenge { /* bug7: The comparison operator inside the if statement must compare for the exact value and type '===' inorder to run the second callback*/ - bug8() { - for (var i = 1; i <= 5; i++) { - setDelay(i); - } - function setDelay(i) { - setTimeout(function () { - console.log(i); - }, 100); - - } + bug8() { + for (let i = 0; i < 5; i++) { + setTimeout(() => { + console.log(i+1); + }, 100*i); + } } - /* bug8: It set the timeout from within a function as the previous code has drawbacks. It printed the - number 6 five times as the variables passed don't keep their intial value.*/ + /* 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 = [{ @@ -206,9 +201,9 @@ export default class BugChallenge { } addPlayers(names) { - names.forEach(function (name) { + names.forEach((name) => { this.players.push({name, points: 0}); - }, this); + }); } } @@ -258,8 +253,8 @@ export default class BugChallenge { console.log('Godfather is ' + (isInFirstPlace('Godfather')?'':'not ') + 'best movie ever'); } - /* bug14: I put the console log within the function so as it can print after the function is executed. - Before it was returnig error message as it was outside the function.*/ + /* 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 = () => { @@ -273,7 +268,7 @@ export default class BugChallenge { bug16() { const ranking = this.top10Actors.indexOf('Al Pacino'); - console.log(`Al Pacino is ranked ${ranking + 4}`) + 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'. From b1b5ffdb1da3c425721c319acb4aeadb850b51fd Mon Sep 17 00:00:00 2001 From: hruy28 Date: Fri, 2 Dec 2016 19:48:55 +0100 Subject: [PATCH 3/4] changes in the comment --- .../bug-challenge-es6/bug-challenge.js | 20 +++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/fundamentals/bug-challenge-es6/bug-challenge.js b/fundamentals/bug-challenge-es6/bug-challenge.js index 7b72ff182..a289166cb 100644 --- a/fundamentals/bug-challenge-es6/bug-challenge.js +++ b/fundamentals/bug-challenge-es6/bug-challenge.js @@ -87,8 +87,8 @@ export default class BugChallenge { console.log(`actor: ${this.top10Actors[index]}`); } } - /* bug4: The first for loop was working but the second one was saying undefined as we have not - specified the starting for the loop that is the the third 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'; @@ -214,9 +214,8 @@ export default class BugChallenge { console.log(`Player ${player.name} has ${player.points} points`); } } - /* bug11: this.players fails, because the function’s this is undefined, it is not the same as the - this of the constructor. This method has a second parameter whose value is passed to the - callback as this.*/ + /* 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; @@ -243,7 +242,7 @@ export default class BugChallenge { 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. */ + not found that means it index is equal to -1 and prints out as not found within the top 10. */ bug14() { var isInFirstPlace = (movieName) => { @@ -263,8 +262,9 @@ export default class BugChallenge { console.log(`The first actor when sorted alphabetically is ${getAlphabeticalFirst()}`) } - /* bug15: When I changed the anonymous function to an arrow function it works. But how it - works is a puzzle to me. I need an explanation on this one.*/ + /* 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'); @@ -272,6 +272,6 @@ export default class BugChallenge { } /* 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 and returning 4. But the real ranking is - that he is first because of the previous function which has ranked them based on alphabet.*/ + Now it is adding the index of the passed parameter(3) and adding 1 to return 4. + */ } From 651437100a402bebc3a98ae58b2942ba9781d241 Mon Sep 17 00:00:00 2001 From: hruy28 Date: Sun, 4 Dec 2016 22:59:17 +0100 Subject: [PATCH 4/4] changes in bug 3 and bug 5 --- fundamentals/bug-challenge-es6/bug-challenge.js | 13 ++++++++----- 1 file changed, 8 insertions(+), 5 deletions(-) diff --git a/fundamentals/bug-challenge-es6/bug-challenge.js b/fundamentals/bug-challenge-es6/bug-challenge.js index a289166cb..fc09a75b0 100644 --- a/fundamentals/bug-challenge-es6/bug-challenge.js +++ b/fundamentals/bug-challenge-es6/bug-challenge.js @@ -58,7 +58,7 @@ export default class BugChallenge { it prints out the last element in the array. So that it is reversed.*/ bug3() { - const array = []; + const array = {}; array[0] = 'a'; array[1] = 'b'; array[2] = 'c'; @@ -66,7 +66,7 @@ export default class BugChallenge { let total = 0; for (let key in array) { - total = ++key; + total += parseInt(key); } console.log(total); @@ -97,15 +97,18 @@ export default class BugChallenge { function fetch(options) { const url = options.url; const method = options.method || defaultMethod; - const useCaching = options.useCaching; + 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