Skip to content

Latest commit

 

History

History
124 lines (89 loc) · 5.49 KB

File metadata and controls

124 lines (89 loc) · 5.49 KB

Homework Week 5

Here you find the readings you have to complete before the sixth lecture.

Step 0

All share a video or a resource (this can be a drawing, article or a pod cast) that was helpful for you the last few weeks with learning JavaScript. Please share this in the channel of your class in Slack. Also write as small note about what the resource i about and why you think it's so helpful (you can share more than one if you like).

Step 1

  1. We learned a little bit about callbacks in JS. A callback is simply a function passed to another function that gets executed (run) after a potentially long running operation has completed. There is another function called setTimeout that will wait a specified period of time and then execute a function. For example:

    function doIt() {
        console.log('I am done');
    }
    setTimeout(doIt, 5000)

    If you run the above code it will wait 5 seconds and print I am done. Please read something about setTimeout on MDN. The first argument to the setTimeout call is the callback (doIt)

    You must write a function that takes 4 arguments.

    • A start value
    • An end value
    • A callback to call if the number is divisible by 3
    • A callback to use if the number is divisible by 5

    The function should generate an array containing values from start value to end value (inclusive).

    Then the function should iterate over the array and call the second argument if the array value is divisible by 3

    The function should call the second argument if the array value is divisible by 5

    Both functions should be called if the array value is divisible by both 3 and 5

    THIS IS FAKE CODE 
    function threeFive(startIndex, stopIndex, threeCallback, fiveCallback) {
       // make array 
       // start at beginning of array and check if you should call threeCallback or fiveCallback or go on to next  
    }
    threeFive(10, 15, sayThree, sayFive);
    
    // Should create an array [10,11,12,13,14,15]
    // and call sayFive, sayThree, sayThree, sayFive  - please make sure you see why these calls are made before you start coding
  2. Please solve this problem using: https://www.freecodecamp.com/challenges/repeat-a-string-repeat-a-string

  3. A for loop

  4. A while loop

  5. A do loop

  6. Some practice with objects https://www.freecodecamp.com/challenges/construct-javascript-objects-with-functions

  7. Nested loops https://www.freecodecamp.com/challenges/nesting-for-loops

  8. We did some work with arrays - var arr = [1,2,3] We can also nest arrays inside arrays like this var arr2d = [[1,2], [3,4], [5,6]] (for math people you can think of this as a matrix) How would you print all the items of an array with 3 dimensions? How about with K dimensions? What if you didn't know how deep the array was nested? (You don't have to write code for this but think about it)

  9. Here are two functions that look like they do the something similar but they print different results. Please explain what's going on here.

var x = 9; 
function f1(val) { 
    val = val+1; 
    return val;
}
f1(x);
console.log(x);


var y = { x: 9 };
function f2(val) {
    val.x = val.x + 1;
    return val;
}
f2(y);
console.log(y);

If you are confused please run the code and then consult the Google for "javaScript pass by value pass by reference"

Step 2: Feedback

Give feedback on step 2 of the homework to one of your fellow classmates.

Step 3: Homework for JavaScript

Make a website that fetches (= to get) data asynchronously.

  1. Create a new website with external js file

  2. Add a button (e.g. 'click me') that when clicked console.logs 'you clicked me!'

  3. Create a function that fetches from The Github API. For example from [this page] (https://api.github.com/orgs/HackYourFuture/repos) (the one we used last week). For help on this check this SO post

  4. Display the data that you get from the Github API on your web page.

  5. Now link the two together: When you click the button -> get the data from the Github API and display it on your website

  6. Make all the repositories link their own page in Github. Use the value of the key: name to make this work (hint: Github urls always look like this https://api.github.com/repos/HackYourFuture/[repositoryName] where [repositoryName] would be replaced by the actual name of the repository, for example CommandLine). Make sure the link opens in a new tab.

  7. BONUS: if you look at this:

https://api.github.com/repos/HackYourFuture/CommandLine

You can see CommandLine in the URL. These are called "query parameters" and let us specify in detail what we want from the API. Play around with this. For example you can make two buttons that either get data for a specific repository, JavaScript or Node.js. Or go even more crazy and make users type in a search box 'JavaScript' and then send that to the API by changing the repository.

How to hand in your homework:
• Clone your existing "hyf-javascript2" Github repository.
• Create a new folder "week2" USING THE COMMAND LINE 
• Save your homework files inside this folder. 
• When you are done with your homework use add/commit and push to upload your homework. 
• Write a description for your “commit”.
• Your hyf-javascript2/week2 should now contain all your homework files.
Place the link to your repository folder in Trello.