├── 1-while └── README.md ├── 2-arrays └── README.md ├── 3-array-iteration └── README.md ├── 4-objects └── README.md └── README.md /1-while/README.md: -------------------------------------------------------------------------------- 1 | # Part I: While 2 | 3 | *Note: Before getting started on these exercises, please be certain that you've read through the root [README.md](../README.md) file in this repository.* 4 | 5 | ## Exercises 6 | 7 | ### Basic Requirements 8 | 9 | 1. **Summation to `n`:** Let's implement the function `sum` that takes a single 10 | parameter `n`, and computes the sum of all integers up to `n` starting from 11 | `0`, *e.g.*: 12 | 13 | ```js 14 | function sum(n) { 15 | // TODO: your code here 16 | } 17 | sum(3); // => 6 18 | sum(4); // => 10 19 | sum(5); // => 15 20 | ``` 21 | 22 | 2. **Factorial of `n`:** The factorial of `n` is the *product* of all the 23 | integers preceding `n`, starting with `1`, *e.g.*: 24 | 25 | ```js 26 | function factorial(n) { 27 | // TODO: your code here 28 | } 29 | factorial(3); // => 6 30 | factorial(4); // => 24 31 | factorial(5); // => 120 32 | ``` 33 | 34 | 3. **Repeating a String `n` Times:** Let's write a function called 35 | `repeatString` that takes two parameters: a string `str`, which is the string 36 | to be repeated, and `count` -- a number representing how many times the 37 | string `s` should be repeated, *e.g.* 38 | 39 | ```js 40 | function repeatString(str, count) { 41 | // TODO: your code here 42 | } 43 | repeatString('dog', 0); // => '' 44 | repeatString('dog', 1); // => 'dog' 45 | repeatString('dog', 2); // => 'dogdog' 46 | repeatString('dog', 3); // => 'dogdogdog' 47 | ``` 48 | 49 | Your task is to implement the `repeatString` function using a `while` loop. 50 | 51 | ### More Practice 52 | 53 | 1. Modify your `sum` function from the **Basic Requirements** section to accept 54 | *two* parameters, `start` and `end`: `sum` should now compute the sum of the 55 | numbers from `start` to `end`, *e.g.* 56 | 57 | ```js 58 | function sum(start, end) { 59 | // TODO: your code here 60 | } 61 | sum(2, 7); // => 2 + 3 + 4 + 5 + 6 + 7 => 27 62 | sum(3, 5); // => 3 + 4 + 5 => 12 63 | ``` 64 | 65 | + What happens if `start` is larger than `end`? Modify `sum` to check for this 66 | case and, when found, swap the `start` and `end` arguments. 67 | 68 | 69 | 2. Let's pretend for a moment that JavaScript does not have the addition 70 | operator `+` -- instead, it comes with two functions called `inc` and `dec` 71 | that perform *increment* and *decrement* respectively: 72 | 73 | ```js 74 | // ignore the fact that inc makes use of + 75 | function inc(x) { 76 | return x + 1; 77 | } 78 | 79 | function dec(x) { 80 | return x - 1; 81 | } 82 | ``` 83 | 84 | Your task is to write a function called `add` that takes two numbers as 85 | parameters, `x` and `y`, and adds them together. The catch is that you can 86 | *only* use `inc` and `dec` to accomplish this. 87 | 88 | 3. Write a function called `isEven` that, given a number `n` as a parameter, 89 | returns `true` if that number is *even*, and `false` otherwise; however, you 90 | need to do this **without using the `%` operator.** 91 | 92 | 4. Write a function called `multiply` that accepts two numbers as parameters, 93 | and multiplies them together -- but without using the `*` operator; instead, 94 | you'll need to use repeated addition. 95 | 96 | ### Advanced 97 | 98 | 1. **Compute the `n`th Fibonacci Number:** The fibonacci numbers are represented by the 99 | following sequence: 100 | 101 | ```js 102 | // fib(n): 1 1 2 3 5 8 13 21 103 | // | | | | | | | | 104 | // n: 0 1 2 3 4 5 6 7 105 | ``` 106 | 107 | That is, `fib(0)` is 1, `fib(1)` is 1, `fib(2)` is 2, `fib(3)` is 3, `fib(4)` 108 | is 5, etc. 109 | 110 | Notice that each fibonacci number can be computed by adding the **previous 111 | two** fibonacci numbers, with the exception of the first two: `fib(0)` and 112 | `fib(1)`. More succinctly, 113 | 114 | + `fib(0)` is `1` 115 | + `fib(1)` is `1` 116 | + `fib(n)` is `fib(n - 1) + fib(n - 2)` 117 | 118 | Write a function called `fib` that accepts a number `n` as a parameter and 119 | computes the `n`th fibonacci number using the above rules. 120 | 121 | 2. By now you should have worked with the `length` property of strings, *e.g.* 122 | `"hello".length`. Your task is to write a function called `stringLength` that 123 | accepts a string as a parameter and computes the length of that string; 124 | however, as you may have guessed, you are not allowed to use the `length` 125 | property of the string! 126 | 127 | Instead, you'll need to make use of the string method called `slice`. To 128 | get an idea of how `slice` works, try the following at a console: 129 | 130 | ```js 131 | "hello".slice(0); 132 | "hello".slice(1); 133 | "".slice(1); 134 | ``` 135 | 136 | For our purposes, we can consider `slice` as taking one argument -- the 137 | **index** to begin slicing from, and returns a new string starting from that 138 | index onwards. 139 | 140 | **Indices** are *positions* of characters within strings, and they always 141 | begin counting from 0, *e.g.*: 142 | 143 | ```js 144 | // "h e l l o" (spaces added for clarity) 145 | // | | | | | 146 | // 0 1 2 3 4 147 | ``` 148 | 149 | The `"h"` character has index (position) `0` in the string `"hello"`, `"e"` 150 | has index `1`, `l` has index `2`, etc. 151 | 152 | 3. The "modulo" operator (`%`) computes the *remainder* after dividing its left 153 | operand by its right one, *e.g.* 154 | 155 | ```js 156 | 5 % 2; // => 1 157 | 8 % 10; // => 8 158 | 7 % 5; // => 2 159 | ``` 160 | 161 | Write a function called `modulo` that works like the `%` operator, but 162 | without using it. 163 | 164 | 4. Write a function called `countChars` that accepts two parameters: a `string` 165 | and a `character`. This function should return a number representing the 166 | number of times that the `character` appears in `string`. To access the 167 | *first* element of a string, you can use the following syntax: 168 | 169 | ```js 170 | // access the element at index 0 171 | "hello"[0]; // => "h" 172 | "dog"[0]; // => "d" 173 | ``` 174 | 175 | **HINT:** You'll also need to make use of the `slice` method as shown above 176 | in the exercise on computing the length of a string. 177 | 178 | 5. Implement a function called `indexOf` that accepts two paramters: a `string` 179 | and a `character`, and returns the *first* index of `character` in the 180 | `string`. You'll need to make use of the techniques for accessing the *first* 181 | element of a string and the *rest* of the string (`slice`) as before. 182 | -------------------------------------------------------------------------------- /2-arrays/README.md: -------------------------------------------------------------------------------- 1 | # Part II: Arrays 2 | 3 | *Note: Before getting started on these exercises, please be certain that you've read through the root [README.md](../README.md) file in this repository.* 4 | 5 | ## Exercises 6 | 7 | ### Basic Requirements 8 | 9 | #### Creating Arrays 10 | 11 | 1. Using the array: `["cat", "fox", "dog", "monkey"]`, what is the index of: 12 | 13 | + "dog"? 14 | + "monkey"? 15 | + "cat"? 16 | 17 | 18 | 2. Fix the syntax/style in the following arrays: 19 | 20 | ```js 21 | [ 1, 3 4 7,9, ] 22 | "the""quick""brown","fox" "jumped","over" the lazy, "dog", ] 23 | [true false,true 24 | ``` 25 | 26 | 3. Create arrays in the *global scope* of your program consisting of strings that represent: 27 | 28 | + Your favorite TV shows/movies 29 | + Names of people you know/care about 30 | + Favorite sports/activities 31 | 32 | #### Accessing Array Elements 33 | 34 | 1. Using the arrays that you created in the last exercise, use the console to access: 35 | 36 | + First elements, 37 | + Last elements, 38 | + Other elements! 39 | 40 | 2. Write a function `first` that takes an array as an argument and returns the 41 | first element in that array. 42 | 43 | 3. Write a function `last` that takes an array as an argument and returns the 44 | *last* element in the array. **Hint:** What is the relationship between the 45 | *index* of the last element in the array and the *length* of the array? 46 | 47 | #### Modifying Arrays 48 | 49 | 1. Using `push` and `unshift`, make this array contain the 50 | numbers from zero through seven: 51 | 52 | ```js 53 | var arr = [2, 3, 4]; 54 | // your code here 55 | arr; // => [0, 1, 2, 3, 4, 5, 6, 7] 56 | ``` 57 | 58 | 2. What is *returned* by `push`? Before throwing this into the console, form a 59 | hypothesis about what you think the return value will be: 60 | 61 | ```js 62 | var arr = [5, 7, 9]; 63 | arr.push(6); // => ??? 64 | ``` 65 | 66 | Were you correct? What is the returned by `push`? Does `unshift` work in the 67 | same way? 68 | 69 | 3. We can use the *assignment operator* (`=`) to replace elements in arrays with 70 | other ones like so: 71 | 72 | ```js 73 | var animals = ['dog', 'elephant', 'zebra'] 74 | // let's replace 'dog' with 'hippo' 75 | animals[0] = 'hippo'; 76 | animals; // => ['hippo', 'elephant', 'zebra'] 77 | ``` 78 | 79 | Using the same principle, perform the following: 80 | 81 | ```js 82 | // 1. Change all odd numbers to be those numbers multiplied by two: 83 | var numbers = [4, 9, 7, 2, 1, 8]; 84 | // TODO: your code here 85 | numbers; // => [4, 18, 14, 2, 2, 8] 86 | 87 | // 2. Fix the typos by replacing each element with a correctly spelled version 88 | var places = ['snfranisco', 'oacklannd', 'santacrus'] 89 | // TODO: your code here 90 | places; // => ['san francisco', 'oakland', 'santa cruz'] 91 | ``` 92 | 93 | ### More Practice 94 | 95 | 1. Write a function called `nth` that accepts an array and an index as 96 | parameters, and returns the element at that index. 97 | 98 | ```js 99 | function nth(array, index) { 100 | // TODO: your code here 101 | } 102 | var animals = ['dog', 'cat', 'gerbil']; 103 | nth(animals, 2); // => 'gerbil' 104 | nth(animals, 1) === animals[1]; // => true 105 | ``` 106 | 107 | 2. Write a function `rest` that returns all the elements in the array *except* 108 | for the first one. **HINT:** Read about the `slice` method on 109 | [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/slice) 110 | and/or experiment with `slice` at the console like so: 111 | 112 | ```js 113 | var numbers = [3, 2, 7, 5]; 114 | numbers.slice(0); 115 | numbers.slice(1); 116 | numbers.slice(2); 117 | numbers.slice(0, 2); 118 | ``` 119 | 120 | 3. Write a function `butlast` that returns all of the elements in the array 121 | *except* for the last one (you may want to use `slice` for this one as well). 122 | 123 | 4. Complete the function `cons` that accepts an element and an array, and 124 | returns an array with the element added to the *front* of the array: 125 | 126 | ```js 127 | function cons(x, array) { 128 | // your code here 129 | } 130 | ``` 131 | 132 | 5. Complete the function `conj` that accepts an array and an element, and 133 | returns an array with the element added to the *end* of the array: 134 | 135 | ```js 136 | function conj(array, x) { 137 | // your code here 138 | } 139 | ``` 140 | 141 | 6. What benefit(s) might there be to using functions like `cons` or `conj` over 142 | `unshift` or `push`? 143 | 144 | 7. Try the following in a console: 145 | 146 | ```js 147 | var arr = []; 148 | arr[7] = "Hello." 149 | arr; // => ??? 150 | ``` 151 | 152 | What is the value of `arr` after assigning an element to its seventh index? 153 | Explain the result in plain English. 154 | 155 | ### Advanced 156 | 157 | 1. Without running the below function, use a whiteboard to figure out what it 158 | should return by repeatedly expanding function invocations: 159 | 160 | ```js 161 | function mystery(array) { 162 | if (array.length === 0) { 163 | return []; 164 | } 165 | return conj(mystery(rest(array)), first(array)); 166 | } 167 | ``` 168 | 169 | 2. Using `first`, `rest`, `conj` and/or `cons`, write functions that accomplish 170 | the following: 171 | 172 | + `sum` all the elements of an array 173 | + Given an array, returns a new array with each element *squared* 174 | + Given an array of numbers, returns a new array of just the *even* numbers 175 | 176 | **HINT:** After figuring out how the `mystery` function works above, use it 177 | as a reference for how to write this type of function. 178 | -------------------------------------------------------------------------------- /3-array-iteration/README.md: -------------------------------------------------------------------------------- 1 | # Part III: Array Iteration 2 | 3 | *Note: Before getting started on these exercises, please be certain that you've read through the root [README.md](../README.md) file in this repository.* 4 | 5 | ## Exercises 6 | 7 | ### Basic Requirements 8 | 9 | 10 | 1. Write a function `sum` that computes the sum of the numbers in an array. 11 | 12 | 2. Write a function `max` that accepts an array of numbers and returns the 13 | *largest* number in the array. 14 | 15 | 3. Try the following at a console: 16 | 17 | ```js 18 | "the quick brown fox jumped over the lazy dog".split(" "); 19 | "Hello, world!".split("") 20 | "1,2,3,4,5,6".split(",") 21 | ``` 22 | 23 | What is returned by `split` (You can read more about it 24 | [here](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split)), 25 | and how does it work? 26 | 27 | Use `split` to write a function `longestWord` that takes a string as an 28 | argument and returns the longest word. 29 | 30 | 4. Write a function `remove` that accepts an *array* and an *element*, and 31 | returns an array with all ocurrences of *element* removed. 32 | 33 | ```js 34 | function remove(array, element) { 35 | // your code here 36 | } 37 | remove([1, 3, 6, 2, 3], 3); // => [1, 6, 2] 38 | ``` 39 | 40 | 5. Write a function `evens` that accepts an array as an argument, and returns 41 | an array consisting of all of the *even* numbers in that array. 42 | 43 | ### More Practice 44 | 45 | 1. Write a function called `average` that takes an array of numbers as a 46 | parameter and returns the *average* of those numbers. 47 | 48 | 2. Write a function called `min` that finds the *smallest* number in an array of 49 | numbers. 50 | 51 | 3. Write a function `shortestWord` that works like `longestWord`, but returns 52 | the *shortest* word instead. 53 | 54 | 4. Write a function `countChar` that takes two arguments: any string, and a 55 | *character* (string of one letter), and returns the number of times that the 56 | character occurs in the string. 57 | 58 | 5. Write a function `evenLengthWords` that takes an array of *strings* as an 59 | argument, and returns an array of just the words that have an even length. 60 | 61 | ### Advanced 62 | 63 | 1. Read about the `join` method on 64 | [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/join) 65 | and use it to implement a function that accepts a string as an argument and 66 | returns that string *reversed*. 67 | 68 | 2. Write a function `keep` that "keeps" certain elements in an array. The 69 | function will need to take *two* arguments, an array, and something else -- 70 | the second argument will be what is used to determine which elements to keep. 71 | 72 | You should be able to use this function to write `evens`, `evenLengthWords`, 73 | a hypothetical `odds` function, or `oddLengthWords` *without changing the 74 | `keep` function*. 75 | -------------------------------------------------------------------------------- /4-objects/README.md: -------------------------------------------------------------------------------- 1 | # Part IV: Objects 2 | 3 | *Note: Before getting started on these exercises, please be certain that you've read through the root [README.md](../README.md) file in this repository.* 4 | 5 | ## Exercises 6 | 7 | ### Basic Requirements 8 | 9 | #### Syntax & Style 10 | 11 | Fix the syntax & style issues with the three objects below: 12 | 13 | ```js 14 | {firstName "Josh", lastname: "Lehman" } 15 | {a: 1, b:2 c: 3 d 4} 16 | { 17 | animal: "dog" 18 | noise: "bark", 19 | age: 3, 20 | type "Labrador" 21 | color: "Yellow", 22 | } 23 | ``` 24 | 25 | #### Creating Objects 26 | 27 | 1. Create an object that represents *you*. It should contain your first name, 28 | last name, age and hometown. 29 | 30 | 2. Add three more key/value pairs to your object that represent other attributes 31 | of yourself. Ideas include (but are not limited to): 32 | - Favorite TV Shows/Movies/Sports/Activities etc. 33 | - Occupation 34 | - Date of Birth 35 | - Pets (number of pets, names of pets, etc.) 36 | 37 | **HINT:** You can just modify the object that you created before. 38 | 39 | 3. The values in an object can be objects themselves, and in fact, this is a 40 | very common pattern. For example, consider the following object that 41 | represents a computer: 42 | 43 | ```js 44 | var computer = { 45 | brand: "Apple", 46 | year: 2014, 47 | model: "MacBook Pro", 48 | size: "15-inch", 49 | specs: { 50 | processor: "2.3GHz Intel Core i7", 51 | memory: "16 GB 1600 MHz DDR3", 52 | graphics: "Intel Iris Pro 1536 MB" 53 | } 54 | } 55 | ``` 56 | 57 | You should notice that the `specs` key in the `computer` object is an object 58 | itself! We could access information about the processor using dot-notation 59 | like so: 60 | 61 | ```js 62 | computer.specs.processor; // => "2.3GHz Intel Core i7" 63 | ``` 64 | 65 | Change your object to have a `name` key, the value of which is an *object* 66 | – this object should have `first`, `last` and `middle` keys 67 | containing your first, last, and middle names respectively (make sure to 68 | *remove* the `firstName` and `lastName` keys that you added before). You 69 | should be able to access your *last name* afterwards like so (assuming your 70 | object is called `you`): 71 | 72 | ```js 73 | you.name.last; // => YOUR LAST NAME 74 | ``` 75 | 76 | 4. Look up your favorite movie on IMDB, and make an object that represents some 77 | aspects of that movie, *e.g.*: 78 | - Title 79 | - Director 80 | - Year released 81 | - Rating 82 | - Actors 83 | 84 | **HINT:** Most movies have multiple actors. What data-structure do we use to 85 | represent a collection of similar things? 86 | 87 | #### Creating New Key/Value Pairs 88 | 89 | **Perform these exercises in a console!** 90 | 91 | 1. Create a new empty object in your console called `obj` like this: 92 | 93 | ```js 94 | var obj = {}; 95 | ``` 96 | 97 | 2. Add a new key/value pair to the object `obj` by *assigning* a new value to a 98 | new key like so: 99 | 100 | ```js 101 | obj.hello = "world"; 102 | obj["number"] = 25; 103 | ``` 104 | 105 | 3. Now, check the value of `obj` in the console and ensure that it has the two 106 | key/value pairs added above. This is how we create new key/value pairs in 107 | existing objects. 108 | 109 | 4. In the console, add a `favoriteColor` 110 | key/value pair to the object that represents you. 111 | 112 | #### Accessing Values by Key 113 | 114 | 1. Fix the attempts to access values in the `person` object: 115 | 116 | ```js 117 | var key = "name"; 118 | var person = { 119 | name: "Alyssa P. Hacker", 120 | age: 26, 121 | hometown: "somewhere" 122 | }; 123 | person[age]; // => 26 124 | person.key; // => "Alyssa P. Hacker" 125 | ``` 126 | 127 | 2. Write a function `fullName` that takes a person object as an argument, and 128 | returns that person's full name as a string. By *person object*, we mean an 129 | object that has the structure of the object you created to represent 130 | yourself above, for example: 131 | 132 | ```js 133 | var alyssa = { 134 | name: { 135 | first: "Alyssa", 136 | middle: "P.", 137 | last: "Hacker" 138 | }, 139 | age: 26 140 | }; 141 | 142 | function fullName(person) { 143 | // TODO: your code here 144 | } 145 | 146 | fullName(alyssa); // => "Alyssa P. Hacker" 147 | ``` 148 | 149 | 3. What happens if you pass a person object to `fullName` that doesn't have a 150 | middle name? 151 | 152 | ```js 153 | fullName({name: {first: "John", last: "Doe"}}); // => "John Doe" 154 | ``` 155 | 156 | Your `fullName` function should work correctly regardless of whether or not 157 | the person has a middle name -- if it doesn't produce the output shown above 158 | when given the object `{name: {first: "John", last: "Doe"}}`, fix it so that 159 | it does. 160 | 161 | 4. We often deal with **arrays of objects**; below is an example of an array of 162 | objects, where each object represents a *person*: 163 | 164 | ```js 165 | var people = [ 166 | {name: {first: "Alyssa", middle: "P.", last: "Hacker"}, age: 26}, 167 | {name: {first: "Ben", last: "Bitdiddle"}, age: 34}, 168 | {name: {first: "Eva", middle: "Lu", last: "Ator"}, age: 40}, 169 | {name: {first: "Lem", middle: "E.", last: "Tweakit"}, age: 45}, 170 | {name: {first: "Louis", last: "Reasoner"}, age: 21} 171 | ]; 172 | ``` 173 | 174 | 1. Add the object representing yourself to this array of people (if your 175 | `name` key does not have the same "shape" as the ones above, make sure you 176 | change it to look like these). 177 | 2. Write a function that, when passed an array of *people* (person objects) as 178 | an argument, returns an array of their **full names**. Can you make use of 179 | your `fullName` function here? 180 | 3. Write a function that finds the average age of the `people` array. 181 | 4. Write a function that, when given *people* and an *age* as arguments, 182 | returns an array of just the people that are older than the specified age. 183 | 184 | #### Iterating over Keys & Values 185 | 186 | 1. The following object has a number of key/value pairs that need to be removed: 187 | 188 | ```js 189 | var dirtyObject = { 190 | _fht: 192492, 191 | name: "Alyssa P. Hacker", 192 | age: 26, 193 | _byz: 939205, 194 | _ttrs: 510852 195 | } 196 | function clean(obj) { 197 | // ... 198 | } 199 | clean(dirtyObject); // => {name: "Alyssa P. Hacker", age: 26} 200 | ``` 201 | 202 | The function `clean` should accept an object as an argument and return a new 203 | object that has all of the key/value pairs of its parameter except for those 204 | that begin with `_`. 205 | 206 | 2. Write a function `removeOddValues` that takes an object as an argument and 207 | returns an object with all key/value pairs removed for which the value holds 208 | an *odd number*. You'll need to use the \`typeof\` operator to first check that 209 | the values are numbers: 210 | 211 | ```js 212 | typeof "Hello" 213 | typeof 3 214 | ``` 215 | 216 | ### More Practice 217 | 218 | 1. Look around at various physical objects in the room, or think about 219 | activities that you enjoy. How would you represent this *things* as objects? 220 | Practice creating objects to represent different things. Some ideas include: 221 | 222 | - Your favorite drink 223 | - A recipe 224 | - Sports or hobbies 225 | - Your car/bike/hover-board/vehicle-like thing 226 | - Literally anything 227 | 228 | 229 | 2. Write a function `countWords` that, when given a string as an argument, 230 | returns an *object* where *keys* are the words in the string, and *values* 231 | are the number of occurrences of that word within the string: 232 | 233 | ```js 234 | function countWords(s) { 235 | // ... 236 | } 237 | countWords("hello hello"); // => {"hello": 2} 238 | countWords("Hello hello"); // => {"Hello": 1, "hello": 1} 239 | countWords("The quick brown"); // => {"The": 1, "quick": 1, "brown": 1} 240 | ``` 241 | 242 | **HINT:** You will want to make use of the string method `split`. Try 243 | `\"Hello hello".split(" ")` at a console to see how it works. 244 | 245 | - Modify `countWords` to be *case insensitive* by using the following string 246 | method (experiment at a console with it to learn its behavior): 247 | 248 | ```js 249 | "HElLo".toLowerCase(); // => ??? 250 | ``` 251 | 252 | 3. Write a function `countCharacters` that, when given a string as an argument, 253 | returns an object containing counts of the ocurrences of each *character* in 254 | the string. 255 | 256 | ```js 257 | function countCharacters(s) { 258 | // ... 259 | } 260 | countCharacters("hello"); // => {"h": 1, "e": 1, "l": 2, "o": 1} 261 | ``` 262 | 263 | **HINT:** You will want to make use of the string method `split`. Try 264 | `\"hello".split("")` at a console to see how it works. 265 | 266 | 4. Write a function `select` that accepts two arguments: an object and an 267 | array. The **array** should contain names of keys that will be *selected* from 268 | the object: 269 | 270 | ```js 271 | function select(obj, keys) { 272 | // ... 273 | } 274 | select({a: 1, b: 2, c: 3}, ["a"]); // => {a: 1} 275 | select({a: 1, b: 2, c: 3}, ["a", "c"]); // => {a: 1, c: 3} 276 | select({a: 1, b: 2, c: 3}, ["a", "c", "d"]); // => {a: 1, c: 3} 277 | ``` 278 | 279 | 5. Write a function `extends` that accepts two objects as arguments, and 280 | *extends* all of the key/value pairs of the second one to the first one. 281 | 282 | ```js 283 | function extend(obj1, obj2) { 284 | // ... 285 | } 286 | extend({a: 1}, {b: 2}); // => {a: 1, b: 2} 287 | extend({a: 1, c: 3}, {b: 2, c: 4}); // => {a: 1, b: 2, c: 4} 288 | ``` 289 | 290 | ### Advanced 291 | 292 | 1. The function `Object.keys` returns an array of an object's *keys*. Experiment 293 | with it at the console like this: 294 | 295 | ```js 296 | Object.keys({a: 1, b: 2}); 297 | ``` 298 | 299 | Using this property, write versions of the above functions using repetition 300 | through function invocation (*i.e.* recursion) 301 | 302 | 2. The function `JSON.stringify` turns arbitrary JavaScript data structures 303 | (arrays and objects) into strings. Try it out in a console like this: 304 | 305 | ```js 306 | JSON.stringify({a: 1, b: 2, c: ["dog", "cat", "zebra"], d: true}); 307 | JSON.stringify([5, 7, 2, 4, 0, 20]); 308 | var people = [ 309 | {name: {first: "Alyssa", middle: "P.", last: "Hacker"}, age: 26}, 310 | {name: {first: "Ben", last: "Bitdiddle"}, age: 34}, 311 | {name: {first: "Eva", middle: "Lu", last: "Ator"}, age: 40}, 312 | {name: {first: "Lem", middle: "E.", last: "Tweakit"}, age: 45}, 313 | {name: {first: "Louis", last: "Reasoner"}, age: 21} 314 | ]; 315 | JSON.stringify(people); 316 | ``` 317 | 318 | Write a function `stringify` that works *exactly* like `JSON.stringify`. 319 | 320 | **HINT:** This will be much easier to accomplish with repetition through 321 | function invocation than with iteration. 322 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # [Hack Reactor](http://www.hackreactor.com): JavaScript 301 Workshop 2 | 3 | ## Overview 4 | 5 | #### Scheduled Length: 3 Hours 6 | 7 | Hey there! Ready to get your hands dirty with some code? This is the practice exercise repository for Hack Reactor's JavaScript 301 workshop. JavaScript 301 is the third lesson in our free, four-part Introductory JavaScript Series (101, 201, 301 and 401). We're excited to have you. 8 | 9 | In order to complete these exercises, open [repl.it](https://repl.it/), choose JavaScript, and then write your code in the left-hand panel. You can run your code using the "Run" button. 10 | 11 | **EXPECTATION:** You will be expected to fully engage during lecture periods. Accordingly, please wait until the designated times during this live workshop to explore the exercises. You will be given 10-15 minutes per section, so please pace yourself accordingly. 12 | 13 | **NEED HELP?** Practice developing your autonomy as a programmer. Use [Google Search](https://www.google.com) or [Stack Overflow](https://www.stackoverflow.com), peruse documentation at [mdn.io](https://www.mdn.io), or talk to your friendly neighbor. If you're utterly stuck, flag down your instructor for guidance. 14 | 15 | **_DISCLAIMER:_** _Completion of this workshop is no guarantee of admission into the Hack Reactor immersive program, nor does it have any influence in the admissions process._ 16 | 17 | ## Slides 18 | 19 | The slide deck for this workshop can be found [here](https://docs.google.com/presentation/d/e/2PACX-1vSFlFUL1Jz3UjBYbLgmHKKpyzZGqX3KdH0-fJXrogBz-aLi6x1Wqbd9lsjENZDXndrE_Lk9jepraSuz/pub?start=false&loop=false&delayms=3000). 20 | 21 | ## Exercises 22 | 23 | Each lecture in this workshop will be followed by a set of self-guided practice exercises. The exercises are divided by section and are housed in their respective folders within this Github repository. 24 | 25 | Each section of practice exercises has a `Basic Requirements` portion. Some sections may also contain additional sections for advanced practice. During the live workshop, you are only expected to complete the `Basic Requirements` sections and may complete the remainder as homework. 26 | 27 | _For your ease of access – click the following links for each section's practice exercises._ 28 | 29 | - Part I: [While](./1-while) 30 | - Part II: [Arrays](./2-arrays) 31 | - Part III: [Array Iteration](./3-array-iteration) 32 | - Part IV: [Objects](./4-objects) 33 | 34 | ## Exercise Solutions 35 | 36 | You may find reference solutions for this workshop's exercises on the `solutions` [branch](https://github.com/hackreactor/javascript_301/tree/solutions/) of this repository. Please do not refer to the solutions until you've given each problem set a valiant effort. 37 | 38 | ## Thinking about JavaScript 39 | 40 | ##### Reasoning Methods 41 | 42 | As you embark on your learning journey, a sound method for thinking about JavaScript will be to consider each line of code as a discrete instruction being provided to your computer. 43 | 44 | - What is each line of code intended to do individually? 45 | - How about when combined together? 46 | 47 | It will be beneficial for your growth as a sophisticated programmer to think deeply about the intentions of your code so you can predict and understand the behavior your program produces. 48 | 49 | - _What_ is the expected output of the code? 50 | - _Why_ will the code produce the output that I expect? 51 | 52 | Thinking about each line of code can take many shapes: 53 | - How is this line of code structured and why? 54 | - What syntax rules is this line of code following? Not following? 55 | - Where is this line of code located contextually within the program? 56 | - What references is this line of code making to other parts of the program? Are such references sound? 57 | 58 | ##### Vocabulary Development 59 | 60 | Developing your vocabulary as a programmer is as important as learning to write code. To accelerate your conversational capabilities, we recommend partnering with a neighbor to discuss your code at every opportunity. The more opportunities you have to explain yourself, the better. Don't worry – with time, the ambiguity with which you presently speak about code will transform into eloquent prose. 61 | --------------------------------------------------------------------------------