Code Monkey home page Code Monkey logo

kata-objects-and-arrays's Introduction

Kata: Objects and Arrays

Introduction

In this exercise we'll practise some of the fundamentals of JavaScript and start learning about automated testing. We're going to start getting used to seeing tests coloured RED, and writing code to make them go GREEN.

Installation

First, in your terminal, navigate to your workspace directory and clone the repository from GitHub. Don't forget, you can use the TAB key to complete long directory names (but not GitHub URLs!).

cd workspace
git clone https://github.com/[COHORT-YEAR]/kata-objects-and-arrays
cd kata-objects-and-arrays
git checkout -b "YOURNAME_YOURPARTNERSNAME"
npm install

The last command installs a bunch of stuff that you'll need to make the exercise work correctly.

The first test

To run the first test from your terminal:

npm test getGreeting

You'll see some red output that looks like this:

 FAIL  tests/getGreeting.test.js
  ✕ getGreeting returns "Hello <name>" (4ms)

  ● getGreeting returns "Hello <name>"

    expect(received).toBe(expected)

    Expected value to be (using ===):
      "Hello Aardvark"
    Received:
      undefined

    Difference:

      Comparing two different types of values. Expected string but received undefined.

Test Suites: 1 failed, 1 total
Tests:       1 failed, 1 total
Snapshots:   0 total
Time:        0.619s, estimated 1s
Ran all test suites matching /getGreeting/i.

Active Filters: filename /getGreeting/
 › Press c to clear filters.

Watch Usage
 › Press a to run all tests.
 › Press o to only run tests related to changed files.
 › Press p to filter by a filename regex pattern.
 › Press t to filter by a test name regex pattern.
 › Press q to quit watch mode.
 › Press Enter to trigger a test run.

The most important thing is not to panic! Welcome to your first introduction to testing. In this challenge, you're going to make all the tests go GREEN. It's rather addictive once you get started.

Kata

Kata is a concept from martial arts meaning a sequence of moves composed into a form. Martial artists practise katas to build a "muscle-memory" for the basic moves. By practicing katas the artist hopes to make the basics of their art instinctual. When danger strikes the basics will be so familiar that they can respond without thinking.

The file you'll be working in is kata.js. This file is full of incomplete functions with comments describing what they should do. Every time you run the tests (using npm test nameOfTheFunctionYoureWorkingOn) you're checking to see if you've completed each function correctly. When you finish it successfully, it will show up GREEN and you can move on to the next function.

Let's try it! Open kata.js in your editor. The first function looks like this:

// getGreeting should return a string containing 'Hello ' and the contents of `name`
function getGreeting (name) {
}

Ok, so it wants us to return a string using the input parameter name. Let's solve it so we can make the test go GREEN:

function getGreeting (name) {
  return 'Hello ' + name
}

You'll notice that when you save kata.js your terminal indicates the test is now passing.

 PASS  tests/getGreeting.test.js
  ✓ getGreeting returns "Hello <name>" (1ms)

Test Suites: 1 passed, 1 total
Tests:       1 passed, 1 total
Snapshots:   0 total
Time:        0.069s, estimated 1s
Ran all test suites matching /getGreeting/i.

Watch Usage: Press w to show more.

One passed! Some coding pairs choose to treat these as high-five moments ... you can decide for yourselves.

Now you should press the q key in the terminal to stop the test runner (w will show you all the options) and you can move on to the next function.

This way we can practise the basics of JavaScript and build up our muscle memory:

  • read what the next function is supposed to do
  • run the tests using npm test nameOfTheFunctionYoureWorkingOn
  • think and talk about how to solve the problem
  • write the code and save the file
  • read any errors and keep trying
  • rinse and repeat until all the tests pass

In later challenges we're going to become a lot more familiar with this process. A pattern very similar to this is known as Test Driven Development (TDD).

Remember to ask for help sooner rather than later if you get stuck. Don't stay blocked beyond where your learning is benefiting.

Making sure you're finished

To run all of the tests for all of the functions you've written, in terminal run:

npm test tests

This will run all tests in the tests directory.

Useful Links

The following links may help with the less familiar aspects of this challenge:

kata-objects-and-arrays's People

Contributors

richchurcher avatar mixmix avatar pietgeursen avatar don-smith avatar bryceknz avatar chasm avatar rjoe19 avatar marvin-c avatar

Watchers

James Cloos avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.