-
Notifications
You must be signed in to change notification settings - Fork 9
🌟 Added explanation about tape terminilogy #12
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Open
Gbaja
wants to merge
4
commits into
master
Choose a base branch
from
deep-equal-explanation
base: master
Could not load branches
Branch not found: {{ refName }}
Loading
Could not load tags
Nothing to show
Loading
Are you sure you want to change the base?
Some commits from the old base branch may be removed from the timeline,
and old review comments may become outdated.
Open
Changes from all commits
Commits
Show all changes
4 commits
Select commit
Hold shift + click to select a range
File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,8 +1,6 @@ | ||
|
|
||
| **Author**: [@skibinska](https://github.com/skibinska) | ||
| **Maintainer**: [@skibinska](https://github.com/skibinska) | ||
|
|
||
|
|
||
| # FizzBuzz | ||
|
|
||
| Using Test Driven Development to solve FizzBuzz. | ||
|
|
@@ -17,37 +15,66 @@ One student starts by creating a single failing test and then the other writes c | |
|
|
||
| Before we start, and for the ones who are not familiar with the [FizzBuzz problem](https://en.wikipedia.org/wiki/Fizz_buzz), the idea is to write a function that takes a number and either returns the number _or_: | ||
|
|
||
| - for multiples of 3 returns the word **Fizz** instead of the number | ||
| - for multiples of 5 returns the word **Buzz** instead of the number | ||
| - for multiples of 3 and 5 returns the word **FizzBuzz**. | ||
| - for multiples of 3 we will display the word **Fizz** instead of the number, | ||
| - for multiples of 5 we will output **Buzz** instead of the number and | ||
| - for multiples of 3 and 5 we will display **FizzBuzz**. | ||
|
|
||
| An example: | ||
| ```javascript | ||
|
|
||
| ```js | ||
| fizzbuzz(1); // Output: 1 | ||
| fizzbuzz(2); // Output: 2 | ||
| fizzbuzz(3); // Output: Fizz | ||
| ``` | ||
|
|
||
| ## Defining the tool | ||
|
|
||
| **Test-driven development (TDD)** is a methodology or a software development process that is based on the **repetition** of the following tasks: | ||
|
|
||
| - write a simple test that defines an expected functionality/outcome | ||
| - make the test fail (it will fail as we haven’t written any code just yet!) | ||
| - write your code as simple as possible to make your test pass | ||
| - refactor your code and run the same test again (it should pass as even though is refactored the functionality should be the same). | ||
| * write a simple test that defines an expected functionality/outcome | ||
| * make the test fail (it will fail as we haven’t written any code just yet!) | ||
| * write your code as simple as possible to make your test pass | ||
| * refactor your code and run the same test again (it should pass as even though is refactored the functionality should be the same). | ||
|
|
||
| This is also called the **Red-Green-Refactor** cycle of TDD. | ||
|
|
||
|  | ||
|
|
||
| > The key concept is to write your **unit test before** you write a line of implementation **code**. | ||
|
|
||
| ## Tape Testing terminologies | ||
|
|
||
| * t.equal(actual, expected, msg) | ||
|
|
||
| Compares flat data structure and they have to be of the same data type. It uses the === operator. | ||
|
|
||
| * t.deepEqual(actual, expected, msg) | ||
|
|
||
| It is used for testing nested data structure. Deep equal would look into all items within the object no matter how deeply nested they are and check that all the items are the same. It uses the === operator. | ||
|
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Sweet, nice additions here! One small change I would make is replacing the word items with properties. It's the fancy pants name for key/value pairs. |
||
|
|
||
| See example below for an example of a nested object. | ||
|
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 👌 |
||
|
|
||
| ```js | ||
| var object = { | ||
| baz: { | ||
| foo: { | ||
| bar: 5 | ||
| } | ||
| } | ||
| } | ||
| ``` | ||
|
|
||
| * t.end(err) | ||
|
|
||
| Declare the end of a test explicitly. If err is passed in t.end will assert that it is falsey. | ||
|
|
||
| ## Let’s get started! | ||
|
|
||
| ### 1. Clone | ||
|
|
||
| Clone the repository by copy-pasting the following command into your terminal: | ||
| ``` | ||
|
|
||
| ```js | ||
| git clone https://github.com/foundersandcoders/fizzbuzz.git && cd fizzbuzz | ||
| ``` | ||
|
|
||
|
|
@@ -63,21 +90,22 @@ Run the example test with: | |
|
|
||
| We will start by writing the most simple unit test of all, a unit test that will output the first number: | ||
|
|
||
| ```javascript | ||
| test('Testing fizzbuzz return value', function(t) { | ||
| ```js | ||
| test("Testing fizzbuzz return value", function(t) { | ||
| var actual = fizzbuzz(1); | ||
| var expected = 1; | ||
| t.equal(actual, expected, 'Should return 1 when given 1'); | ||
| t.equal(actual, expected, "Should return 1 when given 1"); | ||
| t.end(); | ||
| }); | ||
| ``` | ||
|
|
||
| **Run the test with `npm test`** | ||
|
|
||
| Our first fail is because **fizzbuzz doesn't return anything**. | ||
|
|
||
| So we need to add to the function in `index.js`: | ||
| So we need to add to the function in `index.js`: | ||
|
|
||
| ```javascript | ||
| ```js | ||
| function fizzbuzz() { | ||
| return 1; | ||
| } | ||
|
|
@@ -93,28 +121,30 @@ Let’s now get the first two numbers. | |
|
|
||
| Add a unit test to `test.js` to check if our function returns 2: | ||
|
|
||
| ```javascript | ||
| test('Testing fizzbuzz return value', function(t) { | ||
| ```js | ||
| test("Testing fizzbuzz return value", function(t) { | ||
| var actual = fizzbuzz(2); | ||
| var expected = 2; | ||
| t.equal(actual, expected, 'Should return 2 when given 2'); | ||
| t.equal(actual, expected, "Should return 2 when given 2"); | ||
| t.end(); | ||
| }); | ||
| ``` | ||
|
|
||
| The test fails because it expects **2** but gets **1**. | ||
|
|
||
| We need to write just enough code to pass this test. | ||
|
|
||
| Update `index.js`: | ||
|
|
||
| ```javascript | ||
| ```js | ||
| function fizzbuzz(number) { | ||
| if (number === 2) { | ||
| return 2; | ||
| } | ||
| return 1; | ||
| } | ||
| ``` | ||
|
|
||
| That does just enough to pass the test. | ||
|
|
||
| #### Iteration 3 | ||
|
|
@@ -123,29 +153,30 @@ Well, that was easy, but we're not quite there yet. Let’s now get the first th | |
|
|
||
| Let's write a test: | ||
|
|
||
| ```javascript | ||
| test('Testing fizzbuzz return value', function(t) { | ||
| ```js | ||
| test("Testing fizzbuzz return value", function(t) { | ||
| var actual = fizzbuzz(3); | ||
| var expected = 'Fizz'; | ||
| t.equal(actual, expected, 'Should return Fizz when given 3'); | ||
| var expected = "Fizz"; | ||
| t.equal(actual, expected, "Should return Fizz when given 3"); | ||
| t.end(); | ||
| }); | ||
| ``` | ||
|
|
||
| The test fails because it expects **Fizz** but gets **1**. | ||
|
|
||
| Let's write enough code to pass this test. | ||
|
|
||
| ```javascript | ||
| ```js | ||
| function fizzbuzz(number) { | ||
| if (number === 3) { | ||
| return "Fizz"; | ||
| } | ||
| else if (number === 2) { | ||
| } else if (number === 2) { | ||
| return 2; | ||
| } | ||
| return 1; | ||
| } | ||
| ``` | ||
|
|
||
| Good stuff; our tests pass but our code is getting harder to read (this is where the last step in each iteration comes on board: refactoring), | ||
|
|
||
| > **refactoring** means rearranging our code so it's easily readable by us (humans); | ||
|
|
@@ -154,22 +185,22 @@ so how can we make this easier to read? | |
|
|
||
| I’m thinking of removing one of the if/else statements, let’s try that: | ||
|
|
||
| ```javascript | ||
| ```js | ||
| function fizzbuzz(number) { | ||
| if (number === 3) { | ||
| if (number === 3) { | ||
| return "Fizz"; | ||
| } | ||
| else { | ||
| } else { | ||
| return number; | ||
| } | ||
| } | ||
| ``` | ||
|
|
||
| Isn’t this easier to read? Yes! Running our unit tests confirm that we haven’t broken anything as all of them still pass. | ||
|
|
||
| Once you have your process nailed: | ||
|
|
||
| - Write a test and watch it fail | ||
| - Write just enough code to pass the test (without breaking any other test that was already passing!) | ||
| * Write a test and watch it fail | ||
| * Write just enough code to pass the test (without breaking any other test that was already passing!) | ||
|
|
||
| Continue writing tests and refactoring until you have a `fizzbuzz` function that works for any number. | ||
|
|
||
|
|
||
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
What do you mean here about them being the same data types? You could compare two different data types but it would return false.