From c48f278ba79843c9eb6fbacf86c80fe0d323a1c7 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sun, 16 Jun 2019 14:37:48 +0200 Subject: [PATCH 01/54] Update jl-errors-formatting.md --- week-1/jl-errors-formatting.md | 35 +++++++++++++++++++++++++++++++++- 1 file changed, 34 insertions(+), 1 deletion(-) diff --git a/week-1/jl-errors-formatting.md b/week-1/jl-errors-formatting.md index 66627fb..39cd87c 100644 --- a/week-1/jl-errors-formatting.md +++ b/week-1/jl-errors-formatting.md @@ -1,3 +1,36 @@ > paste [this markdown](https://raw.githubusercontent.com/janke-learning/error-exercises/master/formatting.md) into this file and fix the errors! > [completed example](https://github.com/AlfiYusrina/hyf-javascript1/blob/master/week1/errors_solutions.MD) (of the old version) -> references: [errors & life-cycle](https://github.com/janke-learning/errors-and-life-cycle), [exercise repo](https://github.com/janke-learning/errors) \ No newline at end of file +> references: [errors & life-cycle](https://github.com/janke-learning/errors-and-life-cycle), [exercise repo](https://github.com/janke-learning/errors) + +# Formatting Errors + +It's easy to miss the little things, even when you're an experienced programmer! Using a linter will help enormously avoiding simple formatting errors, but it's still great practice to learn how to spot them yourself. This skill build your confidence writing code from a blank page and is important for those times when you're coding outside of your normal editor. + +### exercises +* [improper end of statement](#improper-end-of-statement) + +--- + +## improper end of statement +broken code: +```js +let a = 1: +``` +error message: +``` +``` +classification: +* creation phase or execution phase ? +* syntax or semanitc ? + +the fix: +```js +``` +your notes: + +[TOP](#formatting-errors) + + +___ +___ +### Janke Learning From 2be05d697e52c75e5880870407a5bc14abab62cc Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sun, 16 Jun 2019 14:43:56 +0200 Subject: [PATCH 02/54] Update jl-errors-formatting.md --- week-1/jl-errors-formatting.md | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/week-1/jl-errors-formatting.md b/week-1/jl-errors-formatting.md index 39cd87c..f4d6785 100644 --- a/week-1/jl-errors-formatting.md +++ b/week-1/jl-errors-formatting.md @@ -18,13 +18,15 @@ let a = 1: ``` error message: ``` +Uncaught SyntaxError: Unexpected token : ``` classification: -* creation phase or execution phase ? -* syntax or semanitc ? +* creation phase +* syntax the fix: ```js +let a = 1; ``` your notes: From 4de1e5f7077ebcb162dec6f2def6469fea5d199c Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sun, 16 Jun 2019 14:47:05 +0200 Subject: [PATCH 03/54] Update jl-errors-formatting.md --- week-1/jl-errors-formatting.md | 1 + 1 file changed, 1 insertion(+) diff --git a/week-1/jl-errors-formatting.md b/week-1/jl-errors-formatting.md index f4d6785..5bed7ca 100644 --- a/week-1/jl-errors-formatting.md +++ b/week-1/jl-errors-formatting.md @@ -29,6 +29,7 @@ the fix: let a = 1; ``` your notes: +Notes always perfect! [TOP](#formatting-errors) From 61965085848aa7cf16820112bc9bb9382e0cda24 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sun, 16 Jun 2019 14:51:23 +0200 Subject: [PATCH 04/54] Update jl-variables-swaps.md --- week-1/jl-variables-swaps.md | 62 +++++++++++++++++++++++++++++++++++- 1 file changed, 61 insertions(+), 1 deletion(-) diff --git a/week-1/jl-variables-swaps.md b/week-1/jl-variables-swaps.md index 50ccca2..c3d8d26 100644 --- a/week-1/jl-variables-swaps.md +++ b/week-1/jl-variables-swaps.md @@ -1,2 +1,62 @@ > paste [this markdown of exercises](https://raw.githubusercontent.com/janke-learning/variable-exercises/master/multiple-assignments.md) into this file and complete the exercises! -> references: [javascript.info variables](https://javascript.info/variables), [variables and hoisting](https://github.com/janke-learning/variables-and-hoisting) \ No newline at end of file +> references: [javascript.info variables](https://javascript.info/variables), [variables and hoisting](https://github.com/janke-learning/variables-and-hoisting) + +# Multiple Assignments + +There are mechanisms for assigning multiple variables on one line: +* _chaining assignments_ - ```a = b = c = 4;``` +* _comma-separated assignments_ - ```a = 1, b = 2, c = 3;``` + +These exercises will help you practice multiple assignments on one line: +1. [chaining assignments](#chaining-assignments) +1. [comma-separated assignments](#comma-separated-assignments) + +--- + +## Chaining Assignments + +### completed examples +* the first: [pytut](http://www.pythontutor.com/javascript.html#code=var%20a%20%3D%20'b'%3B%0Avar%20b1%20%3D%20'a',%20b2%20%3D%20'a'%3B%0Avar%20_%20%3D%20''%3B%0A%0A_%20%3D%20b1%3B%0Ab1%20%3D%20b2%20%3D%20a%3B%0Aa%20%3D%20_%3B&curInstr=0&mode=display&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D), [parsonized](https://janke-learning.github.io/parsonizer/?snippet=var%20a%20%3D%20'b'%3B%0Avar%20b1%20%3D%20'a'%2C%20b2%20%3D%20'a'%3B%0Avar%20_%20%3D%20''%3B%0A%0A_%20%3D%20b1%3B%0Ab1%20%3D%20b2%20%3D%20a%3B%0Aa%20%3D%20_%3B) +* the second: [pytut](http://www.pythontutor.com/javascript.html#code=var%20a%20%3D%20'c'%3B%0Avar%20b1%20%3D%20'a',%20b2%20%3D%20'a'%3B%0Avar%20c1%20%3D%20'b',%20c2%20%3D%20'b',%20c3%3B%0Ac3%20%3D%20'b'%3B%0Avar%20_%20%3D%20''%3B%0A%0A_%20%3D%20a%3B%0Aa%20%3D%20b1%3B%0Ab1%20%3D%20b2%20%3D%20c1%3B%0Ac1%20%3D%20c2%20%3D%20c3%20%3D%20_%3B&curInstr=0&mode=display&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D), +[parsonized](https://janke-learning.github.io/parsonizer/?snippet=var%20a%20%3D%20'c'%3B%0Avar%20b1%20%3D%20'a'%2C%20b2%20%3D%20'a'%3B%0Avar%20c1%20%3D%20'b'%2C%20c2%20%3D%20'b'%2C%20c3%3B%0Ac3%20%3D%20'b'%3B%0Avar%20_%20%3D%20''%3B%0A%0A_%20%3D%20a%3B%0Aa%20%3D%20b1%3B%0Ab1%20%3D%20b2%20%3D%20c1%3B%0Ac1%20%3D%20c2%20%3D%20c3%20%3D%20_%3B) + +### exercises +* [the first](http://www.pythontutor.com/live.html#code=var%20a%20%3D%20'b'%3B%0Avar%20b1%20%3D%20'a',%20b2%20%3D%20'a'%3B%0Avar%20_%20%3D%20''%3B%0A%0A//%20--%20can%20be%20done%20in%203%20lines&cumulative=false&curInstr=3&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +```js +// your solution here +``` +* [the second](http://www.pythontutor.com/live.html#code=var%20a%20%3D%20'c'%3B%0Avar%20b1%20%3D%20'a',%20b2%20%3D%20'a'%3B%0Avar%20c1%20%3D%20'b',%20c2,%20c3%3B%0Ac2%20%3D%20'b',%20c3%20%3D%20'b'%3B%0Avar%20_%20%3D%20''%3B%0A%0A//%20---%20can%20be%20done%20in%204%20lines%20---&cumulative=false&curInstr=5&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +```js +// your solution here +``` + +[TOP](#multiple-assignments) + +--- + +## Comma-Separated Assignments + +### completed examples +* basic swap: [pytut](http://www.pythontutor.com/javascript.html#code=var%20a%20%3D%20'b',%20b%20%3D%20'a'%3B%0Avar%20_%20%3D%20''%3B%0A%0A_%20%3D%20a,%20a%20%3D%20b,%20b%20%3D%20_%3B&curInstr=0&mode=display&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D), [parsonized](https://janke-learning.github.io/parsonizer/?snippet=var%20a%20%3D%20'b'%2C%20b%20%3D%20'a'%3B%0Avar%20_%20%3D%20''%3B%0A%0A_%20%3D%20a%2C%20a%20%3D%20b%2C%20b%20%3D%20_%3B) +* double swap - two lines: [pytut](http://www.pythontutor.com/javascript.html#code=var%20a,%20b,%20c%3B%0Aa%20%3D%20'b',%20b%20%3D%20'c',%20c%20%3D%20'a'%3B%0Avar%20_%20%3D%20''%3B%0A%0A_%20%3D%20a,%20a%20%3D%20c%3B%0Ac%20%3D%20b,%20b%20%3D%20_%3B&curInstr=0&mode=display&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D), [parsonized](https://janke-learning.github.io/parsonizer/?snippet=var%20a%2C%20b%2C%20c%3B%0Aa%20%3D%20'b'%2C%20b%20%3D%20'c'%2C%20c%20%3D%20'a'%3B%0Avar%20_%20%3D%20''%3B%0A%0A_%20%3D%20a%2C%20a%20%3D%20c%3B%0Ac%20%3D%20b%2C%20b%20%3D%20_%3B) +* double swap - one line: [pytut](http://www.pythontutor.com/javascript.html#code=var%20a,%20b%20%3D%20'c',%20c%20%3D%20'a'%3B%0Aa%20%3D%20'b'%3B%0Avar%20_%20%3D%20''%3B%0A%0A_%20%3D%20a,%20a%20%3D%20c,%20c%20%3D%20b,%20b%20%3D%20_%3B&curInstr=0&mode=display&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D), [parsonized](https://janke-learning.github.io/parsonizer/?snippet=var%20a%2C%20b%20%3D%20'c'%2C%20c%20%3D%20'a'%3B%0Aa%20%3D%20'b'%3B%0Avar%20_%20%3D%20''%3B%0A%0A_%20%3D%20a%2C%20a%20%3D%20c%2C%20c%20%3D%20b%2C%20b%20%3D%20_%3B) + +### exercises +* [basic swap](http://www.pythontutor.com/live.html#code=var%20a%20%3D%20'b',%20b%20%3D%20'a'%3B%0Avar%20_%20%3D%20''%3B%0A%0A//%20---%20solve%20this%20in%20one%20line%20---&cumulative=false&curInstr=2&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +```js +// your solution here +``` +* [double swap - two lines](http://www.pythontutor.com/live.html#code=var%20a,%20b,%20c%3B%0Aa%20%3D%20'b',%20b%20%3D%20'c',%20c%20%3D%20'a'%3B%0Avar%20_%20%3D%20''%3B%0A%0A//%20---%20solve%20this%20in%202%20lines%20---&cumulative=false&curInstr=3&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +```js +// your solution here +``` +* [double swap - one line](http://www.pythontutor.com/live.html#code=var%20a%20%3D%20'b',%20b%20%3D%20'c',%20c%20%3D%20'a'%3B%0Avar%20_%20%3D%20''%3B%0A%0A_%20%3D%20a,%20a%20%3D%20c,%20c%20%3D%20b,%20b%20%3D%20_%3B&cumulative=false&curInstr=3&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +```js +// your solution here +``` + +[TOP](#multiple-assignments) + +___ +___ +### Janke Learning From 70dc195047da8bc89785d80f337edb95eda33371 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sun, 16 Jun 2019 15:28:46 +0200 Subject: [PATCH 07/54] Update jl-variables-swaps.md --- week-1/jl-variables-swaps.md | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/week-1/jl-variables-swaps.md b/week-1/jl-variables-swaps.md index d5a8279..c3e6518 100644 --- a/week-1/jl-variables-swaps.md +++ b/week-1/jl-variables-swaps.md @@ -15,7 +15,13 @@ You'll be given a bunch of variables with the wrong value assigned and a tempora ### challenges 1. [the first](https://goo.gl/k9jdZy) ```js -// your solution here +let a = "b", b = "a"; +let _ = ' '; + +// can be done in 3 lines +_ = b; +b = a; +a = _; ``` 1. [the second](https://goo.gl/KvayUU) ```js From c479f88512ec10c9a091d8a5ea964b382fda525d Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sun, 16 Jun 2019 15:36:06 +0200 Subject: [PATCH 08/54] Update fcc-basic-js-pt-1.md --- week-1/fcc-basic-js-pt-1.md | 3 +++ 1 file changed, 3 insertions(+) diff --git a/week-1/fcc-basic-js-pt-1.md b/week-1/fcc-basic-js-pt-1.md index 6ca5118..c9b9b31 100644 --- a/week-1/fcc-basic-js-pt-1.md +++ b/week-1/fcc-basic-js-pt-1.md @@ -1,3 +1,6 @@ > complete [the basic JS exercises](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript) through _Counting Cards_ & paste each of your solutions into this file. This will allow you to use your FCC exercises as a study reference later on > [completed example](https://github.com/AlfiYusrina/hyf-javascript1/blob/master/week1/freecode_camp_solutions.MD) +// This is Ramzi, in-line comment :) +/* This is Ramzi, +multi-line comment */ From 03199dee2e57457a5d0013ee7d95b919337d3c8d Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sun, 16 Jun 2019 15:36:27 +0200 Subject: [PATCH 09/54] Update fcc-basic-js-pt-1.md --- week-1/fcc-basic-js-pt-1.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/week-1/fcc-basic-js-pt-1.md b/week-1/fcc-basic-js-pt-1.md index c9b9b31..d63fed9 100644 --- a/week-1/fcc-basic-js-pt-1.md +++ b/week-1/fcc-basic-js-pt-1.md @@ -4,3 +4,5 @@ // This is Ramzi, in-line comment :) /* This is Ramzi, multi-line comment */ + +http://www.pythontutor.com/javascript.html#code=//%20This%20is%20Ramzi,%20in-line%20comment%20%3A%29%0A/*%20This%20is%20Ramzi,%0Amulti-line%20comment%20*/&mode=edit&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D From 05b1b10e9bbdc2d6af466b6adc4327e14deafb71 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sun, 16 Jun 2019 15:38:07 +0200 Subject: [PATCH 10/54] Update fcc-basic-js-pt-1.md --- week-1/fcc-basic-js-pt-1.md | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/week-1/fcc-basic-js-pt-1.md b/week-1/fcc-basic-js-pt-1.md index d63fed9..588ddbd 100644 --- a/week-1/fcc-basic-js-pt-1.md +++ b/week-1/fcc-basic-js-pt-1.md @@ -1,8 +1,12 @@ > complete [the basic JS exercises](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript) through _Counting Cards_ & paste each of your solutions into this file. This will allow you to use your FCC exercises as a study reference later on > [completed example](https://github.com/AlfiYusrina/hyf-javascript1/blob/master/week1/freecode_camp_solutions.MD) + +## 1. Comment Your Code + +```js // This is Ramzi, in-line comment :) /* This is Ramzi, multi-line comment */ +``` -http://www.pythontutor.com/javascript.html#code=//%20This%20is%20Ramzi,%20in-line%20comment%20%3A%29%0A/*%20This%20is%20Ramzi,%0Amulti-line%20comment%20*/&mode=edit&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D From b7e95eb86c9e7050daa11aec0f56e2f207daa773 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Tue, 18 Jun 2019 19:54:12 +0200 Subject: [PATCH 11/54] Update fcc-debugging.md --- week-1/fcc-debugging.md | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/week-1/fcc-debugging.md b/week-1/fcc-debugging.md index 8be77ff..e7cdc1a 100644 --- a/week-1/fcc-debugging.md +++ b/week-1/fcc-debugging.md @@ -1,3 +1,16 @@ > begin [the debugging exercises](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/debugging) and paste each of your solutions into this file. This will allow you to use your FCC exercises as a study reference later on > [completed example](https://github.com/AlfiYusrina/hyf-javascript1/blob/master/week1/freecode_camp_solutions.MD) (wrong exercises, correct markdown styling) +Homework +Debugging: Use the JavaScript Console to Check the Value of a Variable + +--js +let a = 5; +let b = 1; +a++; +// Add your code below this line + + +let sumAB = a + b; +console.log(a); +--- From 1cf017dbc9eebbfd26fca43dabe7a655021cacc4 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Tue, 18 Jun 2019 19:54:58 +0200 Subject: [PATCH 12/54] Update fcc-debugging.md --- week-1/fcc-debugging.md | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/week-1/fcc-debugging.md b/week-1/fcc-debugging.md index e7cdc1a..43116c2 100644 --- a/week-1/fcc-debugging.md +++ b/week-1/fcc-debugging.md @@ -1,10 +1,10 @@ > begin [the debugging exercises](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/debugging) and paste each of your solutions into this file. This will allow you to use your FCC exercises as a study reference later on > [completed example](https://github.com/AlfiYusrina/hyf-javascript1/blob/master/week1/freecode_camp_solutions.MD) (wrong exercises, correct markdown styling) -Homework -Debugging: Use the JavaScript Console to Check the Value of a Variable +# Homework +## Debugging: Use the JavaScript Console to Check the Value of a Variable ---js +```js let a = 5; let b = 1; a++; @@ -13,4 +13,4 @@ a++; let sumAB = a + b; console.log(a); ---- +``` From 600fa1be36b3cba1b4348eb6e55c78540dca7786 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Tue, 18 Jun 2019 20:38:03 +0200 Subject: [PATCH 13/54] Update fcc-debugging.md --- week-1/fcc-debugging.md | 89 ++++++++++++++++++++++++++++++++++++++++- 1 file changed, 88 insertions(+), 1 deletion(-) diff --git a/week-1/fcc-debugging.md b/week-1/fcc-debugging.md index 43116c2..c068ba5 100644 --- a/week-1/fcc-debugging.md +++ b/week-1/fcc-debugging.md @@ -2,7 +2,7 @@ > [completed example](https://github.com/AlfiYusrina/hyf-javascript1/blob/master/week1/freecode_camp_solutions.MD) (wrong exercises, correct markdown styling) # Homework -## Debugging: Use the JavaScript Console to Check the Value of a Variable +## 1. Debugging: Use the JavaScript Console to Check the Value of a Variable ```js let a = 5; @@ -14,3 +14,90 @@ a++; let sumAB = a + b; console.log(a); ``` +## 2. Debugging: Understanding the Differences between the freeCodeCamp and Browser Console + +```js +// Open your browser console +let outputTwo = "This will print to the browser console 2 times"; +// Use console.log() to print the outputTwo variable + + +let outputOne = "Try to get this to log only once to the browser console"; +// Use console.clear() in the next line to print the outputOne only once + + +// Use console.log() to print the outputOne variable + +console.log(outputTwo) +console.log(outputOne) +console.clear() +``` + +## 3.Debugging: Use typeof to Check the Type of a Variable +```js +let seven = 7; +let three = "3"; +console.log(seven + three); +// Add your code below this line +console.log(typeof seven) +console.log(typeof three) +``` + +## 4. Debugging: Catch Misspelled Variable and Function Names +```js +let receivables = 10; +let payables = 8; +let netWorkingCapital = receivables - payables; +console.log(`Net working capital is: ${netWorkingCapital}`); +``` + +## 5. Debugging: Catch Unclosed Parentheses, Brackets, Braces and Quotes +```js +let myArray = [1, 2, 3]; +let arraySum = myArray.reduce((previous, current) => (previous + current)); +console.log(`Sum of array values is: ${arraySum}`); +``` + +## 6. Debugging: Catch Mixed Usage of Single and Double Quotes +```js +let innerHtml = "

Click here to return home

"; +console.log(innerHtml); +``` + +## 7. Debugging: Catch Use of Assignment Operator Instead of Equality Operator +```js +let x = 7; +let y = 9; +let result = "to come"; + +if(x == y) { + result = "Equal!"; +} else { + result = "Not equal!"; +} + +console.log(result); +``` + +## 8. Debugging: Catch Missing Open and Closing Parenthesis After a Function Call +```js +function getNine() { + let x = 6; + let y = 3; + return x + y; +} + +let result = getNine(); +console.log(result); +``` +## 9. Debugging: Catch Arguments Passed in the Wrong Order When Calling a Function +```js +function raiseToPower(b, e) { + return Math.pow(b, e); +} + +let base = 2; +let exp = 3; +let power = raiseToPower(base, exp); +console.log(power); +``` From 1f313ea9df276f9042cac2ff70d4b844976f3320 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Tue, 18 Jun 2019 21:00:49 +0200 Subject: [PATCH 14/54] Update fcc-debugging.md --- week-1/fcc-debugging.md | 49 +++++++++++++++++++++++++++++++++++++++++ 1 file changed, 49 insertions(+) diff --git a/week-1/fcc-debugging.md b/week-1/fcc-debugging.md index c068ba5..02f5a64 100644 --- a/week-1/fcc-debugging.md +++ b/week-1/fcc-debugging.md @@ -101,3 +101,52 @@ let exp = 3; let power = raiseToPower(base, exp); console.log(power); ``` +## 10. Debugging: Catch Off By One Errors When Using Indexing +```js +function countToFive() { + let firstFive = "12345"; + let len = firstFive.length; + // Fix the line below + for (let i = 0; i < len; i++) { + // Do not alter code below this line + console.log(firstFive[i]); + } +} + +countToFive(); +``` + +## 11. Debugging: Use Caution When Reinitializing Variables Inside a Loop +```js +function zeroArray(m, n) { + // Creates a 2-D array with m rows and n columns of zeroes + let newArray = []; + let row = []; + for (let i = 0; i < m; i++) { + // Adds the m-th row into newArray + let row = []; + + for (let j = 0; j < n; j++) { + // Pushes n zeroes into the current row to create the columns + row.push(0); + } + // Pushes the current row, which now has n zeroes in it, to the array + newArray.push(row); + } + return newArray; +} + +let matrix = zeroArray(3, 2); +console.log(matrix); +``` + +## 12. Debugging: Prevent Infinite Loops with a Valid Terminal Condition +```js +function myFunc() { + while(false) { + for (let i = 1; i <= 4; i += 2) { + console.log("Still going!"); + } + } +} +``` From 1299912a71830695df47d1fdc1ff340937fe1128 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Tue, 18 Jun 2019 21:02:49 +0200 Subject: [PATCH 15/54] Update jl-errors-primitive-types.md --- week-1/jl-errors-primitive-types.md | 80 ++++++++++++++++++++++++++++- 1 file changed, 79 insertions(+), 1 deletion(-) diff --git a/week-1/jl-errors-primitive-types.md b/week-1/jl-errors-primitive-types.md index 4182409..5c0ad15 100644 --- a/week-1/jl-errors-primitive-types.md +++ b/week-1/jl-errors-primitive-types.md @@ -1,3 +1,81 @@ > paste [this markdown](https://raw.githubusercontent.com/janke-learning/errors/master/primitive-types.md) into this file and fix the errors! > [completed example](https://github.com/AlfiYusrina/hyf-javascript1/blob/master/week1/errors_solutions.MD) (of the old version) -> references: [errors & life-cycle](https://github.com/janke-learning/errors-and-life-cycle), [exercise repo](https://github.com/janke-learning/errors) \ No newline at end of file +> references: [errors & life-cycle](https://github.com/janke-learning/errors-and-life-cycle), [exercise repo](https://github.com/janke-learning/errors) + +# Primitive Type Errors + +* [improper multi-line string](#improper-multi-line-string) +* [improper nested quotes 1](#improper-nested-quotes-1) +* [improper nested quotes 2](#improper-nested-quotes-2) + +--- + +## improper multi-line string + +broken code: +```js +let a = 'this is +two lines'; +``` +error message: +``` +``` +classification: +* creation phase or execution phase ? +* syntax or semanitc ? + +the fix: +```js +``` +your notes: + +[TOP](#primitive-type-errors) + +--- + +## improper nested quotes 1 + +broken code: +```js +let innerHtml = "

Click here to return home

"; +``` +error message: +``` +``` +classification: +* creation phase or execution phase ? +* syntax or semanitc ? + +the fix: +```js +``` +your notes: + +[TOP](#errors) + +--- + +## improper nested quotes 2 + +broken code: +```js +let nested_messages = 'remind yourself ''i can do this!'' at least once a day'; +``` +error message: +``` +``` +classification: +* creation phase or execution phase ? +* syntax or semanitc ? + +the fix: +```js +``` +your notes: + +[TOP](#primitive-type-errors) + +___ +___ +### Janke Learning + From 92ab47ebe4ac7a4f0c49aa0e504fad0bf1e71665 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Tue, 18 Jun 2019 21:25:04 +0200 Subject: [PATCH 16/54] Update jl-errors-primitive-types.md --- week-1/jl-errors-primitive-types.md | 20 +++++++++++++------- 1 file changed, 13 insertions(+), 7 deletions(-) diff --git a/week-1/jl-errors-primitive-types.md b/week-1/jl-errors-primitive-types.md index 5c0ad15..593852f 100644 --- a/week-1/jl-errors-primitive-types.md +++ b/week-1/jl-errors-primitive-types.md @@ -19,14 +19,16 @@ two lines'; ``` error message: ``` +Uncaught SyntaxError: Invalid or unexpected token ``` classification: -* creation phase or execution phase ? -* syntax or semanitc ? +* creation phase +* syntax the fix: ```js -``` +let a = "this is" + +"two lines" ;``` your notes: [TOP](#primitive-type-errors) @@ -41,13 +43,15 @@ let innerHtml = "

Click here to return home

"; ``` error message: ``` +Uncaught SyntaxError: Unexpected identifier ``` classification: -* creation phase or execution phase ? -* syntax or semanitc ? +* creation phase +* syntax the fix: ```js +let innerHtml = "

Click here to return home

"; ``` your notes: @@ -63,13 +67,15 @@ let nested_messages = 'remind yourself ''i can do this!'' at least once a day'; ``` error message: ``` +Uncaught SyntaxError: Unexpected string ``` classification: -* creation phase or execution phase ? -* syntax or semanitc ? +* creation phase +* syntax the fix: ```js +let nested_messages = 'remind yourself' + 'i can do this!' + 'at least once a day'; ``` your notes: From 115c0664cee496de1fe7125bcb73c2d5d45a4dfb Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Tue, 18 Jun 2019 21:30:11 +0200 Subject: [PATCH 17/54] Update jl-errors-variables.md --- week-1/jl-errors-variables.md | 75 ++++++++++++++++++++++++++++++++++- 1 file changed, 74 insertions(+), 1 deletion(-) diff --git a/week-1/jl-errors-variables.md b/week-1/jl-errors-variables.md index ce210bd..e791b6d 100644 --- a/week-1/jl-errors-variables.md +++ b/week-1/jl-errors-variables.md @@ -1,3 +1,76 @@ > paste [this markdown](https://raw.githubusercontent.com/janke-learning/errors/master/functions.md) into this file and fix the errors! > [completed example](https://github.com/AlfiYusrina/hyf-javascript1/blob/master/week1/errors_solutions.MD) (of the old version) -> references: [errors & life-cycle](https://github.com/janke-learning/errors-and-life-cycle), [exercise repo](https://github.com/janke-learning/errors) \ No newline at end of file +> references: [errors & life-cycle](https://github.com/janke-learning/errors-and-life-cycle), [exercise repo](https://github.com/janke-learning/errors) + +# Function Errors + +* [missing arguments](#missing-arguments) +* [is not a function](#is-not-a-function) + +--- + +## missing arguments + +broken code: +```js +function getNine { + let x = 6; + let y = 3; + return x + y; +} +let result = getNine(); +``` +error message: +``` +Uncaught SyntaxError: Unexpected token { +``` +classification: +* creation phase +* syntax + +the fix: +```js +function getNine() { + let x = 6; + let y = 3; + return x + y; +} +let result = getNine(); +``` +your notes: + +[TOP](#function-errors) + +--- + +## is not a function + +broken code: +```js +let array = []; +array.length() +``` +error message: +``` +Uncaught TypeError: array.length is not a function + at :2:7 +``` +classification: +* creation phase +* syntax + +the fix: +```js +let array = []; +array.length; +``` +your notes: + + + +[TOP](#function-errors) + + +___ +___ +### Janke Learning From e7aaa691a7a9029b1a7671499fb3c672713f8ee1 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Tue, 18 Jun 2019 21:31:09 +0200 Subject: [PATCH 18/54] Update jl-functions.md --- week-1/jl-functions.md | 216 ++++++++++++++++++++++++++++++++++++++++- 1 file changed, 215 insertions(+), 1 deletion(-) diff --git a/week-1/jl-functions.md b/week-1/jl-functions.md index d24d0e7..233d4bf 100644 --- a/week-1/jl-functions.md +++ b/week-1/jl-functions.md @@ -1,2 +1,216 @@ > paste [this markdown of exercises](https://raw.githubusercontent.com/janke-learning/function-exercises/master/functions.md) into this file and complete the exercises! -> references: [javascript.info functions](https://javascript.info/function-basics), [function examples to study](https://github.com/janke-learning/function-exercises/blob/master/examples-to-study.md) \ No newline at end of file +> references: [javascript.info functions](https://javascript.info/function-basics), [function examples to study](https://github.com/janke-learning/function-exercises/blob/master/examples-to-study.md) + +# Functions + +some exercises to help you understand functions: +* Defining vs. Calling functions + * Defining: when you write the funciton -> function name() {}. This creates the function in memory + * Calling: using the function to compute new values -> name(). This creates a new frame and returns a new value +* Arguments +* Lexical Scope +* Return Values + +### Index +* [completed example](#completed-example) +* exercises + * [number 1](#1) + * [number 2](#2) + * [number 3](#3) + * [number 4](#4) + * [number 5](#5) + * [number 6](#6) + * [number 7](#7) + * [number 8](#8) +* [resources](#resources) + +--- + +## Completed Example + +[on pytut](http://www.pythontutor.com/javascript.html#code=function%20f%28param_1,%20param_2,%20param_3%29%20%7B%0A%20%20var%20result%20%3D%20param_2%20%2B%20param_3%20%2B%20param_1%3B%0A%20%20return%20result%3B%0A%7D%3B%0A%0A//%20set%20values%20in%20the%20args%20to%20pass%20the%20assert%0Alet%20arg_1%20%3D%20%22x%22,%20arg_2%20%3D%20%22z%22,%20arg_3%20%3D%20%22y%22%3B%0Alet%20return_val%20%3D%20f%28arg_1,%20arg_2,%20arg_3%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22zyx%22,%20%22return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B&curInstr=0&mode=display&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) +[parsonized](http://janke-learning.github.io/parsonizer/?snippet=function%20f%28param_1,%20param_2,%20param_3%29%20%7B%0A%20%20var%20result%20%3D%20param_2%20%2B%20param_3%20%2B%20param_1%3B%0A%20%20return%20result%3B%0A%7D%3B%0A%0A//%20set%20values%20in%20the%20args%20to%20pass%20the%20assert%0Alet%20arg_1%20%3D%20%22x%22,%20arg_2%20%3D%20%22z%22,%20arg_3%20%3D%20%22y%22%3B%0Alet%20return_val%20%3D%20f%28arg_1,%20arg_2,%20arg_3%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22zyx%22,%20%22return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B) +```js +{ // completed example + function f(param_1, param_2, param_3) { + var result = param_2 + param_3 + param_1; + return result; + }; + + // set values in the args to pass the assert + let arg_1 = "x", arg_2 = "z", arg_3 = "y"; + let return_val = f(arg_1, arg_2, arg_3); + + console.assert(return_val === "zyx", "example: return_val === " + return_val); +} +``` + +[TOP](#functions) + +--- + +## Exercises + +### 1 + +[on pytut](http://www.pythontutor.com/live.html#code=function%20f%28param_1,%20param_2,%20param_3%29%20%7B%0A%20%20var%20result%20%3D%20param_3%20%2B%20param_1%20%2B%20param_2%3B%0A%20%20return%20result%3B%0A%7D%3B%0A%0A//%20set%20values%20in%20the%20args%20to%20pass%20the%20assert%0Alet%20arg_1%20%3D%20%22%22,%20arg_2%20%3D%20%22%22,%20arg_3%20%3D%20%22%22%3B%0Alet%20return_val%20%3D%20f%28arg_1,%20arg_2,%20arg_3%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22zyx%22,%20%221%3A%20return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B&cumulative=false&curInstr=6&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +[parsonized](http://janke-learning.github.io/parsonizer/?snippet=function%20f%28param_1,%20param_2,%20param_3%29%20%7B%0A%20%20var%20result%20%3D%20param_3%20%2B%20param_1%20%2B%20param_2%3B%0A%20%20return%20result%3B%0A%7D%3B%0A%0A//%20set%20values%20in%20the%20args%20to%20pass%20the%20assert%0Alet%20arg_1%20%3D%20%22%22,%20arg_2%20%3D%20%22%22,%20arg_3%20%3D%20%22%22%3B%0Alet%20return_val%20%3D%20f%28arg_1,%20arg_2,%20arg_3%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22zyx%22,%20%22return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B) +```js +{ // 1 + function f(param_1, param_2, param_3) { + var result = param_3 + param_1 + param_2; + return result; + }; + + // set values in the args to pass the assert + let arg_1 = "", arg_2 = "", arg_3 = ""; + let return_val = f(arg_1, arg_2, arg_3); + + console.assert(return_val === "zyx", "1: return_val === " + return_val); +} +``` + +### 2 + +[on pytut](http://www.pythontutor.com/live.html#code=function%20f%28param_1,%20param_2,%20param_3%29%20%7B%0A%20%20var%20result%20%3D%20param_3%20%2B%20param_1%20%2B%20param_2%3B%0A%20%20return%20result%3B%0A%7D%3B%0A%0A//%20set%20values%20in%20the%20args%20to%20pass%20the%20assert%0Alet%20arg_1%20%3D%20%22%22,%20arg_2%20%3D%20%22%22,%20arg_3%20%3D%20%22%22%3B%0Alet%20return_val%20%3D%20f%28arg_1,%20arg_2,%20arg_3%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22yxz%22,%20%22return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B&cumulative=false&curInstr=6&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +[parsonized](http://janke-learning.github.io/parsonizer/?snippet=function%20f%28param_1%2C%20param_2%2C%20param_3%29%20%7B%0A%20%20var%20result%20%3D%20param_3%20%2B%20param_1%20%2B%20param_2%3B%0A%20%20return%20result%3B%0A%7D%3B%0A%0A%2F%2F%20set%20values%20in%20the%20args%20to%20pass%20the%20assert%0Alet%20arg_1%20%3D%20%22%22%2C%20arg_2%20%3D%20%22%22%2C%20arg_3%20%3D%20%22%22%3B%0Alet%20return_val%20%3D%20f%28arg_1%2C%20arg_2%2C%20arg_3%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22yxz%22%2C%20%22return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B) +```js +{ // 2 + function f(param_1, param_2, param_3) { + var result = param_3 + param_1 + param_2; + return result; + }; + + // set values in the args to pass the assert + let arg_1 = "", arg_2 = "", arg_3 = ""; + let return_val = f(arg_1, arg_2, arg_3); + + console.assert(return_val === "yxz", "2: return_val === " + return_val); +} +``` + +### 3 + +[on pytut](http://www.pythontutor.com/live.html#code=function%20f%28param_1,%20param_2,%20param_3%29%20%7B%0A%20%20var%20_%20%3D%20param_2%3B%0A%20%20param_2%20%3D%20param_1%3B%0A%20%20param_1%20%3D%20_%3B%0A%20%20var%20result%20%3D%20param_3%20%2B%20param_1%20%2B%20param_2%3B%0A%20%20return%20result%3B%0A%7D%3B%0A%0A//%20set%20values%20in%20the%20args%20to%20pass%20the%20assert%0Alet%20arg_1%20%3D%20%22%22,%20arg_2%20%3D%20%22%22,%20arg_3%20%3D%20%22%22%3B%0Alet%20return_val%20%3D%20f%28arg_1,%20arg_2,%20arg_3%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22yxz%22,%20%22return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B&cumulative=false&curInstr=9&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +[parsonized](http://janke-learning.github.io/parsonizer/?snippet=function%20f%28param_1%2C%20param_2%2C%20param_3%29%20%7B%0A%20%20var%20_%20%3D%20param_2%3B%0A%20%20param_2%20%3D%20param_1%3B%0A%20%20param_1%20%3D%20_%3B%0A%20%20var%20result%20%3D%20param_3%20%2B%20param_1%20%2B%20param_2%3B%0A%20%20return%20result%3B%0A%7D%3B%0A%0A%2F%2F%20set%20values%20in%20the%20args%20to%20pass%20the%20assert%0Alet%20arg_1%20%3D%20%22%22%2C%20arg_2%20%3D%20%22%22%2C%20arg_3%20%3D%20%22%22%3B%0Alet%20return_val%20%3D%20f%28arg_1%2C%20arg_2%2C%20arg_3%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22yxz%22%2C%20%22return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B) +```js +{ // 3 + function f(param_1, param_2, param_3) { + var _ = param_2; + param_2 = param_1; + param_1 = _; + var result = param_3 + param_1 + param_2; + return result; + }; + + // set values in the args to pass the assert + let arg_1 = "", arg_2 = "", arg_3 = ""; + let return_val = f(arg_1, arg_2, arg_3); + + console.assert(return_val === "yxz", "3: return_val === " + return_val); +} +``` + +### 4 + +[on pytut](http://www.pythontutor.com/live.html#code=function%20f%28param_1,%20param_2,%20param_3%29%20%7B%0A%20%20var%20_%20%3D%20param_2%3B%0A%20%20param_2%20%3D%20param_3%3B%0A%20%20param_3%20%3D%20_%3B%0A%20%20var%20result%20%3D%20param_3%20%2B%20param_1%20%2B%20param_2%3B%0A%20%20return%20result%3B%0A%7D%3B%0A%0A//%20set%20values%20in%20the%20args%20to%20pass%20the%20assert%0Alet%20arg_1%20%3D%20%22%22,%20arg_2%20%3D%20%22%22,%20arg_3%20%3D%20%22%22%3B%0Alet%20return_val%20%3D%20f%28arg_1,%20arg_2,%20arg_3%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22xyz%22,%20%22return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B&cumulative=false&curInstr=9&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +[parsonized](http://janke-learning.github.io/parsonizer/?snippet=function%20f%28param_1%2C%20param_2%2C%20param_3%29%20%7B%0A%20%20var%20_%20%3D%20param_2%3B%0A%20%20param_2%20%3D%20param_3%3B%0A%20%20param_3%20%3D%20_%3B%0A%20%20var%20result%20%3D%20param_3%20%2B%20param_1%20%2B%20param_2%3B%0A%20%20return%20result%3B%0A%7D%3B%0A%0A%2F%2F%20set%20values%20in%20the%20args%20to%20pass%20the%20assert%0Alet%20arg_1%20%3D%20%22%22%2C%20arg_2%20%3D%20%22%22%2C%20arg_3%20%3D%20%22%22%3B%0Alet%20return_val%20%3D%20f%28arg_1%2C%20arg_2%2C%20arg_3%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22xyz%22%2C%20%22return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B) +```js +{ // 4 + function f(param_1, param_2, param_3) { + var _ = param_2; + param_2 = param_3; + param_3 = _; + var result = param_3 + param_1 + param_2; + return result; + }; + + // set values in the args to pass the assert + let arg_1 = "", arg_2 = "", arg_3 = ""; + let return_val = f(arg_1, arg_2, arg_3); + + console.assert(return_val === "xyz", "4: return_val === " + return_val); +} +``` + +### 5 + +[on pytut](http://www.pythontutor.com/live.html#code=function%20f%28param_1,%20param_2,%20param_3%29%20%7B%0A%20var%20result%20%3D%20param_3%20%2B%20param_1%20%2B%20param_2%3B%0A%20return%20result%3B%0A%7D%3B%0A%0Alet%20x%20%3D%20%22x%22,%20y%20%3D%20%22y%22,%20z%20%3D%20%22z%22%3B%0Alet%20return_val%20%3D%20f%28/*%20pass%20x,%20y%20%26%20z%20in%20the%20right%20order%20*/%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22xyz%22,%20%225%3A%20return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B&cumulative=false&curInstr=6&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +[parsonized](http://janke-learning.github.io/parsonizer/?snippet=function%20f%28param_1%2C%20param_2%2C%20param_3%29%20%7B%0A%20var%20result%20%3D%20param_3%20%2B%20param_1%20%2B%20param_2%3B%0A%20return%20result%3B%0A%7D%3B%0A%0Alet%20x%20%3D%20%22x%22%2C%20y%20%3D%20%22y%22%2C%20z%20%3D%20%22z%22%3B%0Alet%20return_val%20%3D%20f%28%2F*%20pass%20x%2C%20y%20%26%20z%20in%20the%20right%20order%20*%2F%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22xyz%22%2C%20%225%3A%20return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B) +```js +{ // 5 + function f(param_1, param_2, param_3) { + var result = param_3 + param_1 + param_2; + return result; + }; + + let x = "x", y = "y", z = "z"; + let return_val = f(/* pass x, y & z in the right order */); + + console.assert(return_val === "xyz", "5: return_val === " + return_val); +} +``` + +### 6 + +[on pytut](http://www.pythontutor.com/live.html#code=function%20f%28param_1,%20param_2,%20param_3%29%20%7B%0A%20var%20result%20%3D%20param_2%20%2B%20param_1%20%2B%20param_3%3B%0A%20return%20result%3B%0A%7D%3B%0A%0Alet%20x%20%3D%20%22x%22,%20y%20%3D%20%22y%22,%20z%20%3D%20%22z%22%3B%0Alet%20return_val%20%3D%20f%28/*%20pass%20x,%20y%20%26%20z%20in%20the%20right%20order%20*/%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22xzy%22,%20%226%3A%20return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B&cumulative=false&curInstr=6&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +[parsonized](http://janke-learning.github.io/parsonizer/?snippet=function%20f%28param_1%2C%20param_2%2C%20param_3%29%20%7B%0A%20var%20result%20%3D%20param_2%20%2B%20param_1%20%2B%20param_3%3B%0A%20return%20result%3B%0A%7D%3B%0A%0Alet%20x%20%3D%20%22x%22%2C%20y%20%3D%20%22y%22%2C%20z%20%3D%20%22z%22%3B%0Alet%20return_val%20%3D%20f%28%2F*%20pass%20x%2C%20y%20%26%20z%20in%20the%20right%20order%20*%2F%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22xzy%22%2C%20%226%3A%20return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B) +```js +{ // 6 + function f(param_1, param_2, param_3) { + var result = param_2 + param_1 + param_3; + return result; + }; + + let x = "x", y = "y", z = "z"; + let return_val = f(/* pass x, y & z in the right order */); + + console.assert(return_val === "xzy", "6: return_val === " + return_val); +} +``` + +### 7 + +[on pytut](http://www.pythontutor.com/live.html#code=function%20f%28param_1,%20param_2,%20param_3%29%20%7B%0A%20var%20result%20%3D%20/*%20arrange%20the%20params%20to%20pass%20the%20assert%20*/%3B%0A%20return%20result%3B%0A%7D%3B%0A%0Alet%20arg_1%20%3D%20%22z%22,%20arg_2%20%3D%20%22y%22,%20arg_3%20%3D%20%22x%22%3B%0Alet%20return_val%20%3D%20f%28arg_1,%20arg_2,%20arg_3%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22xzy%22,%20%227%3A%20return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B&cumulative=false&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +[parsonized](http://janke-learning.github.io/parsonizer/?snippet=function%20f%28param_1%2C%20param_2%2C%20param_3%29%20%7B%0A%20var%20result%20%3D%20%2F*%20arrange%20the%20params%20to%20pass%20the%20assert%20*%2F%3B%0A%20return%20result%3B%0A%7D%3B%0A%0Alet%20arg_1%20%3D%20%22z%22%2C%20arg_2%20%3D%20%22y%22%2C%20arg_3%20%3D%20%22x%22%3B%0Alet%20return_val%20%3D%20f%28arg_1%2C%20arg_2%2C%20arg_3%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22xzy%22%2C%20%227%3A%20return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B) +```js +{ // 7 + function f(param_1, param_2, param_3) { + var result = /* arrange the params to pass the assert */; + return result; + }; + + let arg_1 = "z", arg_2 = "y", arg_3 = "x"; + let return_val = f(arg_1, arg_2, arg_3); + + console.assert(return_val === "xzy", "7: return_val === " + return_val); +} +``` + +### 8 + +[on pytut](http://www.pythontutor.com/live.html#code=function%20f%28param_1,%20param_2,%20param_3%29%20%7B%0A%20var%20result%20%3D%20/*%20arrange%20the%20params%20to%20pass%20the%20assert%20*/%3B%0A%20return%20result%3B%0A%7D%3B%0A%0Alet%20arg_1%20%3D%20%22z%22,%20arg_2%20%3D%20%22y%22,%20arg_3%20%3D%20%22x%22%3B%0Alet%20return_val%20%3D%20f%28arg_1,%20arg_2,%20arg_3%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22yxz%22,%20%228%3A%20return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B&cumulative=false&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +[parsonized](http://janke-learning.github.io/parsonizer/?snippet=function%20f%28param_1%2C%20param_2%2C%20param_3%29%20%7B%0A%20var%20result%20%3D%20%2F*%20arrange%20the%20params%20to%20pass%20the%20assert%20*%2F%3B%0A%20return%20result%3B%0A%7D%3B%0A%0Alet%20arg_1%20%3D%20%22z%22%2C%20arg_2%20%3D%20%22y%22%2C%20arg_3%20%3D%20%22x%22%3B%0Alet%20return_val%20%3D%20f%28arg_1%2C%20arg_2%2C%20arg_3%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22yxz%22%2C%20%228%3A%20return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B) +```js +{ // 8 + function f(param_1, param_2, param_3) { + var result = /* arrange the params to pass the assert */; + return result; + }; + + let arg_1 = "z", arg_2 = "y", arg_3 = "x"; + let return_val = f(arg_1, arg_2, arg_3); + + console.assert(return_val === "yxz", "8: return_val === " + return_val); +} +``` + +--- + +## Resources + +* [pythontutor video](https://www.youtube.com/watch?v=bJUmxDsaduY&list=PLzV58Zm8FuBJFfQN5il3ujx6FDAY8Ds3u&index=6) + +___ +___ +### Janke Learning From d4fb2b44588ea5af286fb1afe1f4e98ec29b97a8 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Tue, 18 Jun 2019 21:50:07 +0200 Subject: [PATCH 19/54] Update jl-turtle-shuffle.md --- week-1/jl-turtle-shuffle.md | 207 +++++++++++++++++++++++++++++++++++- 1 file changed, 206 insertions(+), 1 deletion(-) diff --git a/week-1/jl-turtle-shuffle.md b/week-1/jl-turtle-shuffle.md index 91fb1e7..e2be5d8 100644 --- a/week-1/jl-turtle-shuffle.md +++ b/week-1/jl-turtle-shuffle.md @@ -1,2 +1,207 @@ > paste [this markdown of exercises](https://raw.githubusercontent.com/janke-learning/function-exercises/master/turtle-shuffle.md) into this file and complete the exercises! -> references: [javascript.info functions](https://javascript.info/function-basics), [function examples to study](https://github.com/janke-learning/function-exercises/blob/master/examples-to-study.md) \ No newline at end of file +> references: [javascript.info functions](https://javascript.info/function-basics), [function examples to study](https://github.com/janke-learning/function-exercises/blob/master/examples-to-study.md) + +# Turtle Shuffle + +some trickier function exercises before moving on. +* Reading function behavior, and using them correctly +* Defining vs. Calling functions + * Defining: when you write the funciton -> function name() {}. This creates the function in memory + * Calling: using the function to compute new values -> name(). This creates a new frame and returns a new value +* Arguments +* Lexical Scope +* Return Values + +### Index +* [completed example](#completed-example) +* exercises + * [number 1](#1) + * [number 2](#2) + * [number 3](#3) + * [number 4](#4) + * [number 5](#5) + * [number 6](#6) + * [number 7](#7) + * [number 8](#8) + * [number 9](#9) + +--- + +## Completed Example + +[on pytut](http://www.pythontutor.com/javascript.html#code=function%20turtle%28_1%2C%20_2%2C%20_3%29%20%7B%0A%20%20var%20result%20%3D%20%22%22%3B%0A%20%20var%20the_rest%20%3D%20%22tle%22%3B%0A%20%20result%20%3D%20_1%20%2B%20_2%20%2B%20_3%20%2B%20the_rest%3B%0A%20%20return%20result%3B%0A%7D%0Aconst%20return_val%20%3D%20turtle%28%22t%22%2C%20%22u%22%2C%20%22r%22%29%3B%0Aconsole.assert%28return_val%20%3D%3D%3D%20\'turtle\'%2C%20%221%3A%20return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B&curInstr=0&mode=display&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) +```js +{ // completed example + function turtle(_1, _2, _3) { + var result = ""; + var the_rest = "tle"; + result = _1 + _2 + _3 + the_rest; + return result; + } + const return_val = turtle("t", "u", "r"); + console.assert(return_val === 'turtle', "example: return_val === " + return_val); +}; +``` + +--- + +## Exercises + +### 1 + +[on pytut](http://www.pythontutor.com/javascript.html#code=function%20turtle%28_1%2C%20_2%2C%20_3%29%20%7B%0A%20%20var%20result%20%3D%20%22%22%3B%0A%20%20var%20the_start%20%3D%20%22tur%22%3B%0A%20%20result%20%3D%20the_start%20%2B%20_1%20%2B%20_2%20%2B%20_3%3B%0A%20%20return%20result%3B%0A%7D%0Aconst%20return_val%20%3D%20turtle%28%2F*%20write%20some%20arguments%20*%2F%29%3B%0Aconsole.assert%28return_val%20%3D%3D%3D%20\'turtle\'%2C%20%222%3A%20return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B&curInstr=0&mode=display&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) +```js +{ // 1 + function turtle(_1, _2, _3) { + var result = ""; + var the_start = "tur"; + result = the_start + _1 + _2 + _3; + return result; + } + const return_val = turtle(/* write some arguments */); + console.assert(return_val === 'turtle', "1: return_val === " + return_val); +}; +``` + +### 2 + +[on pytut](http://www.pythontutor.com/javascript.html#code=function%20turtle%28_1%2C%20_2%29%20%7B%0A%20%20var%20result%20%3D%20%22%22%3B%0A%20%20var%20the_start%20%3D%20%22tu%22%3B%0A%20%20var%20the_end%20%3D%20%22le%22%3B%0A%20%20result%20%3D%20the_start%20%2B%20_1%20%2B%20_2%20%2B%20the_end%3B%0A%20%20return%20result%3B%0A%7D%0Aconst%20return_val%20%3D%20turtle%28%2F*%20write%20some%20arguments%20*%2F%29%3B%0Aconsole.assert%28return_val%20%3D%3D%3D%20\'turtle\'%2C%20%223%3A%20return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B&curInstr=0&mode=display&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) +```js +{ // 2 + function turtle(_1, _2) { + var result = ""; + var the_start = "tu"; + var the_end = "le"; + result = the_start + _1 + _2 + the_end; + return result; + } + const return_val = turtle(/* write some arguments */); + console.assert(return_val === 'turtle', "2: return_val === " + return_val); +}; +``` + +### 3 + +[on pytut](http://www.pythontutor.com/javascript.html#code=function%20turtle%28_1%2C%20_2%29%20%7B%0A%20%20var%20result%20%3D%20%22t%22%20%2B%20_1%20%2B%20%22r%22%20%2B%20_2%3B%0A%20%20return%20result%3B%0A%7D%0Aconst%20return_val%20%3D%20turtle%28%2F*%20write%20some%20arguments%20*%2F%29%3B%0Aconsole.assert%28return_val%20%3D%3D%3D%20\'turtle\'%2C%20%224%3A%20return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29&curInstr=0&mode=display&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) +```js +{ // 3 + function turtle(_1, _2) { + var result = "t" + _1 + "r" + _2; + return result; + } + const return_val = turtle(/* write some arguments */); + console.assert(return_val === 'turtle', "3: return_val === " + return_val); +}; +``` + +### 4 + +[on pytut](http://www.pythontutor.com/javascript.html#code=function%20turtle%28_1%2C%20_2%2C%20_3%29%20%7B%0A%20%20var%20result%20%3D%20%22t%22%20%2B%20_2%20%2B%20%22r%22%20%2B%20_1%20%2B%20_3%3B%0A%20%20return%20result%3B%0A%7D%0Aconst%20return_val_1%20%3D%20turtle%28%2F*%20write%20some%20arguments%20*%2F%29%3B%0Aconsole.assert%28return_val_1%20%3D%3D%3D%20\'turtle\'%2C%20%225%3A%20return_val_1%20%3D%3D%3D%20%22%20%2B%20return_val_1%29%3B%0A%0Aconst%20return_val_2%20%3D%20turtle%28%2F*%20write%20some%20arguments%20*%2F%29%3B%0Aconsole.assert%28return_val_2%20%3D%3D%3D%20\'turtle\'%2C%20%225%3A%20return_val_2%20%3D%3D%3D%20%22%20%2B%20return_val_2%29%3B&curInstr=0&mode=display&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) +```js +{ // 4 + function turtle(_1, _2, _3) { + var result = "t" + _2 + "r" + _1 + _3; + return result; + } + const return_val_1 = turtle(/* write some arguments */); + console.assert(return_val_1 === 'turtle', "5: return_val_1 === " + return_val_1); + + const return_val_2 = turtle(/* write some arguments */); + console.assert(return_val_2 === 'turtle', "4: return_val_2 === " + return_val_2); +}; +``` + +### 5 + +[on pytut](http://www.pythontutor.com/javascript.html#code=function%20turtle%28_1%2C%20_2%2C%20_3%29%20%7B%0A%20%20var%20result%20%3D%20_1%20%2B%20_2%20%2B%20_3%3B%0A%20%20return%20result%3B%0A%7D%0Aconst%20return_val_1%20%3D%20turtle%28%2F*%20write%20some%20arguments%20*%2F%29%3B%0Aconsole.assert%28return_val_1%20%3D%3D%3D%20\'turtle\'%2C%20%226%3A%20return_val_1%20%3D%3D%3D%20%22%20%2B%20return_val_1%29%3B%0A%0Aconst%20return_val_2%20%3D%20turtle%28%2F*%20write%20some%20arguments%20*%2F%29%3B%0Aconsole.assert%28return_val_2%20%3D%3D%3D%20\'turtle\'%2C%20%226%3A%20return_val_2%20%3D%3D%3D%20%22%20%2B%20return_val_2%29%3B%0A%0Aconst%20return_val_3%20%3D%20turtle%28%2F*%20write%20some%20arguments%20*%2F%29%3B%0Aconsole.assert%28return_val_3%20%3D%3D%3D%20\'turtle\'%2C%20%226%3A%20return_val_3%20%3D%3D%3D%20%22%20%2B%20return_val_3%29%3B%0A%0Aconst%20return_val_4%20%3D%20turtle%28%2F*%20write%20some%20arguments%20*%2F%29%3B%0Aconsole.assert%28return_val_4%20%3D%3D%3D%20\'turtle\'%2C%20%226%3A%20return_val_4%20%3D%3D%3D%20%22%20%2B%20return_val_4%29%3B%0A%0Aconst%20return_val_5%20%3D%20turtle%28%2F*%20write%20some%20arguments%20*%2F%29%3B%0Aconsole.assert%28return_val_5%20%3D%3D%3D%20\'turtle\'%2C%20%226%3A%20return_val_5%20%3D%3D%3D%20%22%20%2B%20return_val_5%29%3B%0A%0Aconst%20return_val_6%20%3D%20turtle%28%2F*%20write%20some%20arguments%20*%2F%29%3B%0Aconsole.assert%28return_val_6%20%3D%3D%3D%20\'turtle\'%2C%20%226%3A%20return_val_6%20%3D%3D%3D%20%22%20%2B%20return_val_6%29%3B&curInstr=0&mode=display&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) +```js +{ // 5 + function turtle(_1, _2, _3) { + var result = _1 + _2 + _3; + return result; + } + const return_val_1 = turtle(/* write some arguments */); + console.assert(return_val_1 === 'turtle', "5: return_val_1 === " + return_val_1); + + const return_val_2 = turtle(/* write some arguments */); + console.assert(return_val_2 === 'turtle', "5: return_val_2 === " + return_val_2); + + const return_val_3 = turtle(/* write some arguments */); + console.assert(return_val_3 === 'turtle', "5: return_val_3 === " + return_val_3); + + const return_val_4 = turtle(/* write some arguments */); + console.assert(return_val_4 === 'turtle', "5: return_val_4 === " + return_val_4); + + const return_val_5 = turtle(/* write some arguments */); + console.assert(return_val_5 === 'turtle', "5: return_val_5 === " + return_val_5); + + const return_val_6 = turtle(/* write some arguments */); + console.assert(return_val_6 === 'turtle', "5: return_val_6 === " + return_val_6); +}; +``` + +### 6 + +[on pytut](http://www.pythontutor.com/javascript.html#code=function%20turtle%28_1%2C%20_2%2C%20_3%2C%20_4%2C%20_5%29%20%7B%0A%20%20var%20result%20%3D%20_4%20%2B%20_2%20%2B%20_5%20%2B%20_4%20%2B%20_1%20%2B%20_3%3B%0A%20%20return%20result%3B%0A%7D%0Aconst%20return_val%20%3D%20turtle%28%2F*%20write%20some%20arguments%20*%2F%29%3B%0Aconsole.assert%28return_val%20%3D%3D%3D%20\'turtle\'%2C%20%227%3A%20return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B&curInstr=0&mode=display&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) +```js +{ // 6 + function turtle(_1, _2, _3, _4, _5) { + var result = _4 + _2 + _5 + _4 + _1 + _3; + return result; + } + const return_val = turtle(/* write some arguments */); + console.assert(return_val === 'turtle', "6: return_val === " + return_val); +}; +``` + +### 7 + +[on pytut](http://www.pythontutor.com/javascript.html#code=function%20turtle%28_1%2C%20_2%2C%20_3%2C%20_4%2C%20_5%29%20%7B%0A%20%20var%20result%20%3D%20_2%20%2B%20_1%20%2B%20_4%20%2B%20_2%20%2B%20%22l%22%20%2B%20_3%3B%0A%20%20return%20result%3B%0A%7D%0Aconst%20return_val%20%3D%20turtle%28%2F*%20write%20some%20arguments%20*%2F%29%3B%0Aconsole.assert%28return_val%20%3D%3D%3D%20\'turtle\'%2C%20%227%3A%20return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B&curInstr=0&mode=display&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) +```js +{ // 7 + function turtle(_1, _2, _3, _4, _5) { + var result = _2 + _1 + _4 + _2 + "l" + _3; + return result; + } + const return_val = turtle(/* write some arguments */); + console.assert(return_val === 'turtle', "7: return_val === " + return_val); +}; +``` + +### 8 + +[on pytut](http://www.pythontutor.com/javascript.html#code=function%20turtle%28_1%2C%20_2%2C%20_3%2C%20_4%2C%20_5%29%20%7B%0A%20%20_4%20%3D%20_2%3B%0A%20%20_1%20%3D%20_3%3B%0A%20%20var%20result%20%3D%20_4%20%2B%20%22u%22%20%2B%20_1%20%2B%20_4%20%2B%20_5%20%2B%20%22e%22%3B%0A%20%20return%20result%3B%0A%7D%0Aconst%20return_val%20%3D%20turtle%28%2F*%20write%20some%20arguments%20*%2F%29%3B%0Aconsole.assert%28return_val%20%3D%3D%3D%20\'turtle\'%2C%20%229%3A%20return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B&curInstr=0&mode=display&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) +```js +{ // 8 + function turtle(_1, _2, _3, _4, _5) { + _4 = _2; + _1 = _3; + var result = _4 + "u" + _1 + _4 + _5 + "e"; + return result; + } + const return_val = turtle(/* write some arguments */); + console.assert(return_val === 'turtle', "8: return_val === " + return_val); +}; +``` + +### 9 + +[on pytut](http://www.pythontutor.com/javascript.html#code=function%20turtle%28_1%2C%20_2%2C%20_3%2C%20_4%2C%20_5%29%20%7B%0A%20%20var%20_%20%3D%20_4%3B%0A%20%20_4%20%3D%20_2%3B%0A%20%20_1%20%3D%20_3%3B%0A%20%20_3%20%3D%20_%3B%0A%20%20var%20result%20%3D%20_4%20%2B%20%22u%22%20%2B%20_1%20%2B%20_4%20%2B%20_3%20%2B%20%22e%22%3B%0A%20%20return%20result%3B%0A%7D%0Aconst%20return_val%20%3D%20turtle%28%2F*%20write%20some%20arguments%20*%2F%29%3B%0Aconsole.assert%28return_val%20%3D%3D%3D%20\'turtle\'%2C%20%229%3A%20return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B&curInstr=0&mode=display&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) +```js +{ // 9 + function turtle(_1, _2, _3, _4, _5) { + var _ = _4; + _4 = _2; + _1 = _3; + _3 = _; + var result = _4 + "u" + _1 + _4 + _3 + "e"; + return result; + } + const return_val = turtle(/* write some arguments */); + console.assert(return_val === 'turtle', "9: return_val === " + return_val); +}; +``` + +___ +___ +### Janke Learning From c87cfda07dc75d4f9d00c4c1b36ff2f978dffcd2 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Tue, 18 Jun 2019 22:02:08 +0200 Subject: [PATCH 20/54] Update jl-functions.md --- week-1/jl-functions.md | 42 ++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 42 insertions(+) diff --git a/week-1/jl-functions.md b/week-1/jl-functions.md index 233d4bf..3449173 100644 --- a/week-1/jl-functions.md +++ b/week-1/jl-functions.md @@ -69,7 +69,19 @@ some exercises to help you understand functions: console.assert(return_val === "zyx", "1: return_val === " + return_val); } ``` +#### Solution +```js +function f(param_1, param_2, param_3) { + var result = param_3 + param_1 + param_2; + return result; +}; + +// set values in the args to pass the assert +let arg_1 = "y", arg_2 = "x", arg_3 = "z"; +let return_val = f(arg_1, arg_2, arg_3); +console.assert(return_val === "zyx", "1: return_val === " + return_val); +``` ### 2 [on pytut](http://www.pythontutor.com/live.html#code=function%20f%28param_1,%20param_2,%20param_3%29%20%7B%0A%20%20var%20result%20%3D%20param_3%20%2B%20param_1%20%2B%20param_2%3B%0A%20%20return%20result%3B%0A%7D%3B%0A%0A//%20set%20values%20in%20the%20args%20to%20pass%20the%20assert%0Alet%20arg_1%20%3D%20%22%22,%20arg_2%20%3D%20%22%22,%20arg_3%20%3D%20%22%22%3B%0Alet%20return_val%20%3D%20f%28arg_1,%20arg_2,%20arg_3%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22yxz%22,%20%22return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B&cumulative=false&curInstr=6&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) @@ -88,6 +100,19 @@ some exercises to help you understand functions: console.assert(return_val === "yxz", "2: return_val === " + return_val); } ``` +#### Solution +```js +function f(param_1, param_2, param_3) { + var result = param_3 + param_1 + param_2; + return result; +}; + +// set values in the args to pass the assert +let arg_1 = "x", arg_2 = "z", arg_3 = "y"; +let return_val = f(arg_1, arg_2, arg_3); + +console.assert(return_val === "yxz", "return_val === " + return_val); +``` ### 3 @@ -111,6 +136,23 @@ some exercises to help you understand functions: } ``` +#### Solution +```js + function f(param_1, param_2, param_3) { + var _ = param_2; + param_2 = param_1; + param_1 = _; + var result = param_3 + param_1 + param_2; + return result; + }; + + // set values in the args to pass the assert + let arg_1 = "z", arg_2 = "x", arg_3 = "y"; + let return_val = f(arg_1, arg_2, arg_3); + + console.assert(return_val === "yxz", "3: return_val === " + return_val); +``` + ### 4 [on pytut](http://www.pythontutor.com/live.html#code=function%20f%28param_1,%20param_2,%20param_3%29%20%7B%0A%20%20var%20_%20%3D%20param_2%3B%0A%20%20param_2%20%3D%20param_3%3B%0A%20%20param_3%20%3D%20_%3B%0A%20%20var%20result%20%3D%20param_3%20%2B%20param_1%20%2B%20param_2%3B%0A%20%20return%20result%3B%0A%7D%3B%0A%0A//%20set%20values%20in%20the%20args%20to%20pass%20the%20assert%0Alet%20arg_1%20%3D%20%22%22,%20arg_2%20%3D%20%22%22,%20arg_3%20%3D%20%22%22%3B%0Alet%20return_val%20%3D%20f%28arg_1,%20arg_2,%20arg_3%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22xyz%22,%20%22return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B&cumulative=false&curInstr=9&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) From fe1de6a5358ed5d1ce3c4e385b6f5ed7062bec20 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Fri, 21 Jun 2019 23:20:27 +0200 Subject: [PATCH 21/54] Update jl-variables-swaps.md --- week-1/jl-variables-swaps.md | 19 +++++++++++++++++-- 1 file changed, 17 insertions(+), 2 deletions(-) diff --git a/week-1/jl-variables-swaps.md b/week-1/jl-variables-swaps.md index c3e6518..6149801 100644 --- a/week-1/jl-variables-swaps.md +++ b/week-1/jl-variables-swaps.md @@ -25,11 +25,26 @@ a = _; ``` 1. [the second](https://goo.gl/KvayUU) ```js -// your solution here +let a = "c", b = "a", c = "b"; +let _ = ' '; + +// can be done in 4 lines +_ = a; +a = b; +b = c; +c = _; ``` 1. [the third](https://goo.gl/WXXtV7) ```js -// your solution here +let a = "d", b = "a", c = "b", d = "c"; +let _ = ' '; + +// can be done in 5 lines +_ = a; +a = b; +b = c; +c = d; +d = _; ``` 1. [the fourth](https://goo.gl/nTA1DG) ```js From 1f1e416ab123a5b5ec66d951db6224a7f2972242 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sat, 22 Jun 2019 01:21:41 +0200 Subject: [PATCH 22/54] Update jl-variables-multiple.md --- week-1/jl-variables-multiple.md | 21 +++++++++++++++++++-- 1 file changed, 19 insertions(+), 2 deletions(-) diff --git a/week-1/jl-variables-multiple.md b/week-1/jl-variables-multiple.md index 6dafbd3..8be49fe 100644 --- a/week-1/jl-variables-multiple.md +++ b/week-1/jl-variables-multiple.md @@ -22,11 +22,28 @@ These exercises will help you practice multiple assignments on one line: ### exercises * [the first](http://www.pythontutor.com/live.html#code=var%20a%20%3D%20'b'%3B%0Avar%20b1%20%3D%20'a',%20b2%20%3D%20'a'%3B%0Avar%20_%20%3D%20''%3B%0A%0A//%20--%20can%20be%20done%20in%203%20lines&cumulative=false&curInstr=3&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) ```js -// your solution here +var a = 'b'; +var b1 = 'a', b2 = 'a'; +var _ = ''; + +// -- can be done in 3 lines +_ = a; +a = b1; +b1 = b2 = _; ``` * [the second](http://www.pythontutor.com/live.html#code=var%20a%20%3D%20'c'%3B%0Avar%20b1%20%3D%20'a',%20b2%20%3D%20'a'%3B%0Avar%20c1%20%3D%20'b',%20c2,%20c3%3B%0Ac2%20%3D%20'b',%20c3%20%3D%20'b'%3B%0Avar%20_%20%3D%20''%3B%0A%0A//%20---%20can%20be%20done%20in%204%20lines%20---&cumulative=false&curInstr=5&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) ```js -// your solution here +var a = 'c'; +var b1 = 'a', b2 = 'a'; +var c1 = 'b', c2, c3; +c2 = 'b', c3 = 'b'; +var _ = ''; + +// --- can be done in 4 lines --- +_ = a; +a = b1; +b1 = b2 = c2; +c1 = c2 = c3 = _; ``` [TOP](#multiple-assignments) From ccf271aecd5f8c045d8379e66ea0549e5d958a6a Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sun, 23 Jun 2019 08:22:26 +0200 Subject: [PATCH 23/54] Update jl-variables-multiple.md --- week-1/jl-variables-multiple.md | 19 ++++++++++++++++--- 1 file changed, 16 insertions(+), 3 deletions(-) diff --git a/week-1/jl-variables-multiple.md b/week-1/jl-variables-multiple.md index 8be49fe..018f02a 100644 --- a/week-1/jl-variables-multiple.md +++ b/week-1/jl-variables-multiple.md @@ -60,15 +60,28 @@ c1 = c2 = c3 = _; ### exercises * [basic swap](http://www.pythontutor.com/live.html#code=var%20a%20%3D%20'b',%20b%20%3D%20'a'%3B%0Avar%20_%20%3D%20''%3B%0A%0A//%20---%20solve%20this%20in%20one%20line%20---&cumulative=false&curInstr=2&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) ```js -// your solution here +var a = 'b', b = 'a'; +var _ = ''; + +// --- solve this in one line --- +_ = a; a = b; b = _; ``` * [double swap - two lines](http://www.pythontutor.com/live.html#code=var%20a,%20b,%20c%3B%0Aa%20%3D%20'b',%20b%20%3D%20'c',%20c%20%3D%20'a'%3B%0Avar%20_%20%3D%20''%3B%0A%0A//%20---%20solve%20this%20in%202%20lines%20---&cumulative=false&curInstr=3&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) ```js -// your solution here +var a, b, c; +a = 'b', b = 'c', c = 'a'; +var _ = ''; + +// --- solve this in 2 lines --- +_ = a; a = c ; +c = b; b = _; ``` * [double swap - one line](http://www.pythontutor.com/live.html#code=var%20a%20%3D%20'b',%20b%20%3D%20'c',%20c%20%3D%20'a'%3B%0Avar%20_%20%3D%20''%3B%0A%0A_%20%3D%20a,%20a%20%3D%20c,%20c%20%3D%20b,%20b%20%3D%20_%3B&cumulative=false&curInstr=3&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) ```js -// your solution here +var a = 'b', b = 'c', c = 'a'; +var _ = ''; + +_ = a, a = c, c = b, b = _; ``` [TOP](#multiple-assignments) From 0d08b65500dee19f2cfbfbc7fa9610a858fe599b Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sun, 23 Jun 2019 08:30:46 +0200 Subject: [PATCH 24/54] Update jl-variables-swaps.md --- week-1/jl-variables-swaps.md | 11 ++++++++++- 1 file changed, 10 insertions(+), 1 deletion(-) diff --git a/week-1/jl-variables-swaps.md b/week-1/jl-variables-swaps.md index 6149801..ca7bdea 100644 --- a/week-1/jl-variables-swaps.md +++ b/week-1/jl-variables-swaps.md @@ -48,7 +48,16 @@ d = _; ``` 1. [the fourth](https://goo.gl/nTA1DG) ```js -// your solution here +let a = "z", b = "y", c = "x", d = "w"; +let _ = ' '; + +// can be done in 6 lines +_ = a; +a = d; +d = _; +_ = b; +b = c; +c = _; ``` 1. [the fifth](https://goo.gl/gDaKNi) ```js From 385140f30b199e162258b68d5e27b028dc6aee60 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sun, 23 Jun 2019 08:32:58 +0200 Subject: [PATCH 25/54] Update README.md --- week-1/README.md | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/week-1/README.md b/week-1/README.md index 062bb4d..1d60be4 100644 --- a/week-1/README.md +++ b/week-1/README.md @@ -2,15 +2,15 @@ | | your Emoji | your comments | coach emoji | coach comments | | --- | --- | --- | --- | --- | -| :seedling: __[fcc basics](./fcc-basic-js-pt-1.md)__: through ```Counting Cards``` | | | | | -| :dash: __[fcc debugging](./fcc-debugging.md)__ | | | | | -| :seedling: __[errors: formatting](./jl-errors-formatting.md)__ | | | | | -| :seedling: __[errors: primitives](./jl-errors-primitive-types.md)__ | | | | | -| :seedling: __[errors: variables](./jl-errors-variables.md)__ | | | | | -| :seedling: __[varibales: swaps](./jl-variables-swaps.md)__ | | | | | -| :dash: __[variables: multiple assignments](./jl-variables-multiple.md)__ | | | | | -| :seedling: __[how functions work](./jl-functions.md)__ | | | | | -| :dash: __[functions: turtle shuffle](./jl-turtle-shuffle.md)__ | | | | | +| :seedling: __[fcc basics](./fcc-basic-js-pt-1.md)__: through ```Counting Cards``` | ✅ | | | | +| :dash: __[fcc debugging](./fcc-debugging.md)__ | ✅ | | | | +| :seedling: __[errors: formatting](./jl-errors-formatting.md)__ | ✅ | | | | +| :seedling: __[errors: primitives](./jl-errors-primitive-types.md)__ | ✅ | | | | +| :seedling: __[errors: variables](./jl-errors-variables.md)__ | ✅ | | | | +| :seedling: __[varibales: swaps](./jl-variables-swaps.md)__ | ✅ | | | | +| :dash: __[variables: multiple assignments](./jl-variables-multiple.md)__ | ✅ | | | | +| :seedling: __[how functions work](./jl-functions.md)__ | ✅ | | | | +| :dash: __[functions: turtle shuffle](./jl-turtle-shuffle.md)__ | ✅ | | | | --- From 9ffba495050b562ef5979d97b86552c908f93a4b Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sun, 23 Jun 2019 08:35:04 +0200 Subject: [PATCH 26/54] Update README.md --- week-1/README.md | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/week-1/README.md b/week-1/README.md index 1d60be4..caa7f50 100644 --- a/week-1/README.md +++ b/week-1/README.md @@ -2,15 +2,15 @@ | | your Emoji | your comments | coach emoji | coach comments | | --- | --- | --- | --- | --- | -| :seedling: __[fcc basics](./fcc-basic-js-pt-1.md)__: through ```Counting Cards``` | ✅ | | | | -| :dash: __[fcc debugging](./fcc-debugging.md)__ | ✅ | | | | -| :seedling: __[errors: formatting](./jl-errors-formatting.md)__ | ✅ | | | | -| :seedling: __[errors: primitives](./jl-errors-primitive-types.md)__ | ✅ | | | | -| :seedling: __[errors: variables](./jl-errors-variables.md)__ | ✅ | | | | -| :seedling: __[varibales: swaps](./jl-variables-swaps.md)__ | ✅ | | | | -| :dash: __[variables: multiple assignments](./jl-variables-multiple.md)__ | ✅ | | | | -| :seedling: __[how functions work](./jl-functions.md)__ | ✅ | | | | -| :dash: __[functions: turtle shuffle](./jl-turtle-shuffle.md)__ | ✅ | | | | +| :seedling: __[fcc basics](./fcc-basic-js-pt-1.md)__: through ```Counting Cards``` | ⚠️ | Still working on it, I will do it multiple times to be stucked in my mind | | | +| :dash: __[fcc debugging](./fcc-debugging.md)__ | ✅ | easily done! | | | +| :seedling: __[errors: formatting](./jl-errors-formatting.md)__ | ✅ | Perfect! | | | +| :seedling: __[errors: primitives](./jl-errors-primitive-types.md)__ | ✅ | All is okay | | | +| :seedling: __[errors: variables](./jl-errors-variables.md)__ | ✅ | It's okay | | | +| :seedling: __[varibales: swaps](./jl-variables-swaps.md)__ | ✅ | it was interesting | | | +| :dash: __[variables: multiple assignments](./jl-variables-multiple.md)__ | ✅ | done | | | +| :seedling: __[how functions work](./jl-functions.md)__ | ✅ | so important to understand | | | +| :dash: __[functions: turtle shuffle](./jl-turtle-shuffle.md)__ | ✅ | easily done | | | --- From 0607bf92b425672bbf4e75fb7b188298ed5ae659 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sun, 23 Jun 2019 13:07:16 +0200 Subject: [PATCH 27/54] Update jl-functions.md --- week-1/jl-functions.md | 66 ++++++++++++++++++------------------------ 1 file changed, 28 insertions(+), 38 deletions(-) diff --git a/week-1/jl-functions.md b/week-1/jl-functions.md index 3449173..6435d2a 100644 --- a/week-1/jl-functions.md +++ b/week-1/jl-functions.md @@ -56,18 +56,16 @@ some exercises to help you understand functions: [on pytut](http://www.pythontutor.com/live.html#code=function%20f%28param_1,%20param_2,%20param_3%29%20%7B%0A%20%20var%20result%20%3D%20param_3%20%2B%20param_1%20%2B%20param_2%3B%0A%20%20return%20result%3B%0A%7D%3B%0A%0A//%20set%20values%20in%20the%20args%20to%20pass%20the%20assert%0Alet%20arg_1%20%3D%20%22%22,%20arg_2%20%3D%20%22%22,%20arg_3%20%3D%20%22%22%3B%0Alet%20return_val%20%3D%20f%28arg_1,%20arg_2,%20arg_3%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22zyx%22,%20%221%3A%20return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B&cumulative=false&curInstr=6&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) [parsonized](http://janke-learning.github.io/parsonizer/?snippet=function%20f%28param_1,%20param_2,%20param_3%29%20%7B%0A%20%20var%20result%20%3D%20param_3%20%2B%20param_1%20%2B%20param_2%3B%0A%20%20return%20result%3B%0A%7D%3B%0A%0A//%20set%20values%20in%20the%20args%20to%20pass%20the%20assert%0Alet%20arg_1%20%3D%20%22%22,%20arg_2%20%3D%20%22%22,%20arg_3%20%3D%20%22%22%3B%0Alet%20return_val%20%3D%20f%28arg_1,%20arg_2,%20arg_3%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22zyx%22,%20%22return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B) ```js -{ // 1 - function f(param_1, param_2, param_3) { - var result = param_3 + param_1 + param_2; - return result; - }; +function f(param_1, param_2, param_3) { + var result = param_3 + param_1 + param_2; + return result; +}; - // set values in the args to pass the assert - let arg_1 = "", arg_2 = "", arg_3 = ""; - let return_val = f(arg_1, arg_2, arg_3); +// set values in the args to pass the assert +let arg_1 = "y", arg_2 = "x", arg_3 = "z"; +let return_val = f(arg_1, arg_2, arg_3); - console.assert(return_val === "zyx", "1: return_val === " + return_val); -} +console.assert(return_val === "zyx", "1: return_val === " + return_val); ``` #### Solution ```js @@ -87,18 +85,16 @@ console.assert(return_val === "zyx", "1: return_val === " + return_val); [on pytut](http://www.pythontutor.com/live.html#code=function%20f%28param_1,%20param_2,%20param_3%29%20%7B%0A%20%20var%20result%20%3D%20param_3%20%2B%20param_1%20%2B%20param_2%3B%0A%20%20return%20result%3B%0A%7D%3B%0A%0A//%20set%20values%20in%20the%20args%20to%20pass%20the%20assert%0Alet%20arg_1%20%3D%20%22%22,%20arg_2%20%3D%20%22%22,%20arg_3%20%3D%20%22%22%3B%0Alet%20return_val%20%3D%20f%28arg_1,%20arg_2,%20arg_3%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22yxz%22,%20%22return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B&cumulative=false&curInstr=6&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) [parsonized](http://janke-learning.github.io/parsonizer/?snippet=function%20f%28param_1%2C%20param_2%2C%20param_3%29%20%7B%0A%20%20var%20result%20%3D%20param_3%20%2B%20param_1%20%2B%20param_2%3B%0A%20%20return%20result%3B%0A%7D%3B%0A%0A%2F%2F%20set%20values%20in%20the%20args%20to%20pass%20the%20assert%0Alet%20arg_1%20%3D%20%22%22%2C%20arg_2%20%3D%20%22%22%2C%20arg_3%20%3D%20%22%22%3B%0Alet%20return_val%20%3D%20f%28arg_1%2C%20arg_2%2C%20arg_3%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22yxz%22%2C%20%22return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B) ```js -{ // 2 - function f(param_1, param_2, param_3) { - var result = param_3 + param_1 + param_2; - return result; - }; +function f(param_1, param_2, param_3) { + var result = param_3 + param_1 + param_2; + return result; +}; - // set values in the args to pass the assert - let arg_1 = "", arg_2 = "", arg_3 = ""; - let return_val = f(arg_1, arg_2, arg_3); +// set values in the args to pass the assert +let arg_1 = "x", arg_2 = "z", arg_3 = "y"; +let return_val = f(arg_1, arg_2, arg_3); - console.assert(return_val === "yxz", "2: return_val === " + return_val); -} +console.assert(return_val === "yxz", "return_val === " + return_val); ``` #### Solution ```js @@ -119,7 +115,6 @@ console.assert(return_val === "yxz", "return_val === " + return_val); [on pytut](http://www.pythontutor.com/live.html#code=function%20f%28param_1,%20param_2,%20param_3%29%20%7B%0A%20%20var%20_%20%3D%20param_2%3B%0A%20%20param_2%20%3D%20param_1%3B%0A%20%20param_1%20%3D%20_%3B%0A%20%20var%20result%20%3D%20param_3%20%2B%20param_1%20%2B%20param_2%3B%0A%20%20return%20result%3B%0A%7D%3B%0A%0A//%20set%20values%20in%20the%20args%20to%20pass%20the%20assert%0Alet%20arg_1%20%3D%20%22%22,%20arg_2%20%3D%20%22%22,%20arg_3%20%3D%20%22%22%3B%0Alet%20return_val%20%3D%20f%28arg_1,%20arg_2,%20arg_3%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22yxz%22,%20%22return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B&cumulative=false&curInstr=9&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) [parsonized](http://janke-learning.github.io/parsonizer/?snippet=function%20f%28param_1%2C%20param_2%2C%20param_3%29%20%7B%0A%20%20var%20_%20%3D%20param_2%3B%0A%20%20param_2%20%3D%20param_1%3B%0A%20%20param_1%20%3D%20_%3B%0A%20%20var%20result%20%3D%20param_3%20%2B%20param_1%20%2B%20param_2%3B%0A%20%20return%20result%3B%0A%7D%3B%0A%0A%2F%2F%20set%20values%20in%20the%20args%20to%20pass%20the%20assert%0Alet%20arg_1%20%3D%20%22%22%2C%20arg_2%20%3D%20%22%22%2C%20arg_3%20%3D%20%22%22%3B%0Alet%20return_val%20%3D%20f%28arg_1%2C%20arg_2%2C%20arg_3%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22yxz%22%2C%20%22return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B) ```js -{ // 3 function f(param_1, param_2, param_3) { var _ = param_2; param_2 = param_1; @@ -129,11 +124,11 @@ console.assert(return_val === "yxz", "return_val === " + return_val); }; // set values in the args to pass the assert - let arg_1 = "", arg_2 = "", arg_3 = ""; + let arg_1 = "z", arg_2 = "x", arg_3 = "y"; let return_val = f(arg_1, arg_2, arg_3); console.assert(return_val === "yxz", "3: return_val === " + return_val); -} + ``` #### Solution @@ -158,7 +153,7 @@ console.assert(return_val === "yxz", "return_val === " + return_val); [on pytut](http://www.pythontutor.com/live.html#code=function%20f%28param_1,%20param_2,%20param_3%29%20%7B%0A%20%20var%20_%20%3D%20param_2%3B%0A%20%20param_2%20%3D%20param_3%3B%0A%20%20param_3%20%3D%20_%3B%0A%20%20var%20result%20%3D%20param_3%20%2B%20param_1%20%2B%20param_2%3B%0A%20%20return%20result%3B%0A%7D%3B%0A%0A//%20set%20values%20in%20the%20args%20to%20pass%20the%20assert%0Alet%20arg_1%20%3D%20%22%22,%20arg_2%20%3D%20%22%22,%20arg_3%20%3D%20%22%22%3B%0Alet%20return_val%20%3D%20f%28arg_1,%20arg_2,%20arg_3%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22xyz%22,%20%22return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B&cumulative=false&curInstr=9&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) [parsonized](http://janke-learning.github.io/parsonizer/?snippet=function%20f%28param_1%2C%20param_2%2C%20param_3%29%20%7B%0A%20%20var%20_%20%3D%20param_2%3B%0A%20%20param_2%20%3D%20param_3%3B%0A%20%20param_3%20%3D%20_%3B%0A%20%20var%20result%20%3D%20param_3%20%2B%20param_1%20%2B%20param_2%3B%0A%20%20return%20result%3B%0A%7D%3B%0A%0A%2F%2F%20set%20values%20in%20the%20args%20to%20pass%20the%20assert%0Alet%20arg_1%20%3D%20%22%22%2C%20arg_2%20%3D%20%22%22%2C%20arg_3%20%3D%20%22%22%3B%0Alet%20return_val%20%3D%20f%28arg_1%2C%20arg_2%2C%20arg_3%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22xyz%22%2C%20%22return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B) ```js -{ // 4 + function f(param_1, param_2, param_3) { var _ = param_2; param_2 = param_3; @@ -168,11 +163,10 @@ console.assert(return_val === "yxz", "return_val === " + return_val); }; // set values in the args to pass the assert - let arg_1 = "", arg_2 = "", arg_3 = ""; + let arg_1 = "y", arg_2 = "x", arg_3 = "z"; let return_val = f(arg_1, arg_2, arg_3); console.assert(return_val === "xyz", "4: return_val === " + return_val); -} ``` ### 5 @@ -180,17 +174,17 @@ console.assert(return_val === "yxz", "return_val === " + return_val); [on pytut](http://www.pythontutor.com/live.html#code=function%20f%28param_1,%20param_2,%20param_3%29%20%7B%0A%20var%20result%20%3D%20param_3%20%2B%20param_1%20%2B%20param_2%3B%0A%20return%20result%3B%0A%7D%3B%0A%0Alet%20x%20%3D%20%22x%22,%20y%20%3D%20%22y%22,%20z%20%3D%20%22z%22%3B%0Alet%20return_val%20%3D%20f%28/*%20pass%20x,%20y%20%26%20z%20in%20the%20right%20order%20*/%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22xyz%22,%20%225%3A%20return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B&cumulative=false&curInstr=6&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) [parsonized](http://janke-learning.github.io/parsonizer/?snippet=function%20f%28param_1%2C%20param_2%2C%20param_3%29%20%7B%0A%20var%20result%20%3D%20param_3%20%2B%20param_1%20%2B%20param_2%3B%0A%20return%20result%3B%0A%7D%3B%0A%0Alet%20x%20%3D%20%22x%22%2C%20y%20%3D%20%22y%22%2C%20z%20%3D%20%22z%22%3B%0Alet%20return_val%20%3D%20f%28%2F*%20pass%20x%2C%20y%20%26%20z%20in%20the%20right%20order%20*%2F%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22xyz%22%2C%20%225%3A%20return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B) ```js -{ // 5 + function f(param_1, param_2, param_3) { var result = param_3 + param_1 + param_2; return result; }; let x = "x", y = "y", z = "z"; - let return_val = f(/* pass x, y & z in the right order */); + let return_val = f(y, z, x); console.assert(return_val === "xyz", "5: return_val === " + return_val); -} + ``` ### 6 @@ -198,17 +192,15 @@ console.assert(return_val === "yxz", "return_val === " + return_val); [on pytut](http://www.pythontutor.com/live.html#code=function%20f%28param_1,%20param_2,%20param_3%29%20%7B%0A%20var%20result%20%3D%20param_2%20%2B%20param_1%20%2B%20param_3%3B%0A%20return%20result%3B%0A%7D%3B%0A%0Alet%20x%20%3D%20%22x%22,%20y%20%3D%20%22y%22,%20z%20%3D%20%22z%22%3B%0Alet%20return_val%20%3D%20f%28/*%20pass%20x,%20y%20%26%20z%20in%20the%20right%20order%20*/%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22xzy%22,%20%226%3A%20return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B&cumulative=false&curInstr=6&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) [parsonized](http://janke-learning.github.io/parsonizer/?snippet=function%20f%28param_1%2C%20param_2%2C%20param_3%29%20%7B%0A%20var%20result%20%3D%20param_2%20%2B%20param_1%20%2B%20param_3%3B%0A%20return%20result%3B%0A%7D%3B%0A%0Alet%20x%20%3D%20%22x%22%2C%20y%20%3D%20%22y%22%2C%20z%20%3D%20%22z%22%3B%0Alet%20return_val%20%3D%20f%28%2F*%20pass%20x%2C%20y%20%26%20z%20in%20the%20right%20order%20*%2F%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22xzy%22%2C%20%226%3A%20return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B) ```js -{ // 6 function f(param_1, param_2, param_3) { var result = param_2 + param_1 + param_3; return result; }; let x = "x", y = "y", z = "z"; - let return_val = f(/* pass x, y & z in the right order */); + let return_val = f(z, x, y); console.assert(return_val === "xzy", "6: return_val === " + return_val); -} ``` ### 7 @@ -216,9 +208,8 @@ console.assert(return_val === "yxz", "return_val === " + return_val); [on pytut](http://www.pythontutor.com/live.html#code=function%20f%28param_1,%20param_2,%20param_3%29%20%7B%0A%20var%20result%20%3D%20/*%20arrange%20the%20params%20to%20pass%20the%20assert%20*/%3B%0A%20return%20result%3B%0A%7D%3B%0A%0Alet%20arg_1%20%3D%20%22z%22,%20arg_2%20%3D%20%22y%22,%20arg_3%20%3D%20%22x%22%3B%0Alet%20return_val%20%3D%20f%28arg_1,%20arg_2,%20arg_3%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22xzy%22,%20%227%3A%20return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B&cumulative=false&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) [parsonized](http://janke-learning.github.io/parsonizer/?snippet=function%20f%28param_1%2C%20param_2%2C%20param_3%29%20%7B%0A%20var%20result%20%3D%20%2F*%20arrange%20the%20params%20to%20pass%20the%20assert%20*%2F%3B%0A%20return%20result%3B%0A%7D%3B%0A%0Alet%20arg_1%20%3D%20%22z%22%2C%20arg_2%20%3D%20%22y%22%2C%20arg_3%20%3D%20%22x%22%3B%0Alet%20return_val%20%3D%20f%28arg_1%2C%20arg_2%2C%20arg_3%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22xzy%22%2C%20%227%3A%20return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B) ```js -{ // 7 function f(param_1, param_2, param_3) { - var result = /* arrange the params to pass the assert */; + var result = param_3 + param_1 + param_2; return result; }; @@ -226,7 +217,6 @@ console.assert(return_val === "yxz", "return_val === " + return_val); let return_val = f(arg_1, arg_2, arg_3); console.assert(return_val === "xzy", "7: return_val === " + return_val); -} ``` ### 8 @@ -234,9 +224,9 @@ console.assert(return_val === "yxz", "return_val === " + return_val); [on pytut](http://www.pythontutor.com/live.html#code=function%20f%28param_1,%20param_2,%20param_3%29%20%7B%0A%20var%20result%20%3D%20/*%20arrange%20the%20params%20to%20pass%20the%20assert%20*/%3B%0A%20return%20result%3B%0A%7D%3B%0A%0Alet%20arg_1%20%3D%20%22z%22,%20arg_2%20%3D%20%22y%22,%20arg_3%20%3D%20%22x%22%3B%0Alet%20return_val%20%3D%20f%28arg_1,%20arg_2,%20arg_3%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22yxz%22,%20%228%3A%20return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B&cumulative=false&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) [parsonized](http://janke-learning.github.io/parsonizer/?snippet=function%20f%28param_1%2C%20param_2%2C%20param_3%29%20%7B%0A%20var%20result%20%3D%20%2F*%20arrange%20the%20params%20to%20pass%20the%20assert%20*%2F%3B%0A%20return%20result%3B%0A%7D%3B%0A%0Alet%20arg_1%20%3D%20%22z%22%2C%20arg_2%20%3D%20%22y%22%2C%20arg_3%20%3D%20%22x%22%3B%0Alet%20return_val%20%3D%20f%28arg_1%2C%20arg_2%2C%20arg_3%29%3B%0A%0Aconsole.assert%28return_val%20%3D%3D%3D%20%22yxz%22%2C%20%228%3A%20return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B) ```js -{ // 8 + function f(param_1, param_2, param_3) { - var result = /* arrange the params to pass the assert */; + var result = param_2 + param_3 + param_1; return result; }; @@ -244,7 +234,7 @@ console.assert(return_val === "yxz", "return_val === " + return_val); let return_val = f(arg_1, arg_2, arg_3); console.assert(return_val === "yxz", "8: return_val === " + return_val); -} + ``` --- From 9c1e14b4845688416ab1bdeba733dc1c20a7166b Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sun, 23 Jun 2019 13:13:45 +0200 Subject: [PATCH 28/54] Update jl-variables-swaps.md --- week-1/jl-variables-swaps.md | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/week-1/jl-variables-swaps.md b/week-1/jl-variables-swaps.md index ca7bdea..1142ea5 100644 --- a/week-1/jl-variables-swaps.md +++ b/week-1/jl-variables-swaps.md @@ -61,7 +61,17 @@ c = _; ``` 1. [the fifth](https://goo.gl/gDaKNi) ```js -// your solution here +let a = "z", b = "y", c = "x", d = "w", e = "v"; +let _ = ' '; + +// can be done in 6 lines +_ = a; +a = e; +e = _ +_ = b; +b = d; +d = _; + ``` ___ From 8738beeab88cdd3b7b089079d3f353f15af36113 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sun, 23 Jun 2019 14:49:19 +0200 Subject: [PATCH 29/54] Update jl-turtle-shuffle.md --- week-1/jl-turtle-shuffle.md | 64 +++++++++++++++---------------------- 1 file changed, 25 insertions(+), 39 deletions(-) diff --git a/week-1/jl-turtle-shuffle.md b/week-1/jl-turtle-shuffle.md index e2be5d8..e72fd99 100644 --- a/week-1/jl-turtle-shuffle.md +++ b/week-1/jl-turtle-shuffle.md @@ -51,23 +51,21 @@ some trickier function exercises before moving on. [on pytut](http://www.pythontutor.com/javascript.html#code=function%20turtle%28_1%2C%20_2%2C%20_3%29%20%7B%0A%20%20var%20result%20%3D%20%22%22%3B%0A%20%20var%20the_start%20%3D%20%22tur%22%3B%0A%20%20result%20%3D%20the_start%20%2B%20_1%20%2B%20_2%20%2B%20_3%3B%0A%20%20return%20result%3B%0A%7D%0Aconst%20return_val%20%3D%20turtle%28%2F*%20write%20some%20arguments%20*%2F%29%3B%0Aconsole.assert%28return_val%20%3D%3D%3D%20\'turtle\'%2C%20%222%3A%20return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B&curInstr=0&mode=display&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) ```js -{ // 1 - function turtle(_1, _2, _3) { - var result = ""; - var the_start = "tur"; - result = the_start + _1 + _2 + _3; - return result; - } - const return_val = turtle(/* write some arguments */); - console.assert(return_val === 'turtle', "1: return_val === " + return_val); -}; +function turtle(_1, _2, _3) { + var result = ""; + var the_start = "tur"; + result = the_start + _1 + _2 + _3; + return result; +} +const return_val = turtle("t", "l", "e"); +console.assert(return_val === 'turtle', "2: return_val === " + return_val); ``` ### 2 [on pytut](http://www.pythontutor.com/javascript.html#code=function%20turtle%28_1%2C%20_2%29%20%7B%0A%20%20var%20result%20%3D%20%22%22%3B%0A%20%20var%20the_start%20%3D%20%22tu%22%3B%0A%20%20var%20the_end%20%3D%20%22le%22%3B%0A%20%20result%20%3D%20the_start%20%2B%20_1%20%2B%20_2%20%2B%20the_end%3B%0A%20%20return%20result%3B%0A%7D%0Aconst%20return_val%20%3D%20turtle%28%2F*%20write%20some%20arguments%20*%2F%29%3B%0Aconsole.assert%28return_val%20%3D%3D%3D%20\'turtle\'%2C%20%223%3A%20return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B&curInstr=0&mode=display&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) ```js -{ // 2 + function turtle(_1, _2) { var result = ""; var the_start = "tu"; @@ -75,97 +73,85 @@ some trickier function exercises before moving on. result = the_start + _1 + _2 + the_end; return result; } - const return_val = turtle(/* write some arguments */); + const return_val = turtle("r", "t"); console.assert(return_val === 'turtle', "2: return_val === " + return_val); -}; + ``` ### 3 [on pytut](http://www.pythontutor.com/javascript.html#code=function%20turtle%28_1%2C%20_2%29%20%7B%0A%20%20var%20result%20%3D%20%22t%22%20%2B%20_1%20%2B%20%22r%22%20%2B%20_2%3B%0A%20%20return%20result%3B%0A%7D%0Aconst%20return_val%20%3D%20turtle%28%2F*%20write%20some%20arguments%20*%2F%29%3B%0Aconsole.assert%28return_val%20%3D%3D%3D%20\'turtle\'%2C%20%224%3A%20return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29&curInstr=0&mode=display&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) ```js -{ // 3 + function turtle(_1, _2) { var result = "t" + _1 + "r" + _2; return result; } - const return_val = turtle(/* write some arguments */); + const return_val = turtle("u", "tle"); console.assert(return_val === 'turtle', "3: return_val === " + return_val); -}; + ``` ### 4 [on pytut](http://www.pythontutor.com/javascript.html#code=function%20turtle%28_1%2C%20_2%2C%20_3%29%20%7B%0A%20%20var%20result%20%3D%20%22t%22%20%2B%20_2%20%2B%20%22r%22%20%2B%20_1%20%2B%20_3%3B%0A%20%20return%20result%3B%0A%7D%0Aconst%20return_val_1%20%3D%20turtle%28%2F*%20write%20some%20arguments%20*%2F%29%3B%0Aconsole.assert%28return_val_1%20%3D%3D%3D%20\'turtle\'%2C%20%225%3A%20return_val_1%20%3D%3D%3D%20%22%20%2B%20return_val_1%29%3B%0A%0Aconst%20return_val_2%20%3D%20turtle%28%2F*%20write%20some%20arguments%20*%2F%29%3B%0Aconsole.assert%28return_val_2%20%3D%3D%3D%20\'turtle\'%2C%20%225%3A%20return_val_2%20%3D%3D%3D%20%22%20%2B%20return_val_2%29%3B&curInstr=0&mode=display&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) ```js -{ // 4 function turtle(_1, _2, _3) { var result = "t" + _2 + "r" + _1 + _3; return result; } - const return_val_1 = turtle(/* write some arguments */); + const return_val_1 = turtle("tl", "u", "e"); console.assert(return_val_1 === 'turtle', "5: return_val_1 === " + return_val_1); - const return_val_2 = turtle(/* write some arguments */); + const return_val_2 = turtle("tl", "u", "e"); console.assert(return_val_2 === 'turtle', "4: return_val_2 === " + return_val_2); -}; ``` ### 5 [on pytut](http://www.pythontutor.com/javascript.html#code=function%20turtle%28_1%2C%20_2%2C%20_3%29%20%7B%0A%20%20var%20result%20%3D%20_1%20%2B%20_2%20%2B%20_3%3B%0A%20%20return%20result%3B%0A%7D%0Aconst%20return_val_1%20%3D%20turtle%28%2F*%20write%20some%20arguments%20*%2F%29%3B%0Aconsole.assert%28return_val_1%20%3D%3D%3D%20\'turtle\'%2C%20%226%3A%20return_val_1%20%3D%3D%3D%20%22%20%2B%20return_val_1%29%3B%0A%0Aconst%20return_val_2%20%3D%20turtle%28%2F*%20write%20some%20arguments%20*%2F%29%3B%0Aconsole.assert%28return_val_2%20%3D%3D%3D%20\'turtle\'%2C%20%226%3A%20return_val_2%20%3D%3D%3D%20%22%20%2B%20return_val_2%29%3B%0A%0Aconst%20return_val_3%20%3D%20turtle%28%2F*%20write%20some%20arguments%20*%2F%29%3B%0Aconsole.assert%28return_val_3%20%3D%3D%3D%20\'turtle\'%2C%20%226%3A%20return_val_3%20%3D%3D%3D%20%22%20%2B%20return_val_3%29%3B%0A%0Aconst%20return_val_4%20%3D%20turtle%28%2F*%20write%20some%20arguments%20*%2F%29%3B%0Aconsole.assert%28return_val_4%20%3D%3D%3D%20\'turtle\'%2C%20%226%3A%20return_val_4%20%3D%3D%3D%20%22%20%2B%20return_val_4%29%3B%0A%0Aconst%20return_val_5%20%3D%20turtle%28%2F*%20write%20some%20arguments%20*%2F%29%3B%0Aconsole.assert%28return_val_5%20%3D%3D%3D%20\'turtle\'%2C%20%226%3A%20return_val_5%20%3D%3D%3D%20%22%20%2B%20return_val_5%29%3B%0A%0Aconst%20return_val_6%20%3D%20turtle%28%2F*%20write%20some%20arguments%20*%2F%29%3B%0Aconsole.assert%28return_val_6%20%3D%3D%3D%20\'turtle\'%2C%20%226%3A%20return_val_6%20%3D%3D%3D%20%22%20%2B%20return_val_6%29%3B&curInstr=0&mode=display&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) ```js -{ // 5 function turtle(_1, _2, _3) { var result = _1 + _2 + _3; return result; } - const return_val_1 = turtle(/* write some arguments */); + const return_val_1 = turtle("tu", "rt", "le"); console.assert(return_val_1 === 'turtle', "5: return_val_1 === " + return_val_1); - const return_val_2 = turtle(/* write some arguments */); + const return_val_2 = turtle("t", "urt", "le"); console.assert(return_val_2 === 'turtle', "5: return_val_2 === " + return_val_2); - const return_val_3 = turtle(/* write some arguments */); + const return_val_3 = turtle("tur", "t", "le"); console.assert(return_val_3 === 'turtle', "5: return_val_3 === " + return_val_3); - const return_val_4 = turtle(/* write some arguments */); + const return_val_4 = turtle("tu", "rtl", "e"); console.assert(return_val_4 === 'turtle', "5: return_val_4 === " + return_val_4); - const return_val_5 = turtle(/* write some arguments */); + const return_val_5 = turtle("tur", "tl", "e"); console.assert(return_val_5 === 'turtle', "5: return_val_5 === " + return_val_5); - const return_val_6 = turtle(/* write some arguments */); + const return_val_6 = turtle("t", "ur", "tle"); console.assert(return_val_6 === 'turtle', "5: return_val_6 === " + return_val_6); -}; ``` ### 6 [on pytut](http://www.pythontutor.com/javascript.html#code=function%20turtle%28_1%2C%20_2%2C%20_3%2C%20_4%2C%20_5%29%20%7B%0A%20%20var%20result%20%3D%20_4%20%2B%20_2%20%2B%20_5%20%2B%20_4%20%2B%20_1%20%2B%20_3%3B%0A%20%20return%20result%3B%0A%7D%0Aconst%20return_val%20%3D%20turtle%28%2F*%20write%20some%20arguments%20*%2F%29%3B%0Aconsole.assert%28return_val%20%3D%3D%3D%20\'turtle\'%2C%20%227%3A%20return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B&curInstr=0&mode=display&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) ```js -{ // 6 function turtle(_1, _2, _3, _4, _5) { var result = _4 + _2 + _5 + _4 + _1 + _3; return result; } - const return_val = turtle(/* write some arguments */); + const return_val = turtle("l", "u", "e", "t", "r"); console.assert(return_val === 'turtle', "6: return_val === " + return_val); -}; + ``` ### 7 [on pytut](http://www.pythontutor.com/javascript.html#code=function%20turtle%28_1%2C%20_2%2C%20_3%2C%20_4%2C%20_5%29%20%7B%0A%20%20var%20result%20%3D%20_2%20%2B%20_1%20%2B%20_4%20%2B%20_2%20%2B%20%22l%22%20%2B%20_3%3B%0A%20%20return%20result%3B%0A%7D%0Aconst%20return_val%20%3D%20turtle%28%2F*%20write%20some%20arguments%20*%2F%29%3B%0Aconsole.assert%28return_val%20%3D%3D%3D%20\'turtle\'%2C%20%227%3A%20return_val%20%3D%3D%3D%20%22%20%2B%20return_val%29%3B&curInstr=0&mode=display&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) ```js -{ // 7 - function turtle(_1, _2, _3, _4, _5) { - var result = _2 + _1 + _4 + _2 + "l" + _3; - return result; - } - const return_val = turtle(/* write some arguments */); - console.assert(return_val === 'turtle', "7: return_val === " + return_val); -}; + ``` ### 8 From 6f2ffc1e1ed77272fa56827f3d867690e23f162e Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Wed, 26 Jun 2019 12:20:12 +0200 Subject: [PATCH 30/54] Update jl-errors-arrays.md --- week-2/jl-errors-arrays.md | 84 +++++++++++++++++++++++++++++++++++++- 1 file changed, 83 insertions(+), 1 deletion(-) diff --git a/week-2/jl-errors-arrays.md b/week-2/jl-errors-arrays.md index c86374f..f8a1e95 100644 --- a/week-2/jl-errors-arrays.md +++ b/week-2/jl-errors-arrays.md @@ -1,3 +1,85 @@ > paste [this markdown](https://raw.githubusercontent.com/janke-learning/error-exercises/master/arrays.md) into this file and fix the errors! > [completed example](https://github.com/AlfiYusrina/hyf-javascript1/blob/master/week1/errors_solutions.MD) (of the old version) -> references: [errors & life-cycle](https://github.com/janke-learning/errors-and-life-cycle), [exercise repo](https://github.com/janke-learning/errors) \ No newline at end of file +> references: [errors & life-cycle](https://github.com/janke-learning/errors-and-life-cycle), [exercise repo](https://github.com/janke-learning/errors) + +# Array Errors + + +* [missing closing bracket](#missing-closing-bracket) +* [missing comma](#missing-comma) +* [poorly nested](#poorly-nested) + +--- + +## missing closing bracket + +broken code: +```js +let myArray = [1, 2, 3; +``` +error message: +``` +``` +classification: +* creation phase or execution phase ? +* syntax or semanitc ? + +the fix: +```js +``` +your notes: + +[TOP](#array-errors) + +--- + +## missing comma + +broken code: +```js +let myArray = [1, 2 3]; +``` +error message: +``` +``` +classification: +* creation phase or execution phase ? +* syntax or semanitc ? + +the fix: +```js +``` +your notes: + +[TOP](#array-errors) + +--- + +## poorly nested + +broken code: +```js +let myArray = [ + [1, 2, 3] + [4, 5, 6] + [7, 8, 9] + ]; +``` +error message: +``` +``` +classification: +* creation phase or execution phase ? +* syntax or semanitc ? + +the fix: +```js +``` +your notes: + +[TOP](#array-errors) + + +___ +___ +### Janke Learning From 3c9cb6eb6f34d284252d2bcb9db0bb8ff1a3826b Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Wed, 26 Jun 2019 12:28:02 +0200 Subject: [PATCH 31/54] Update jl-errors-arrays.md --- week-2/jl-errors-arrays.md | 24 ++++++++++++++++++------ 1 file changed, 18 insertions(+), 6 deletions(-) diff --git a/week-2/jl-errors-arrays.md b/week-2/jl-errors-arrays.md index f8a1e95..a93889f 100644 --- a/week-2/jl-errors-arrays.md +++ b/week-2/jl-errors-arrays.md @@ -19,13 +19,15 @@ let myArray = [1, 2, 3; ``` error message: ``` +Uncaught SyntaxError: Unexpected token ; ``` classification: -* creation phase or execution phase ? -* syntax or semanitc ? +* creation phase +* syntax the fix: ```js +let myArray = [1, 2, 3]; ``` your notes: @@ -41,13 +43,16 @@ let myArray = [1, 2 3]; ``` error message: ``` +Uncaught SyntaxError: Unexpected number + ``` classification: -* creation phase or execution phase ? -* syntax or semanitc ? +* creation phase +* syntax the fix: ```js +let myArray = [1, 2, 3]; ``` your notes: @@ -67,13 +72,20 @@ let myArray = [ ``` error message: ``` +Uncaught TypeError: Cannot read property '9' of undefined + at :4:17 ``` classification: -* creation phase or execution phase ? -* syntax or semanitc ? +* creation phase +* syntax the fix: ```js +let myArray = [ + [1, 2, 3], + [4, 5, 6], + [7, 8, 9] + ]; ``` your notes: From 74c07aeecfd8df5e0fd3f9933943048da3631cc6 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Wed, 26 Jun 2019 12:43:33 +0200 Subject: [PATCH 32/54] Update jl-errors-const.md --- week-2/jl-errors-const.md | 92 ++++++++++++++++++++++++++++++++++++++- 1 file changed, 91 insertions(+), 1 deletion(-) diff --git a/week-2/jl-errors-const.md b/week-2/jl-errors-const.md index 82a6984..58cbe9c 100644 --- a/week-2/jl-errors-const.md +++ b/week-2/jl-errors-const.md @@ -1,2 +1,92 @@ > paste [this markdown](https://raw.githubusercontent.com/janke-learning/error-exercises/master/const.md) into this file and fix the errors! -> references: [errors & life-cycle](https://github.com/janke-learning/errors-and-life-cycle), [exercise repo](https://github.com/janke-learning/errors) \ No newline at end of file +> references: [errors & life-cycle](https://github.com/janke-learning/errors-and-life-cycle), [exercise repo](https://github.com/janke-learning/errors) + +# Variable Errors + + +### exercises +* [missing variable name](#missing-variable-name) +* [reassigning to constant](#reassigning-to-constant) +* [unassigned const declaration](#unassigned-const-declaration) + +--- + +### missing variable name + +broken code: +```js +const = 5; +``` +error message: +```js +Uncaught SyntaxError: Unexpected token = +``` +classification: +* creation phase +* syntax + +the fix: +```js +const a = 5; +``` +your notes: + +[TOP](#variable-errors) + +--- + + +## reassigning to constant + +broken code: +```js +const a = 9; +a = 0; +``` +error message: +``` +Uncaught TypeError: Assignment to constant variable. + at :2:3 +``` +classification: +* creation phase +* syntax + +the fix: +```js +const a = 9, +x = 0; +``` +your notes: + +[TOP](#variable-errors) + +--- + + +## unassigned const declaration + +broken code: +```js +const a; +a = 0; +``` +error message: +``` +Uncaught SyntaxError: Missing initializer in const declaration +``` +classification: +* creation phase +* syntax + +the fix: +```js +const a = 0; +``` +your notes: + +[TOP](#variable-errors) + +___ +___ +### Janke Learning From 48a07e7b20880a95eeb4de26d001dfb8b382f890 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Wed, 26 Jun 2019 12:44:05 +0200 Subject: [PATCH 33/54] Update jl-errors-objects.md --- week-2/jl-errors-objects.md | 57 ++++++++++++++++++++++++++++++++++++- 1 file changed, 56 insertions(+), 1 deletion(-) diff --git a/week-2/jl-errors-objects.md b/week-2/jl-errors-objects.md index 73f2eee..4effbc2 100644 --- a/week-2/jl-errors-objects.md +++ b/week-2/jl-errors-objects.md @@ -1,3 +1,58 @@ > paste [this markdown](https://raw.githubusercontent.com/janke-learning/error-exercises/master/objects.md) into this file and fix the errors! > [completed example](https://github.com/AlfiYusrina/hyf-javascript1/blob/master/week1/errors_solutions.MD) (of the old version) -> references: [errors & life-cycle](https://github.com/janke-learning/errors-and-life-cycle), [exercise repo](https://github.com/janke-learning/errors) \ No newline at end of file +> references: [errors & life-cycle](https://github.com/janke-learning/errors-and-life-cycle), [exercise repo](https://github.com/janke-learning/errors) + +# Object Errors + +* [too-far object access](#too-far-object-access) +* [access property directly](#access-property-directly) + +--- + +## too-far object access + +broken code: +```js +let a = {b:3}; +let b = a.b.3 +``` +error message: +``` +``` +classification: +* creation phase or execution phase ? +* syntax or semanitc ? + +the fix: +```js +``` +your notes: + +[TOP](#object-errors) + +--- + +## access property directly +broken code: +```js +let x = {b:'e'}; +let y = b.e; +``` +error message: +``` +``` +classification: +* creation phase or execution phase ? +* syntax or semanitc ? + +the fix: +```js +``` +your notes: + +[TOP](#object-errors) + + +___ +___ +### Janke Learning From a296aeb7d98f3ba91d801525560de93acd2adfb6 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Wed, 26 Jun 2019 12:48:18 +0200 Subject: [PATCH 34/54] Update jl-errors-objects.md --- week-2/jl-errors-objects.md | 15 +++++++++++---- 1 file changed, 11 insertions(+), 4 deletions(-) diff --git a/week-2/jl-errors-objects.md b/week-2/jl-errors-objects.md index 4effbc2..67ee492 100644 --- a/week-2/jl-errors-objects.md +++ b/week-2/jl-errors-objects.md @@ -18,13 +18,16 @@ let b = a.b.3 ``` error message: ``` +Uncaught SyntaxError: Unexpected number ``` classification: -* creation phase or execution phase ? -* syntax or semanitc ? +* creation phase +* syntax the fix: ```js +let a = {b:3}; +let b = a.a; ``` your notes: @@ -40,13 +43,17 @@ let y = b.e; ``` error message: ``` +Uncaught ReferenceError: b is not defined + at :2:9 ``` classification: -* creation phase or execution phase ? -* syntax or semanitc ? +* creation phase +* syntax the fix: ```js +let x = {b:'e'}; +let y = x; ``` your notes: From eac624f58dc44c2bbdc8d34ff0510bf3b5f688b1 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Wed, 26 Jun 2019 14:05:51 +0200 Subject: [PATCH 35/54] Update jl-functions-ref-type-args.md --- week-2/jl-functions-ref-type-args.md | 261 +++++++++++++++++++++++++++ 1 file changed, 261 insertions(+) diff --git a/week-2/jl-functions-ref-type-args.md b/week-2/jl-functions-ref-type-args.md index 3d1522f..62689b1 100644 --- a/week-2/jl-functions-ref-type-args.md +++ b/week-2/jl-functions-ref-type-args.md @@ -1 +1,262 @@ > paste [this markdown of exercises](https://raw.githubusercontent.com/janke-learning/function-exercises/master/reference-type-arguments.md) into this file and complete the exercises! + +# Reference Type Arguments + +When reference types (ie. arrays, objects) are passed as arguments to a function JavaScript simply passes a pointer to the thing in memory. If you modify a data structure that was passed as an argument, the changes will remain in the global scope after the frame has closed. This is a _side effect_. + +These examples and exercises will help you understand _side effects_ and how to avoid them. + +### Index: +* examples to study + * [side effects with return value](#with-return-value) + * [side effects without return value](#without-return-value) + * [comparing objects & arrays](#comparing-objects-and-arrays) + * [avoid S.E.'s by starting a new one](#by-starting-a-new-one) + * [avoid S.E.'s by making a copy](#by-making-a-copy) +* exercises + * [copy an array](#copy-an-array) + * [start a new array](#start-a-new-array) + * [copy an object](#copy-an-object) + * [start a new object](#start-a-new-object) + + +--- + +## Examples to Study + +## Side Effects + +### with return value +[on pytut](http://www.pythontutor.com/live.html#code=function%20no_side_effects%28param%29%20%7B%0A%20%20return%20%22%22%20%2B%20param%3B%0A%7D%0A%0Aconst%20arg%20%3D%203%3B%0Aconst%20ret_val%20%3D%20no_side_effects%28arg%29%3B%0A%0A//%20----%0A%0Afunction%20side_effector%28ref_type,%20key%29%20%7B%0A%20%20ref_type%5Bkey%5D%20%3D%20'side%20effect!'%3B%0A%20%20return%20ref_type%3B%0A%7D%0A%0Aconst%20arr%20%3D%20%5B'a'%5D%3B%0Aconst%20arr_ret_val%20%3D%20side_effector%28arr,%201%29%3B%0Aconsole.assert%28arr%5B1%5D%20%3D%3D%3D%20arr_ret_val%5B1%5D%29%3B%0A%0A%0Aconst%20obj%20%3D%20%7Ba%3A%201%7D%3B%0Aconst%20obj_ret_val%20%3D%20side_effector%28obj,%20'b'%29%3B%0Aconsole.assert%28obj.b%20%3D%3D%3D%20obj_ret_val.b%29%3B&cumulative=false&curInstr=0&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +```js +{ + function no_side_effects(param) { + return "" + param; + } + + const arg = 3; + const ret_val = no_side_effects(arg); + + // ---- + + function side_effector(ref_type, key) { + ref_type[key] = 'side effect!'; + return ref_type; + } + + const arr = ['a']; + const arr_ret_val = side_effector(arr, 1); + console.assert(arr[1] === arr_ret_val[1]); + + + const obj = {a: 1}; + const obj_ret_val = side_effector(obj, 'b'); + console.assert(obj.b === obj_ret_val.b); +} +``` + + +### without return value +[on pytut](http://www.pythontutor.com/live.html#code=function%20no_side_effects%28param%29%20%7B%0A%20%20const%20result%20%3D%20%22%22%20%2B%20param%3B%0A%7D%0A%0Aconst%20arg%20%3D%203%3B%0Ano_side_effects%28arg%29%3B%0A%0A%0A//%20---%0A%0Afunction%20side_effector%28ref_type,%20key%29%20%7B%0A%20%20ref_type%5Bkey%5D%20%3D%20'side%20effect!'%3B%0A%7D%0A%0Aconst%20arr%20%3D%20%5B'a'%5D%3B%0Aside_effector%28arr,%201%29%3B%0Aconsole.assert%28arr%5B1%5D%20%3D%3D%3D%20'side%20effect!'%29%3B%0A%0A%0Aconst%20obj%20%3D%20%7Ba%3A%201%7D%3B%0Aside_effector%28obj,%20'b'%29%3B%0Aconsole.assert%28obj.b%20%3D%3D%3D%20'side%20effect!'%29%3B&cumulative=false&curInstr=11&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +```js +{ + function no_side_effects(param) { + const result = "" + param; + } + + const arg = 3; + no_side_effects(arg); + + + // --- + + function side_effector(ref_type, key) { + ref_type[key] = 'side effect!'; + } + + const arr = ['a']; + side_effector(arr, 1); + console.assert(arr[1] === 'side effect!'); + + + const obj = {a: 1}; + side_effector(obj, 'b'); + console.assert(obj.b === 'side effect!'); +} +``` + +## Comparing Objects and Arrays + +[on pytut](http://www.pythontutor.com/live.html#code=const%20arr_1%20%3D%20%5B3,2,1%5D%3B%0Aconst%20arr_2%20%3D%20%5B3,2,1%5D%3B%0A%0Aconst%20arr_1_stringified%20%3D%20JSON.stringify%28arr_1%29%3B%0Aconst%20arr_2_stringified%20%3D%20JSON.stringify%28arr_2%29%3B%0A%0Aconsole.assert%28arr_1%20%3D%3D%3D%20arr_2%29%3B%0Aconsole.assert%28arr_1_stringified%20%3D%3D%3D%20arr_2_stringified%29%3B%0A%0A%0Aconst%20obj_1%20%3D%20%7Ba%3A3,b%3A2,c%3A1%7D%3B%0Aconst%20obj_2%20%3D%20%7Ba%3A3,b%3A2,c%3A1%7D%3B%0A%0Aconst%20obj_1_stringified%20%3D%20JSON.stringify%28obj_1%29%3B%0Aconst%20obj_2_stringified%20%3D%20JSON.stringify%28obj_2%29%3B%0A%0Aconsole.assert%28obj_1%20%3D%3D%3D%20obj_2%29%3B%0Aconsole.assert%28obj_1_stringified%20%3D%3D%3D%20obj_2_stringified%29%3B&cumulative=false&curInstr=5&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +```js +{ + const arr_1 = [3,2,1]; + const arr_2 = [3,2,1]; + + const arr_1_stringified = JSON.stringify(arr_1); + const arr_2_stringified = JSON.stringify(arr_2); + + console.assert(arr_1 === arr_2); + console.assert(arr_1_stringified === arr_2_stringified); + + + const obj_1 = {a:3,b:2,c:1}; + const obj_2 = {a:3,b:2,c:1}; + + const obj_1_stringified = JSON.stringify(obj_1); + const obj_2_stringified = JSON.stringify(obj_2); + + console.assert(obj_1 === obj_2); + console.assert(obj_1_stringified === obj_2_stringified); +} +``` + +[TOP](#reference-type-arguments) + +--- + +## Avoid Side Effects + +### by starting a new one + +preferred method, the logic is usually much simpler to follow. +[on pytut](http://www.pythontutor.com/live.html#code=//%20make%20a%20new%20empty%20array%0A//%20fill%20it%20with%20the%20new,%20correct,%20values%0Afunction%20reverse_a_new_one%28arr%29%20%7B%0A%20%20var%20new_arr%20%3D%20%5B%5D%3B%0A%20%20for%20%28let%20i%20%3D%20arr.length%20-%201%3B%20i%20%3E%3D%200%3B%20i--%29%20%7B%0A%20%20%20%20new_arr.push%28arr%5Bi%5D%29%3B%0A%20%20%7D%0A%20%20return%20new_arr%3B%0A%7D%0A%0Aconst%20backwards%20%3D%20%5B3,%202,%201%5D%3B%0Aconst%20reversed%20%3D%20reverse_a_new_one%28backwards%29%3B%0A%0Aconst%20reversed_strified%20%3D%20JSON.stringify%28reversed%29%3B%0Aconsole.assert%28reversed_strified%20%3D%3D%3D%20'%5B1,2,3%5D'%29%3B&cumulative=false&curInstr=0&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +```js +{ + // make a new empty array + // fill it with the new, correct, values + function reverse_a_new_one(arr) { + var new_arr = []; + for (let i = arr.length - 1; i >= 0; i--) { + new_arr.push(arr[i]); + } + return new_arr; + } + + const backwards = [3, 2, 1]; + const reversed = reverse_a_new_one(backwards); + + const reversed_strified = JSON.stringify(reversed); + console.assert(reversed_strified === '[1,2,3]'); +} +``` + +### by making a copy + +not the best choice, it can be much more difficult to think about and debug. +[on pytut](http://www.pythontutor.com/live.html#code=//%20make%20a%20copy%20of%20the%20argument%0A//%20modify%20it%20direclty%0Afunction%20reverse_a_new_one%28arr%29%20%7B%0A%20%20var%20arr_strified%20%3D%20JSON.stringify%28arr%29%3B%0A%20%20var%20copy%20%3D%20JSON.parse%28arr_strified%29%3B%0A%20%20var%20last_index%20%3D%20copy.length%20-%201%0A%20%20for%20%28let%20i%20%3D%20last_index%3B%20i%20%3E%3D%20last_index%20/%202%3B%20i--%29%20%7B%0A%20%20%20%20const%20temp%20%3D%20copy%5Bi%5D%3B%0A%20%20%20%20copy%5Bi%5D%20%3D%20copy%5Blast_index%20-%20i%5D%3B%0A%20%20%20%20copy%5Blast_index%20-%20i%5D%20%3D%20temp%3B%0A%20%20%7D%0A%20%20return%20copy%3B%0A%7D%0A%0Aconst%20backwards%20%3D%20%5B5,%204,%203,%202,%201%5D%3B%0Aconst%20reversed%20%3D%20reverse_a_new_one%28backwards%29%3B%0A%0Aconst%20reversed_strified%20%3D%20JSON.stringify%28reversed%29%3B%0Aconsole.assert%28reversed_strified%20%3D%3D%3D%20'%5B1,2,3,4,5%5D'%29%3B&cumulative=false&curInstr=0&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +```js +{ + // make a copy of the argument + // modify it direclty + function reverse_a_new_one(arr) { + var arr_strified = JSON.stringify(arr); + var copy = JSON.parse(arr_strified); + var last_index = copy.length - 1 + for (let i = last_index; i >= last_index / 2; i--) { + const temp = copy[i]; + copy[i] = copy[last_index - i]; + copy[last_index - i] = temp; + } + return copy; + } + + const backwards = [5, 4, 3, 2, 1]; + const reversed = reverse_a_new_one(backwards); + + const reversed_strified = JSON.stringify(reversed); + console.assert(reversed_strified === '[1,2,3,4,5]'); +} +``` + +[TOP](#reference-type-arguments) + +--- + +## Exercises + +### copy an array + +[on pytut](http://www.pythontutor.com/live.html#code=function%20copy_array%28arr%29%20%7B%0A%20%20//%20write%20this%20using%20JSON.stringify%20%26%20.parse%0A%7D%0A%0Aconst%20array%20%3D%20%5B'a',%20'b'%5D%3B%0Aconst%20by_copy%20%3D%20copy_array%28array%29%3B%0A%0Aconsole.assert%28array%5B0%5D%20%3D%3D%3D%20by_copy%5B0%5D%29%3B%0Aconsole.assert%28array%5B1%5D%20%3D%3D%3D%20by_copy%5B1%5D%29%3B%0Aconsole.assert%28array%20!%3D%3D%20by_copy%29%3B&cumulative=false&curInstr=4&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +```js +{ + function copy_array(arr) { + // write this using JSON.stringify & .parse + } + + const array = ['a', 'b']; + const by_copy = copy_array(array); + + console.assert(array[0] === by_copy[0]); + console.assert(array[1] === by_copy[1]); + console.assert(array !== by_copy); +} +``` + + +### start a new array + +[on pytut](http://www.pythontutor.com/live.html#code=function%20start_new_array%28arr%29%20%7B%0A%20%20//%20write%20this%20by%20building%20a%20new%20array%20from%20scratch%0A%7D%0A%0Aconst%20array%20%3D%20%5B'a',%20'b'%5D%3B%0Aconst%20by_new_start%20%3D%20start_new_array%28array%29%3B%0A%0Aconsole.assert%28array%5B0%5D%20%3D%3D%3D%20by_new_start%5B0%5D%29%3B%0Aconsole.assert%28array%5B1%5D%20%3D%3D%3D%20by_new_start%5B1%5D%29%3B%0Aconsole.assert%28array%20!%3D%3D%20by_new_start%29%3B&cumulative=false&curInstr=4&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +```js +{ + function start_new_array(arr) { + // write this by building a new array from scratch + // the paramenter should only be used on the right side of = + // the new one should only be used on the left side of = + } + + const array = ['a', 'b']; + const by_new_start = start_new_array(array); + + console.assert(array[0] === by_new_start[0]); + console.assert(array[1] === by_new_start[1]); + console.assert(array !== by_new_start); +} +``` + +### copy an object + +[on pytut](http://www.pythontutor.com/live.html#code=function%20copy_object%28obj%29%20%7B%0A%20%20//%20write%20this%20using%20JSON.stringify%20%26%20.parse%0A%7D%0A%0Aconst%20object%20%3D%20%7Ba%3A%201,%20b%3A%202%7D%3B%0Aconst%20by_copy%20%3D%20copy_object%28object%29%3B%0A%0Aconsole.assert%28object.a%20%3D%3D%3D%20by_copy.a%29%3B%0Aconsole.assert%28object%5B'b'%5D%20%3D%3D%3D%20by_copy%5B'b'%5D%29%3B%0Aconsole.assert%28object%20!%3D%3D%20by_copy%29%3B&cumulative=false&curInstr=4&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +```js +{ + function copy_object(obj) { + // write this using JSON.stringify & .parse + } + + const object = {a: 1, b: 2}; + const by_copy = copy_object(object); + + console.assert(object.a === by_copy.a); + console.assert(object['b'] === by_copy['b']); + console.assert(object !== by_copy); +} +``` + + +### start a new object + +[on pytut](http://www.pythontutor.com/live.html#code=function%20start_new_object%28obj%29%20%7B%0A%20%20//%20write%20this%20by%20building%20a%20new%20object%20from%20scratch%0A%7D%0A%0Aconst%20object%20%3D%20%7Ba%3A%201,%20b%3A%202%7D%3B%0Aconst%20by_new_start%20%3D%20start_new_object%28object%29%3B%0A%0Aconsole.assert%28object.a%20%3D%3D%3D%20by_new_start.a%29%3B%0Aconsole.assert%28object%5B'b'%5D%20%3D%3D%3D%20by_new_start%5B'b'%5D%29%3B%0Aconsole.assert%28object%20!%3D%3D%20by_new_start%29%3B&cumulative=false&curInstr=4&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +```js +{ + function start_new_object(obj) { + // write this by building a new object from scratch + // the paramenter should only be used on the right side of = + // the new one should only be used on the left side of = + } + + const object = {a: 1, b: 2}; + const by_new_start = start_new_object(object); + + console.assert(object.a === by_new_start.a); + console.assert(object['b'] === by_new_start['b']); + console.assert(object !== by_new_start); +} +``` + + + +[TOP](#reference-type-arguments) + +___ +___ +### Janke Learning From 5d59903a44e6d69648725fc3a5e0cdf21a871cae Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Wed, 26 Jun 2019 16:00:59 +0200 Subject: [PATCH 36/54] Update fcc-basic-js-pt-2.md --- week-2/fcc-basic-js-pt-2.md | 590 ++++++++++++++++++++++++++++++++++++ 1 file changed, 590 insertions(+) diff --git a/week-2/fcc-basic-js-pt-2.md b/week-2/fcc-basic-js-pt-2.md index bdcd012..654843f 100644 --- a/week-2/fcc-basic-js-pt-2.md +++ b/week-2/fcc-basic-js-pt-2.md @@ -1,3 +1,593 @@ > complete the rest of [basic JS exercises](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript) on FCC and paste each of your solutions into this file. This will allow you to use your FCC exercises as a study reference later on > [completed example](https://github.com/AlfiYusrina/hyf-javascript1/blob/master/week1/freecode_camp_solutions.MD) + +## 1. Comment Your Code + +```js +// This is Ramzi, in-line comment :) +/* This is Ramzi, +multi-line comment */ +``` + +## 2. Declare Variables +```js +var myName; +``` + +## 3.Storing Values with the Assignment Operator +```js +a = 7; +b = a; +a = b; +``` + +## 4. Initializing Variables with the Assignment Operator +```js +var a = 9; +``` + +## 5. Understanding Uninitialized Variables +```js +var a = 5; +var b = 10; +var c = "I am a"; +``` +## 6. Understanding Case Sensitivity in Variables +```js +// Declarations +var studlyCapVar; +var properCamelCase; +var titleCaseOver; + +// Assignments +studlyCapVar = 10; +properCamelCase = "A String"; +titleCaseOver = 9000; +``` + +## 7.Add Two Numbers (+) +```js +var sum = 10 + 0; +sum = 10 + 10; +``` +## 8. Subtract One Number from Another +```js +var difference = 45 - 33; +``` +## 9. Multiply Two Numbers +```js +var product = 8 * 10; +``` +## 10. Divide One Number by Another (/) +```js +var quotient = 66 / 33; +``` +## 11 .Increment a Number (i++) + +```js +var myVar = 87; +myVar++; +``` + +## 12. Decrement a Number (i--) +```js +myVar--; +``` + + +## 13. Create Decimal Numbers +```js +var myDecimal = 5.8; +``` + +## 14. Multiply Two Decimals +```js +var product = 2.0 * 2.5; +``` + +## 15. Divide One Decimal by Another +```js +var quotient = 4.4 / 2.0; +``` +## 16. Finding a Remainder +```js +var remainder; +remainder = 11 % 3; +``` +## 17. Compound Assignment With Augmented Addition (+=) +```js +a += 12; +b += 9; +c += 7; +``` +## 18. Compound Assignment With Augmented Subtraction (-=) + +```js +a -= 6; +b -= 15; +c -= 1; +``` +## 19. Compound Assignment With Augmented Multiplication +```js +a *= 5; +b *= 3; +c *= 10; +``` +## 20. Compound Assignment With Augmented Division +```js +a /= 12; +b /= 4; +c /= 11; +``` + +## 21. Declare String Variables +with ``` " " ``` +```js +var myFirstName = "Alfi"; +var myLastName = "Yusrina"; +``` + +## 22. Escaping Literal Quotes in Strings +Using *backlash* ```\``` in the beginning and in the end of your quotes. +```js +var myStr = "I am a \"double quoted\" string inside \"double quotes\"."; +``` +## 23. Quoting Strings with Single Quotes +String values in JS may be written with single or double quotes. +```js +var myStr = 'Link'; +``` + +## 24. Escape Sequences in Strings +Reasons to use escaping characters: +- is to allow you to use characters you might not otherwise be able to type out, such as a backspace. +- is to allow you to represent multiple quotes in a string without JS misinterpreting what you mean. + +```js +var myStr = 'FirstLine\n\t\\SecondLine\nThirdLine'; +``` + +## 25. Concatenating Strings with Plus Operator +```js +var myStr = "This is the start. " + "This is the end."; +``` +## 26. Concatenating Strings with the Plus Equals Operator +```js +var myStr = "This is the first sentence. "; +myStr += "This is the second sentence."; +``` +## 27. Constructing Strings with Variables +```js +var myStr = "My name is " + myName + " and I am well!"; +``` +## 28. Appending Variables to Strings +```js +var someAdjective = "boring"; +var myStr = "Learning to code is "; +myStr += someAdjective; +``` +## 29. Find the Length of a String +```js +lastNameLength = lastName.length; +``` +## 30. Use Bracket Notation to Find the First Character in a String +```js +firstLetterOfLastName = lastName[0]; +``` +## 31. Understand String Immutability +String values are *immutable*, means that they cannot be altered once created. +```js +myStr = "Hello World"; +``` +## 32. Use Bracket Notation to Find the Nth Character in a String +```js +var thirdLetterOfLastName = lastName[2]; +``` +## 33. Use Bracket Notation to Find the Last Character in a String +Use ```.length-1``` +```js +var lastLetterOfLastName = lastName[lastName.length-1]; +``` +## 34. Use Bracket Notation to Find the Nth-to-Last Character in a String +```js +var secondToLastLetterOfLastName = lastName[lastName.length - 2]; +``` +## 35. Word Blanks +```js +function wordBlanks(myNoun, myAdjective, myVerb, myAdverb) { + var result = "The " + myAdjective + " " + myNoun + " " + myVerb + " " + myAdverb + "."; + return result; +} +wordBlanks("cat", "little", "hit", "slowly"); +``` +## 36. Store Multiple Values in one Variable using JavaScript Arrays +Array variables for storing several pieces of data in one place. +```js +var myArray = ["Alfi", 28]; +``` +## 37. Nest one Array within Another Array +```js +var myArray = [["Bulls", 23], ["White Sox", 45]]; +``` +## 39. Modify Array Data With Indexes +```js +myArray[0] = 45; +``` +## 40. Access Multi-Dimensional Arrays With Indexes +```js +var myData = myArray[2][1]; +``` +## 41. Manipulate Arrays With push() +Adding an extra to the last array. +```js +myArray.push(["dog", 3]); +``` +## 42. Manipulate Arrays With pop() +You can pop off the last array, and store it in a variable. +```js +var removedFromMyArray = myArray.pop(); +``` +## 43. Manipulate Arrays With shift() +removing the first in the array +```js +var removedFromMyArray = myArray.shift(); +``` +## 44. Manipulate Arrays With unshift() +Adding an extra to the first in the array. +```js +var myArray = [["John", 23], ["dog", 3]]; +myArray.shift(); + +myArray.unshift(["Paul",35]); +``` +## 45. Shopping List +```js +var myList = [["rice", 5] , ["bread", 6] , ["cake", 7], [ "quinoa", 9], ["potato", 20]]; +``` +## 46. Write Reusable JavaScript with Functions +```js +function reusableFunction() { + console.log("Hi World"); +} + +reusableFunction(); +``` +## 47. Passing Values to Functions with Arguments +```js +function functionWithArgs (a , b) { +console.log(a + b); +} +functionWithArgs (1 , 2); +functionWithArgs (7 , 9); +``` +## 48. Global Scope and Functions +Scope refers to the visibility of variables. +Variables which are defined **outside of a function block** have **Global scope**. +Variables which are used **without the ```var```** keyword are automatically created in the ```global``` scope. This can create unintended consequences elsewhere in your code or when running a function again. You should always declare your variables with ```var```. +```js +var myGlobal = 10; +function fun1() { + oopsGlobal = 5; +} +``` +## 49. Local Scope and Functions +```js +function myLocalScope() { +var myVar = 'use strict'; +} +myLocalScope(); +``` +## 50. Global vs. Local Scope in Functions +```js +var outerWear = "T-Shirt"; +function myOutfit() { + var outerWear = "sweater"; + return outerWear; +} +myOutfit(); +``` +## 51. Return a Value from a Function with Return +Use a ```return``` statement to send a value back out of a function. +```js +function timesFive (num) { + return num * 5; +} +timesFive(5); +timesFive(2); +timesFive(0); +``` +## 52. Understanding Undefined Value returned from a Function +```js +function addFive() { + sum = sum + 5; +} +``` +## 53. Assignment with a Returned Value +```js +var processed = 0; +function processArg(num) { + return (num + 3) / 5; +} +processed = processArg(7); +``` +## 54. Stand in Line + A **queue** is an abstract Data Structure where items are kept in order. + New items can be added (```push```) at the back of the queue and old items are taken off (```shift```) from the front of the queue. + +Add the number to the end of the array = ```push``` +Remove the first element of the array = ```shift``` +Then return the element that was removed = using ```return```. +```js +function nextInLine(arr, item) { + arr.push(item); + return arr.shift(); +} +``` +## 55. Understanding Boolean Values +```js +function welcomeToBooleans() { +return true; +} +``` +## 56. Use Conditional Logic with If Statements +```js +function trueOrFalse(wasThatTrue) { + if (wasThatTrue) { + return "Yes, that was true"; + } + return "No, that was false"; +} +trueOrFalse(true); +``` +## 57. Comparison with the Equality Operator +```js +function testEqual(val) { + if (val == 12) { + return "Equal"; + } + return "Not Equal"; +} +testEqual(12); +``` +## 58. Comparison with the Strict Equality Operator +However, unlike the equality operator, which attempts to convert both values being compared to a common type, the strict equality operator does not perform a type conversion. + +If the values being compared have different types, they are considered unequal, and the strict equality operator will return false. +```js +function testStrict(val) { + if (val === 7) { + return "Equal"; + } + return "Not Equal"; +} +testStrict(10); +``` +## 59. Practice comparing different values +```js +function compareEquality(a, b) { + if (a === b) { + return "Equal"; + } + return "Not Equal"; +} +compareEquality(10, "10"); +``` +## 60. Comparison with the Inequality Operator +```js +function testNotEqual(val) { + if (val != 99) { + return "Not Equal"; + } + return "Equal"; +} +testNotEqual(10); +``` +## 61. Comparison with the Strict Inequality Operator +```js +function testStrictNotEqual(val) { + if (val !== 17) { + return "Not Equal"; + } + return "Equal"; +} + +testStrictNotEqual(10); +``` +## 62. Comparison with the Greater Than Operator +```js +function testGreaterThan(val) { + if (val > 100) { + return "Over 100"; + } + + if (val > 10) { + return "Over 10"; + } + + return "10 or Under"; +} + +testGreaterThan(10); +``` +## 63. Comparison with the Greater Than Or Equal To Operator +```js +function testGreaterOrEqual(val) { + if (val >= 20) { + return "20 or Over"; + } + + if (val >= 10) { + return "10 or Over"; + } + + return "Less than 10"; +} + + +testGreaterOrEqual(10); +``` +## 64. Comparison with the Less Than Operator +```js +function testLessThan(val) { + if (val < 25) { + return "Under 25"; + } + + if (val < 55) { + return "Under 55"; + } + + return "55 or Over"; +} + +testLessThan(10); +``` +## 65. Comparison with the Less Than Or Equal To Operator +```js +function testLessOrEqual(val) { + if (val <= 12) { + return "Smaller Than or Equal to 12"; + } + + if (val <=24) { + return "Smaller Than or Equal to 24"; + } + + return "More Than 24"; +} + +testLessOrEqual(10); + +``` +## 66. Comparison with the Logical And Operator +```js +function testLogicalAnd(val) { + + if (val >= 25 && val <= 50) { + return "Yes"; + } + + return "No"; +} + + +testLogicalAnd(10); +``` +## 67. Comparison with the Logical Or Operator +```js +function testLogicalOr(val) { + + + if (val < 10 || val > 20 ) { + + return "Outside"; + } + + return "Inside"; +} + + +testLogicalOr(15); +``` +## 68. Introducing Else Statements + +```js +function testElse(val) { + var result = ""; + + if (val > 5) { + result = "Bigger than 5"; + } + + else { + result = "5 or Smaller"; + } + + + return result; +} + + +testElse(4); + +``` +## 69. Introducing Else If Statements +```js +function testElseIf(val) { + if (val > 10) { + return "Greater than 10"; + } + + else if (val < 5) { + return "Smaller than 5"; + } + else { + return "Between 5 and 10"; + } + +} + +testElseIf(7); + +``` +## 70. Logical Order in If Else Statements +```js +function orderMyLogic(val) { + if (val < 5) { + return "Less than 5"; + } else if (val < 10) { + return "Less than 10"; + } else { + return "Greater than or equal to 10"; + } +} + +orderMyLogic(7); +``` +## 71. Chaining If Else Statements +```js +function testSize(num) { + if(num < 5) { + return "Tiny"; + } else if (num < 10) { + return "Small"; + } else if (num < 15) { +return "Medium"; + } else if (num < 20) { +return "Large"; + } else if ( num >= 20 ) { + return "Huge"; + } else { + return "Change Me"; } + +} + +testSize(7); +``` +## 72. Golf Code +```js +var names = ["Hole-in-one!", "Eagle", "Birdie", "Par", "Bogey", "Double Bogey", "Go Home!"]; +function golfScore(par, strokes) { + if (strokes == 1) { +return "Hole-in-one!"; + } else if (strokes <= par - 2) { + return "Eagle" ; + } else if (strokes == par - 1) { + return "Birdie" ; + } else if (strokes == par) { + return "Par" ; + } else if (strokes == par + 1) { + return "Bogey" ; + } else if (strokes == par + 2) { + return "Double Bogey" ; + } else if (strokes >= par + 3) { + return "Go Home!" ; + } else { + return "Change Me"; + } +} + +golfScore(5, 4); +``` + From 1d265003f819fe59ff8118444eba9441572c37d1 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Thu, 27 Jun 2019 22:02:34 +0200 Subject: [PATCH 37/54] Update fcc-data-structures.md --- week-2/fcc-data-structures.md | 44 +++++++++++++++++++++++++++++++++++ 1 file changed, 44 insertions(+) diff --git a/week-2/fcc-data-structures.md b/week-2/fcc-data-structures.md index 72b66f8..322b44e 100644 --- a/week-2/fcc-data-structures.md +++ b/week-2/fcc-data-structures.md @@ -1,3 +1,47 @@ > begin [the basic data structure exercises](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-data-structures) and paste each of your solutions into this file. This will allow you to use your FCC exercises as a study reference later on +## 1. Basic Data Structures: Use an Array to Store a Collection of Data +```js +let yourArray = ['string', 5, true, false, 8] +``` + +## 2. Basic Data Structures: Access an Array's Contents Using Bracket Notation + +```js +let myArray = ["a", "b", "c", "d"]; +// change code below this line +myArray[1] = "b edited" +//change code above this line +console.log(myArray); +``` + +## 3. Basic Data Structures: Add Items to an Array with push() and unshift() + +```js +function mixedNumbers(arr) { + // change code below this line +arr.unshift('I', 2, 'three'); +arr.push(7, 'VIII', 9); + // change code above this line + return arr; +} + +// do not change code below this line +console.log(mixedNumbers(['IV', 5, 'six'])); +``` + +## 4. Basic Data Structures: Add Items to an Array with push() and unshift() + +```js +function mixedNumbers(arr) { + // change code below this line +arr.unshift('I', 2, 'three'); +arr.push(7, 'VIII', 9); + // change code above this line + return arr; +} + +// do not change code below this line +console.log(mixedNumbers(['IV', 5, 'six'])); +``` From 510d2c8426b4f2e00dc375007f4f7d1e18f6f39a Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sat, 29 Jun 2019 18:20:29 +0200 Subject: [PATCH 38/54] Update jl-functions-ref-type-args.md --- week-2/jl-functions-ref-type-args.md | 54 ++++++++++++++++------------ 1 file changed, 32 insertions(+), 22 deletions(-) diff --git a/week-2/jl-functions-ref-type-args.md b/week-2/jl-functions-ref-type-args.md index 62689b1..1e9a656 100644 --- a/week-2/jl-functions-ref-type-args.md +++ b/week-2/jl-functions-ref-type-args.md @@ -179,18 +179,19 @@ not the best choice, it can be much more difficult to think about and debug. [on pytut](http://www.pythontutor.com/live.html#code=function%20copy_array%28arr%29%20%7B%0A%20%20//%20write%20this%20using%20JSON.stringify%20%26%20.parse%0A%7D%0A%0Aconst%20array%20%3D%20%5B'a',%20'b'%5D%3B%0Aconst%20by_copy%20%3D%20copy_array%28array%29%3B%0A%0Aconsole.assert%28array%5B0%5D%20%3D%3D%3D%20by_copy%5B0%5D%29%3B%0Aconsole.assert%28array%5B1%5D%20%3D%3D%3D%20by_copy%5B1%5D%29%3B%0Aconsole.assert%28array%20!%3D%3D%20by_copy%29%3B&cumulative=false&curInstr=4&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) ```js -{ - function copy_array(arr) { - // write this using JSON.stringify & .parse +function copy_array(arr) { + var arr_strified = JSON.stringify(arr); + var copy = JSON.parse(arr_strified); + return copy; + } - const array = ['a', 'b']; - const by_copy = copy_array(array); +const array = ['a', 'b']; +const by_copy = copy_array(array); - console.assert(array[0] === by_copy[0]); - console.assert(array[1] === by_copy[1]); - console.assert(array !== by_copy); -} +console.assert(array[0] === by_copy[0]); +console.assert(array[1] === by_copy[1]); +console.assert(array !== by_copy); ``` @@ -198,29 +199,36 @@ not the best choice, it can be much more difficult to think about and debug. [on pytut](http://www.pythontutor.com/live.html#code=function%20start_new_array%28arr%29%20%7B%0A%20%20//%20write%20this%20by%20building%20a%20new%20array%20from%20scratch%0A%7D%0A%0Aconst%20array%20%3D%20%5B'a',%20'b'%5D%3B%0Aconst%20by_new_start%20%3D%20start_new_array%28array%29%3B%0A%0Aconsole.assert%28array%5B0%5D%20%3D%3D%3D%20by_new_start%5B0%5D%29%3B%0Aconsole.assert%28array%5B1%5D%20%3D%3D%3D%20by_new_start%5B1%5D%29%3B%0Aconsole.assert%28array%20!%3D%3D%20by_new_start%29%3B&cumulative=false&curInstr=4&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) ```js -{ function start_new_array(arr) { - // write this by building a new array from scratch - // the paramenter should only be used on the right side of = - // the new one should only be used on the left side of = + var new_arr = []; + for (let i = arr.length-1; i >= 0; i--) { + new_arr.unshift(arr[i]); + + + + } + + return new_arr; + } const array = ['a', 'b']; const by_new_start = start_new_array(array); + console.assert(array[0] === by_new_start[0]); console.assert(array[1] === by_new_start[1]); console.assert(array !== by_new_start); -} ``` ### copy an object [on pytut](http://www.pythontutor.com/live.html#code=function%20copy_object%28obj%29%20%7B%0A%20%20//%20write%20this%20using%20JSON.stringify%20%26%20.parse%0A%7D%0A%0Aconst%20object%20%3D%20%7Ba%3A%201,%20b%3A%202%7D%3B%0Aconst%20by_copy%20%3D%20copy_object%28object%29%3B%0A%0Aconsole.assert%28object.a%20%3D%3D%3D%20by_copy.a%29%3B%0Aconsole.assert%28object%5B'b'%5D%20%3D%3D%3D%20by_copy%5B'b'%5D%29%3B%0Aconsole.assert%28object%20!%3D%3D%20by_copy%29%3B&cumulative=false&curInstr=4&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) ```js -{ function copy_object(obj) { - // write this using JSON.stringify & .parse + var obj_strified = JSON.stringify(obj); + var copy = JSON.parse(obj_strified); + return copy; } const object = {a: 1, b: 2}; @@ -229,7 +237,7 @@ not the best choice, it can be much more difficult to think about and debug. console.assert(object.a === by_copy.a); console.assert(object['b'] === by_copy['b']); console.assert(object !== by_copy); -} + ``` @@ -237,11 +245,13 @@ not the best choice, it can be much more difficult to think about and debug. [on pytut](http://www.pythontutor.com/live.html#code=function%20start_new_object%28obj%29%20%7B%0A%20%20//%20write%20this%20by%20building%20a%20new%20object%20from%20scratch%0A%7D%0A%0Aconst%20object%20%3D%20%7Ba%3A%201,%20b%3A%202%7D%3B%0Aconst%20by_new_start%20%3D%20start_new_object%28object%29%3B%0A%0Aconsole.assert%28object.a%20%3D%3D%3D%20by_new_start.a%29%3B%0Aconsole.assert%28object%5B'b'%5D%20%3D%3D%3D%20by_new_start%5B'b'%5D%29%3B%0Aconsole.assert%28object%20!%3D%3D%20by_new_start%29%3B&cumulative=false&curInstr=4&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) ```js -{ + function start_new_object(obj) { - // write this by building a new object from scratch - // the paramenter should only be used on the right side of = - // the new one should only be used on the left side of = + var new_obj = {}; + for (let i = Object.keys(obj).length - 1; i>=0; i--){ + new_obj = Object.assign(i); + } + return new_obj; } const object = {a: 1, b: 2}; @@ -250,7 +260,7 @@ not the best choice, it can be much more difficult to think about and debug. console.assert(object.a === by_new_start.a); console.assert(object['b'] === by_new_start['b']); console.assert(object !== by_new_start); -} + ``` From 2ff62867e802fe3a9392c1a9d2a1c755979df637 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sat, 29 Jun 2019 21:26:34 +0200 Subject: [PATCH 39/54] Update jl-reference-types.md --- week-2/jl-reference-types.md | 478 +++++++++++++++++++++++++++++++++++ 1 file changed, 478 insertions(+) diff --git a/week-2/jl-reference-types.md b/week-2/jl-reference-types.md index 328ffa9..f7ddc8b 100644 --- a/week-2/jl-reference-types.md +++ b/week-2/jl-reference-types.md @@ -1 +1,479 @@ > paste [this markdown of exercises](https://raw.githubusercontent.com/janke-learning/reference-type-exercises/master/README.md) into this file and complete the exercises! + +# Reference Type Exercises + +A series of examples and exercises to help you understand: +* reference vs. value (two ways variables can store values) +* arrays +* objects +* comparing arrays & objects +* nesting data structures + +### Index +* [examples to study](#examples-to-study) +* [reference exercises](#reference-exercises) +* [array exercises](#array-exercises) +* [object exercises](#object-exercises) +* [arrays vs objects](#arrays-vs-objects) +* nesting + * [arrays](#nesting-arrays) + * [objects](#nesting-objects) + * [both](#nesting-arrays-and-objects) + +--- + +## Examples to Study + +__Swapping with Arrays__ +[on pytut](http://www.pythontutor.com/javascript.html#code=let%20a%20%3D%20%5B%22b%22%5D%3B%0Alet%20b%20%3D%20%5B%22a%22%5D%3B%0Alet%20_%20%3D%20null%3B%0A%0A//%20swap%20the%20arrays%20to%20which%20each%20variable%20points%0A_%20%3D%20a%3B%0Aa%20%3D%20b%3B%0Ab%20%3D%20_%3B%0A%0A//%20------%0A%0A_%20%3D%20null%3B%0Alet%20x%20%3D%20%5B%22y%22%5D%3B%0Alet%20y%20%3D%20%5B%22x%22%5D%3B%0A%0A//%20swap%20the%20value%20each%20array%20contains%0A_%20%3D%20x%5B0%5D%3B%0Ax%5B0%5D%20%3D%20y%5B0%5D%3B%0Ay%5B0%5D%20%3D%20_%3B&curInstr=0&mode=display&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) +```js +{ + let a = ["b"]; + let b = ["a"]; + let _ = null; + + // swap the arrays to which each variable points + _ = a; + a = b; + b = _; + + // ------ + + _ = null; + let x = ["y"]; + let y = ["x"]; + + // swap the value each array contains + _ = x[0]; + x[0] = y[0]; + y[0] = _; +} +``` + +__Comparing Reference Types__ +[on pytut](http://www.pythontutor.com/live.html#code=let%20a%20%3D%20%5B%5D%3B%0Alet%20b%20%3D%20%5B%5D%3B%0Aconsole.assert%28a%20!%3D%3D%20b%29%3B%0Aconsole.assert%28a%20%3D%3D%3D%20b%29%3B%0A%0Ab%20%3D%20a%3B%0Aconsole.assert%28a%20%3D%3D%3D%20b%29%3B%0Aconsole.assert%28a%20!%3D%3D%20b%29%3B&cumulative=false&curInstr=0&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +```js +{ + let a = []; + let b = []; + console.assert(a !== b); + console.assert(a === b); + + b = a; + console.assert(a === b); + console.assert(a !== b); +} +``` + + +__Swapping with Objects__ (dot notation) +[on pytut](http://www.pythontutor.com/live.html#code=let%20a%20%3D%20%7By_prop%3A%20%22y%22%7D%3B%0Alet%20b%20%3D%20%7Bx_prop%3A%20%22x%22%7D%3B%0Alet%20_%20%3D%20null%3B%0A%0A//%20swap%20the%20object%20in%20which%20each%20value%20is%20stored%0A_%20%3D%20a%3B%0Aa%20%3D%20b%3B%0Ab%20%3D%20_%3B%0A%0A//%20------%0A%0A_%20%3D%20null%3B%0Alet%20x%20%3D%20%7Ba_prop%3A%20%22b%22%7D%3B%0Alet%20y%20%3D%20%7Bb_prop%3A%20%22a%22%7D%3B%0A%0A//%20swap%20the%20value%20each%20object%20contains%0A_%20%3D%20x.a_prop%3B%0Ax.a_prop%20%3D%20y.b_prop%3B%0Ay.b_prop%20%3D%20_%3B&cumulative=false&curInstr=12&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +```js +{ + let a = {y_prop: "y"}; + let b = {x_prop: "x"}; + let _ = null; + + // swap the object in which each value is stored + _ = a; + a = b; + b = _; + + // ------ + + _ = null; + let x = {a_prop: "b"}; + let y = {b_prop: "a"}; + + // swap the value each object contains + _ = x.a_prop; + x.a_prop = y.b_prop; + y.b_prop = _; +} +``` + +__Swapping with Objects__ (bracket notation) +[(read this first)](https://github.com/janke-learning/dots-vs-brackets) +[on pytut](http://www.pythontutor.com/live.html#code=let%20a%20%3D%20%7Bx_prop%3A%20%22y%22%7D%3B%0Alet%20b%20%3D%20%7By_prop%3A%20%22x%22%7D%3B%0Alet%20_%20%3D%20null%3B%0A%0A//%20swap%20the%20object%20in%20which%20each%20value%20is%20stored%0A//%20%20with%20dots%0A_%20%3D%20a.x_prop%3B%0Aa.x_prop%20%3D%20b.y_prop%3B%0Ab.y_prop%20%3D%20_%3B%0A%0A//%20------%0A%0A_%20%3D%20null%3B%0Alet%20x%20%3D%20%7Ba_prop%3A%20%22b%22%7D%3B%0Alet%20y%20%3D%20%7Bb_prop%3A%20%22a%22%7D%3B%0A%0A//%20swap%20the%20object%20in%20which%20each%20value%20is%20stored%0A//%20%20with%20brackets%0Aconst%20a_key%20%3D%20%22a_prop%22%3B%0Aconst%20b_key%20%3D%20%22b_prop%22%3B%0A_%20%3D%20x%5Ba_key%5D%3B%0Ax%5Ba_key%5D%20%3D%20y%5Bb_key%5D%3B%0Ay%5Bb_key%5D%20%3D%20_%3B&cumulative=false&curInstr=14&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +```js +{ + let a = {x_prop: "y"}; + let b = {y_prop: "x"}; + let _ = null; + + // swap the object in which each value is stored + // with dots + _ = a.x_prop; + a.x_prop = b.y_prop; + b.y_prop = _; + + // ------ + + _ = null; + let x = {a_prop: "b"}; + let y = {b_prop: "a"}; + + // swap the object in which each value is stored + // with brackets + const a_key = "a_prop"; + const b_key = "b_prop"; + _ = x[a_key]; + x[a_key] = y[b_key]; + y[b_key] = _; +} +``` + +[TOP](#reference-type-exercises) + +--- + +## Reference Exercises + +__Swap the Object & the Array__ +[on pytut](http://www.pythontutor.com/javascript.html#code=let%20obj%20%3D%20%5B%5D%3B%0Alet%20arr%20%3D%20%7B%7D%3B%0Alet%20_%20%3D%20null%3B%0A%0A//%20swap%20the%20object%20and%20the%20array&mode=edit&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) +```js +{ + let obj = []; + let arr = {}; + let _ = null; + + // --- swap below here --- + +} +``` + +__Complete this code__ +[(read this first)](https://github.com/janke-learning/reference-vs-value) +[on pytut](http://www.pythontutor.com/javascript.html#code=%20%20let%20value_1%20%3D%205%3B%0A%20%20let%20reference_1%20%3D%20%5B%5D%3B%0A%0A%20%20let%20value_2%20%3D%20value_1%3B%0A%20%20console.assert%28value_2%20/*%20%3D%3D%3D%20or%20!%3D%3D%20%3F%20*/%20value_1%29%3B%0A%0A%20%20let%20reference_2%20%3D%20reference_1%3B%0A%20%20console.assert%28reference_2%20/*%20%3D%3D%3D%20or%20!%3D%3D%20%3F%20*/%20reference_1%29%3B%0A%0A%20%20%20%20%20%20%3B%20//%20write%20this%20line%0A%20%20console.assert%28value_1%20!%3D%3D%20value_2%29%3B%20%20%0A%20%20%20%20%0A%20%20%20%20%20%20%3B%20//%20write%20this%20line%0A%20%20console.assert%28reference_1%5B0%5D%20%3D%3D%3D%20reference_2%5B0%5D%29%3B%0A%0A%20%20//%20remove%20the%20array%20from%20memory%0A%20%20%20%20%20%20%3B%20//%20write%20this%20line%0A%20%20%20%20%20%20%3B%20//%20write%20this%20line&mode=edit&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) +```js +{ + let value_1 = 5; + let reference_1 = []; + + let value_2 = value_1; + console.assert(value_2 /* === or !== ? */ value_1); + + let reference_2 = reference_1; + console.assert(reference_2 /* === or !== ? */ reference_1); + + ; // write this line + console.assert(value_1 !== value_2); + + ; // write this line + console.assert(reference_1[0] === reference_2[0]); + + // remove the array from memory + ; // write this line + ; // write this line +} +``` + +[TOP](#reference-type-exercises) + +--- + +## Array Exercises + +__Complete the Assertions__ +[on pytut](http://www.pythontutor.com/javascript.html#code=let%20a_1%20%3D%20%5B%5D%3B%0Alet%20a_2%20%3D%20a_1%3B%0Aconsole.assert%28a_1%20/*%20%3D%3D%3D%20or%20!%3D%3D%20%3F%20*/%20a_2%29%3B%0A%0Alet%20b_1%20%3D%20%5B%5D%3B%0Alet%20b_2%20%3D%20%5B%5D%3B%0Aconsole.assert%28b_1%20/*%20%3D%3D%3D%20or%20!%3D%3D%20%3F%20*/%20b_2%29%3B%0A%0A//%20---%0A%0Alet%20a_1.push%283%29%3B%0Alet%20a_2.push%283%29%3B%0Aconsole.assert%28a_1%20/*%20%3D%3D%3D%20or%20!%3D%3D%20%3F%20*/%20a_2%29%3B%0A%0Alet%20b_1.push%285%29%3B%0Alet%20b_2.push%285%29%3B%0Aconsole.assert%28b_1%20/*%20%3D%3D%3D%20or%20!%3D%3D%20%3F%20*/%20b_2%29%3B%0A%0A&mode=edit&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) +```js +{ + let a_1 = []; + let a_2 = a_1; + console.assert(a_1 /* === or !== ? */ a_2); + + let b_1 = []; + let b_2 = []; + console.assert(b_1 /* === or !== ? */ b_2); + + // --- + + let a_1.push(3); + let a_2.push(3); + console.assert(a_1 /* === or !== ? */ a_2); + + let b_1.push(5); + let b_2.push(5); + console.assert(b_1 /* === or !== ? */ b_2); +} +``` + +__Complete the Assertions__ +[on pytut](http://www.pythontutor.com/javascript.html#code=let%20a_1%20%3D%20%5B%5D%3B%0Alet%20a_2%20%3D%20a_1%3B%0Aconsole.assert%28a_1%20/*%20%3D%3D%3D%20or%20!%3D%3D%20%3F%20*/%20a_2%29%3B%0A%0Alet%20b_1%20%3D%20%5B%5D%3B%0Alet%20b_2%20%3D%20%5B%5D%3B%0Aconsole.assert%28b_1%20/*%20%3D%3D%3D%20or%20!%3D%3D%20%3F%20*/%20b_2%29%3B%0A%0A//%20---%0A%0Aconst%20key%20%3D%200%3B%0A%0Alet%20a_1%5Bkey%5D%20%3D%203%3B%0Alet%20a_2%5Bkey%5D%20%3D%203%3B%0Aconsole.assert%28a_1%20/*%20%3D%3D%3D%20or%20!%3D%3D%20%3F%20*/%20a_2%29%3B%0A%0Alet%20b_1%5Bkey%5D%20%3D%205%3B%0Alet%20b_2%5Bkey%5D%20%3D%205%3B%0Aconsole.assert%28b_1%20/*%20%3D%3D%3D%20or%20!%3D%3D%20%3F%20*/%20b_2%29%3B%0A&mode=edit&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) +```js +{ + let a_1 = []; + let a_2 = a_1; + console.assert(a_1 /* === or !== ? */ a_2); + + let b_1 = []; + let b_2 = []; + console.assert(b_1 /* === or !== ? */ b_2); + + // --- + + const index = 0; + + let a_1[index] = 3; + let a_2[index] = 3; + console.assert(a_1 /* === or !== ? */ a_2); + + let b_1[index] = 5; + let b_2[index] = 5; + console.assert(b_1 /* === or !== ? */ b_2); +} +``` + +__Fill in the Blanks__ +[on pytut](http://www.pythontutor.com/live.html#code=%20%20%20%20%3B%20//%20write%20this%20line%0A%20%20%20%20%3B%20//%20write%20this%20line%0Aconsole.assert%28arr_1%20!%3D%3D%20arr_2%29%3B%0Aconsole.assert%28arr_1%5B1%5D%20%3D%3D%3D%20arr_2%5B1%5D%29%3B%0Aconsole.assert%28arr_1%5B1%5D%20%3D%3D%3D%20'B'%29%0A%0Alet%20key%20%3D%200%3B%0Aconsole.assert%28arr_1%5Bkey%5D%20%3D%3D%3D%20arr_2%5Bkey%5D%29%3B%0Aconsole.assert%28arr_1%5Bkey%5D%20%3D%3D%3D%20'A'%29%3B%0A%0A%20%20%20%20%3B%20//%20write%20this%20line%0A%20%20%20%20%3B%20//%20write%20this%20line%0Aconsole.assert%28arr_1%5Barr_2%5B2%5D%5D%20%3D%3D%3D%20arr_2%5Barr_1%5B2%5D%5D%29%3B%0Aconsole.assert%28arr_1%5Barr_2%5B2%5D%5D%20%3D%3D%3D%20'B'%29%3B%0A%0A%20%20%20%20%3B%20//%20write%20this%20line%0A%20%20%20%20%3B%20//%20write%20this%20line%0Aconsole.assert%28arr_1%20%3D%3D%3D%20arr_2%29%3B%0Aconsole.assert%28arr_3%20!%3D%3D%20arr_1%29%3B%0Aconsole.assert%28arr_3%20!%3D%3D%20arr_2%29%3B%0Aconsole.assert%28arr_3%5Bkey%5D%20%3D%3D%3D%20arr_1%5B0%5D%29%3B%0A%0A%20%20%20%20%3B%20//%20write%20this%20line%0Aconsole.assert%28obj_3%5B1%5D%20%3D%3D%3D%20obj_2%5Bkey%5D%29%3B&cumulative=false&curInstr=1&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +```js +{ + ; // write this line + ; // write this line + console.assert(arr_1 !== arr_2); + console.assert(arr_1[1] === arr_2[1]); + console.assert(arr_1[1] === 'B') + + let key = 0; + console.assert(arr_1[key] === arr_2[key]); + console.assert(arr_1[key] === 'A'); + + ; // write this line + ; // write this line + console.assert(arr_1[arr_2[2]] === arr_2[arr_1[2]]); + console.assert(arr_1[arr_2[2]] === 'B'); + + ; // write this line + ; // write this line + console.assert(arr_1 === arr_2); + console.assert(arr_3 !== arr_1); + console.assert(arr_3 !== arr_2); + console.assert(arr_3[key] === arr_1[0]); + + ; // write this line + console.assert(obj_3[1] === obj_2[key]); +} +``` + +[TOP](#reference-type-exercises) + +--- + +## Object Exercises + +__Complete the Assertions__ +[on pytut](http://www.pythontutor.com/javascript.html#code=let%20a_1%20%3D%20%7B%7D%3B%0Alet%20a_2%20%3D%20a_1%3B%0Aconsole.assert%28a_1%20/*%20%3D%3D%3D%20or%20!%3D%3D%20%3F%20*/%20a_2%29%3B%0A%0Alet%20b_1%20%3D%20%7B%7D%3B%0Alet%20b_2%20%3D%20%7B%7D%3B%0Aconsole.assert%28b_1%20/*%20%3D%3D%3D%20or%20!%3D%3D%20%3F%20*/%20b_2%29%3B%0A%0A//%20---%0A%0Alet%20a_1.x%20%3D%203%3B%0Alet%20a_2.x%20%3D%203%3B%0Aconsole.assert%28a_1%20/*%20%3D%3D%3D%20or%20!%3D%3D%20%3F%20*/%20a_2%29%3B%0A%0Alet%20b_1.x%20%3D%205%3B%0Alet%20b_2.x%20%3D%205%3B%0Aconsole.assert%28b_1%20/*%20%3D%3D%3D%20or%20!%3D%3D%20%3F%20*/%20b_2%29%3B%0A%0A&mode=edit&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) +```js +{ + let a_1 = {}; + let a_2 = a_1; + console.assert(a_1 /* === or !== ? */ a_2); + + let b_1 = {}; + let b_2 = {}; + console.assert(b_1 /* === or !== ? */ b_2); + + // --- + + let a_1.x = 3; + let a_2.x = 3; + console.assert(a_1 /* === or !== ? */ a_2); + + let b_1.x = 5; + let b_2.x = 5; + console.assert(b_1 /* === or !== ? */ b_2); +} +``` + +__Complete the Assertions__ +[on pytut](http://www.pythontutor.com/javascript.html#code=%20%20let%20a_1%20%3D%20%7B%7D%3B%0A%20%20let%20a_2%20%3D%20a_1%3B%0A%20%20console.assert%28a_1%20/*%20%3D%3D%3D%20or%20!%3D%3D%20%3F%20*/%20a_2%29%3B%0A%0A%20%20let%20b_1%20%3D%20%7B%7D%3B%0A%20%20let%20b_2%20%3D%20%7B%7D%3B%0A%20%20console.assert%28b_1%20/*%20%3D%3D%3D%20or%20!%3D%3D%20%3F%20*/%20b_2%29%3B%0A%0A%20%20//%20---%0A%20%20%0A%20%20const%20key%20%3D%20%22x%22%3B%0A%0A%20%20let%20a_1%5Bkey%5D%20%3D%203%3B%0A%20%20let%20a_2%5Bkey%5D%20%3D%203%3B%0A%20%20console.assert%28a_1%20/*%20%3D%3D%3D%20or%20!%3D%3D%20%3F%20*/%20a_2%29%3B%0A%0A%20%20let%20b_1%5Bkey%5D%20%3D%205%3B%0A%20%20let%20b_2%5Bkey%5D%20%3D%205%3B%0A%20%20console.assert%28b_1%20/*%20%3D%3D%3D%20or%20!%3D%3D%20%3F%20*/%20b_2%29%3B&mode=edit&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) +```js +{ + let a_1 = {}; + let a_2 = a_1; + console.assert(a_1 /* === or !== ? */ a_2); + + let b_1 = {}; + let b_2 = {}; + console.assert(b_1 /* === or !== ? */ b_2); + + // --- + + const key = "x"; + + let a_1[key] = 3; + let a_2[key] = 3; + console.assert(a_1 /* === or !== ? */ a_2); + + let b_1[key] = 5; + let b_2[key] = 5; + console.assert(b_1 /* === or !== ? */ b_2); +} +``` + +__Fill in the Blanks__ +[on pytut](http://www.pythontutor.com/live.html#code=%20%20%20%20%3B%20//%20write%20this%20line%0A%20%20%20%20%3B%20//%20write%20this%20line%20%20%20%20%3B%20//%20write%20this%20line%0Aconsole.assert%28obj_1%20!%3D%3D%20obj_2%29%3B%0Aconsole.assert%28obj_1.x%20%3D%3D%3D%20obj_2.x%29%3B%0Aconsole.assert%28obj_1.x%20%3D%3D%3D%20%22a%22%29%3B%0A%0Alet%20key%20%3D%20%22y%22%3B%0Aconsole.assert%28obj_1%5Bkey%5D%20%3D%3D%3D%20obj_2%5Bkey%5D%29%3B%0Aconsole.assert%28obj_1%5Bkey%5D%20%3D%3D%3D%20'x'%29%3B%0A%0A%20%20%20%20%3B%20//%20write%20this%20line%0A%20%20%20%20%3B%20//%20write%20this%20line%0Aconsole.assert%28obj_1%5Bobj_2.y%5D%20%3D%3D%3D%20obj_2%5Bobj_1.y%5D%29%3B%0Aconsole.assert%28obj_1%5Bobj_2.y%5D%20%3D%3D%3D%20obj_1%5B'x'%5D%29%3B%0A%0A%20%20%20%20%3B%20//%20write%20this%20line%0A%20%20%20%20%3B%20//%20write%20this%20line%0Aconsole.assert%28obj_1%20%3D%3D%3D%20obj_2%29%3B%0Aconsole.assert%28obj_3%20!%3D%3D%20obj_1%29%3B%0Aconsole.assert%28obj_3%20!%3D%3D%20obj_2%29%3B%0Aconsole.assert%28obj_3%5Bkey%5D%20%3D%3D%3D%20obj_1.y%29%3B%0Aconsole.assert%28obj_3%5B'x'%5D%20%3D%3D%3D%20key%29%3B&cumulative=false&curInstr=1&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +```js +{ + ; // write this line + ; // write this line ; // write this line + console.assert(obj_1 !== obj_2); + console.assert(obj_1.x === obj_2.x); + console.assert(obj_1.x === "a"); + + let key = "y"; + console.assert(obj_1[key] === obj_2[key]); + console.assert(obj_1[key] === 'x'); + + ; // write this line + ; // write this line + console.assert(obj_1[obj_2.y] === obj_2[obj_1.y]); + console.assert(obj_1[obj_2.y] === obj_1['x']); + + ; // write this line + ; // write this line + console.assert(obj_1 === obj_2); + console.assert(obj_3 !== obj_1); + console.assert(obj_3 !== obj_2); + console.assert(obj_3[key] === obj_1.y); + console.assert(obj_3['x'] === key); +} +``` + +[TOP](#reference-type-exercises) + +--- + +## Comparison Exercises + +__Swap 'em__ +[on pytut](http://www.pythontutor.com/javascript.html#code=const%20obj%20%3D%20%7Bprop%3A%20%22array%22%7D%3B%0Aconst%20arr%20%3D%20%5B%22object%22%5D%3B%0Alet%20_%20%3D%20null%3B%0A%0A//%20swap%20the%20values%20stored%20in%20each%20structure%0A//%20%20using%20dot%20notation%20for%20the%20object%0A//%20%20using%20direct%20access%20for%20the%20array&mode=edit&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) +```js +{ + const obj = {prop: "array"}; + const arr = ["object"]; + let _ = null; + + // swap the values stored in each structure + // using dot notation for the object + // using direct access for the array +} +``` + +__Swap 'em__ +[on pytut](http://www.pythontutor.com/live.html#code=const%20obj%20%3D%20%7Bprop%3A%20%22array%22%7D%3B%0Aconst%20arr%20%3D%20%5B%22object%22%5D%3B%0Alet%20_%20%3D%20null%3B%0A%0A//%20fill%20in%20these%20blanks%0Aconst%20obj_key%20%3D%20%3B%0Aconst%20arr_index%20%3D%20%3B%0A%0A_%20%3D%20arr%5Barr_index%5D%3B%0Aarr%5Barr_index%5D%20%3D%20obj%5Bobj_key%5D%3B%0Aobj%5Bobj_key%5D%20%3D%20_%3B%0A%0Aconsole.assert%28arr%5Barr_index%5D%20%3D%3D%3D%20%22object%22,%20%22first%20assert%22%29%3B%0Aconsole.assert%28obj%5Bobj_key%5D%20%3D%3D%3D%20%22array%22,%20%22second%20assert%22%29%3B&cumulative=false&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +```js +{ + const obj = {prop: "array"}; + const arr = ["object"]; + let _ = null; + + // fill in these blanks + const obj_key = ; + const arr_index = ; + + _ = arr[arr_index]; + arr[arr_index] = obj[obj_key]; + obj[obj_key] = _; + + console.assert(arr[arr_index] === "object", "first assert"); + console.assert(obj[obj_key] === "array", "second assert"); +} +``` + +__Relative vs Absolute__ +[on pytut](http://www.pythontutor.com/javascript.html#code=//%20array%20indices%20are%20relative%0Aconst%20arr%20%3D%20%5B%22a%22,%20%22b%22%5D%3B%0Aconst%20index%20%3D%200%3B%0A%0Aconst%20read_arr_1%20%3D%20arr%5Bindex%5D%3B%0Aarr.shift%28%29%3B%20//%20removes%20the%20first%20item%0Aconst%20read_arr_2%20%3D%20arr%5Bindex%5D%3B%0A%0Aconsole.assert%28read_arr_1%20/*%20%3D%3D%3D%20or%20!%3D%3D%20%3F%20*/%20read_arr_2%29%3B%0A%0A//%20object%20keys%20are%20absolute%0Aconst%20obj%20%3D%20%7Bx%3A%20%22a%22,%20y%3A%20%22b%22%7D%3B%0Aconst%20key%20%3D%20%22y%22%3B%0A%0Aconst%20read_obj_1%20%3D%20obj%5Bkey%5D%3B%0Adelete%20obj.x%3B%0Aconst%20read_obj_2%20%3D%20obj%5Bkey%5D%3B%0A%0Aconsole.assert%28read_obj_1%20/*%20%3D%3D%3D%20or%20!%3D%3D%20%3F%20*/%20read_obj_2%29%3B&mode=edit&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) +```js +{ + // array indices are relative + const arr = ["a", "b"]; + const index = 0; + + const read_arr_1 = arr[index]; + arr.shift(); // removes the first item + const read_arr_2 = arr[index]; + + console.assert(read_arr_1 /* === or !== ? */ read_arr_2); + + // object keys are absolute + const obj = {x: "a", y: "b"}; + const key = "y"; + + const read_obj_1 = obj[key]; + delete obj.x; + const read_obj_2 = obj[key]; + + console.assert(read_obj_1 /* === or !== ? */ read_obj_2); +} +``` + +[TOP](#reference-type-exercises) + +--- + +## Nesting Reference Types + +### Nesting Arrays + +__complete the asserts__ +[on pytut](http://www.pythontutor.com/live.html#code=let%20arr_1%20%3D%20%5B%5D%3B%0Alet%20arr_2%20%3D%20%5B%5D%3B%0A%0Aarr_1.push%28arr_2%29%3B%0Aarr_2.push%28arr_1%29%3B%0Aconsole.assert%28arr_1%5B0%5D%20/*%20%3D%3D%3D%20or%20!%3D%3D%20*/%20arr_2%29%3B%0Aconsole.assert%28arr_2%5B0%5D%20/*%20%3D%3D%3D%20or%20!%3D%3D%20*/%20arr_1%29%3B%0A%0Aarr_1.push%28%5B%5D%29%3B%0Aarr_2.push%28%5B%5D%29%3B%0Aconsole.assert%28arr_1%5B1%5D%20/*%20%3D%3D%3D%20or%20!%3D%3D%20*/%20arr_2%5B1%5D%29%3B%0A%0Aarr_1%5B0%5D.push%28'A'%29%3B%0Aconsole.assert%28arr_1%5B0%5D%5B2%5D%20/*%20%3D%3D%3D%20or%20!%3D%3D%20*/%20arr_2%5B2%5D%29%3B%0A%0Aarr_2%5B0%5D.push%28'B'%29%3B%0Aconsole.assert%28arr_2%5B0%5D%5B2%5D%20/*%20%3D%3D%3D%20or%20!%3D%3D%20*/%20arr_1%5B2%5D%29%3B%0A%0Aarr_1%5B1%5D.push%28'X'%29%3B%0Aarr_2%5B1%5D.push%28'X'%29%3B%0Aconsole.assert%28arr_1%5B1%5D%5B0%5D%20/*%20%3D%3D%3D%20or%20!%3D%3D%20*/%20arr_2%5B1%5D%5B0%5D%29&cumulative=false&curInstr=9&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +```js +{ + let arr_1 = []; + let arr_2 = []; + + arr_1.push(arr_2); + arr_2.push(arr_1); + console.assert(arr_1[0] /* === or !== */ arr_2); + console.assert(arr_2[0] /* === or !== */ arr_1); + + arr_1.push([]); + arr_2.push([]); + console.assert(arr_1[1] /* === or !== */ arr_2[1]); + + arr_1[0].push('A'); + console.assert(arr_1[0][2] /* === or !== */ arr_2[2]); + + arr_2[0].push('B'); + console.assert(arr_2[0][2] /* === or !== */ arr_1[2]); + + arr_1[1].push('X'); + arr_2[1].push('X'); + console.assert(arr_1[1][0] /* === or !== */ arr_2[1][0]) +} +``` + +__fill in the blanks__ +```js +{ + let arr_1 = []; + let arr_2 = []; + + arr_1.push(arr_2); + arr_2.push(arr_1); + console.assert(arr_1[0] /* === or !== */ arr_2); + console.assert(arr_2[0] /* === or !== */ arr_1); + + arr_1.push([]); + arr_2.push([]); + console.assert(arr_1[1] /* === or !== */ arr_2[1]); + + arr_1[0].push('A'); + console.assert(arr_1[0][2] /* === or !== */ arr_2[2]); + + arr_2[0].push('B'); + console.assert(arr_2[0][2] /* === or !== */ arr_1[2]); + + arr_1[1].push('X'); + arr_2[1].push('X'); + console.assert(arr_1[1][0] /* === or !== */ arr_2[1][0]) +} +``` + +### Nesting Objects + +### Nesting Arrays and Objects + +___ +___ +### Janke Learning From b7ccc0db6cea0f1f5615b579852ae1105128532d Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sat, 29 Jun 2019 22:54:12 +0200 Subject: [PATCH 40/54] Update jl-reference-types.md --- week-2/jl-reference-types.md | 42 ++++++++++++++++-------------------- 1 file changed, 18 insertions(+), 24 deletions(-) diff --git a/week-2/jl-reference-types.md b/week-2/jl-reference-types.md index f7ddc8b..362e695 100644 --- a/week-2/jl-reference-types.md +++ b/week-2/jl-reference-types.md @@ -177,51 +177,45 @@ __Complete this code__ __Complete the Assertions__ [on pytut](http://www.pythontutor.com/javascript.html#code=let%20a_1%20%3D%20%5B%5D%3B%0Alet%20a_2%20%3D%20a_1%3B%0Aconsole.assert%28a_1%20/*%20%3D%3D%3D%20or%20!%3D%3D%20%3F%20*/%20a_2%29%3B%0A%0Alet%20b_1%20%3D%20%5B%5D%3B%0Alet%20b_2%20%3D%20%5B%5D%3B%0Aconsole.assert%28b_1%20/*%20%3D%3D%3D%20or%20!%3D%3D%20%3F%20*/%20b_2%29%3B%0A%0A//%20---%0A%0Alet%20a_1.push%283%29%3B%0Alet%20a_2.push%283%29%3B%0Aconsole.assert%28a_1%20/*%20%3D%3D%3D%20or%20!%3D%3D%20%3F%20*/%20a_2%29%3B%0A%0Alet%20b_1.push%285%29%3B%0Alet%20b_2.push%285%29%3B%0Aconsole.assert%28b_1%20/*%20%3D%3D%3D%20or%20!%3D%3D%20%3F%20*/%20b_2%29%3B%0A%0A&mode=edit&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) ```js -{ - let a_1 = []; - let a_2 = a_1; - console.assert(a_1 /* === or !== ? */ a_2); +let a_1 = []; +let a_2 = a_1; +console.assert(a_1 === a_2); - let b_1 = []; - let b_2 = []; - console.assert(b_1 /* === or !== ? */ b_2); +let b_1 = []; +let b_2 = []; +console.assert(b_1 !== b_2); - // --- +// --- - let a_1.push(3); - let a_2.push(3); - console.assert(a_1 /* === or !== ? */ a_2); +let a_1.push(3); +let a_2.push(3); +console.assert(a_1 === a_2); - let b_1.push(5); - let b_2.push(5); - console.assert(b_1 /* === or !== ? */ b_2); -} +let b_1.push(5); +let b_2.push(5); +console.assert(b_1 !== b_2); ``` __Complete the Assertions__ [on pytut](http://www.pythontutor.com/javascript.html#code=let%20a_1%20%3D%20%5B%5D%3B%0Alet%20a_2%20%3D%20a_1%3B%0Aconsole.assert%28a_1%20/*%20%3D%3D%3D%20or%20!%3D%3D%20%3F%20*/%20a_2%29%3B%0A%0Alet%20b_1%20%3D%20%5B%5D%3B%0Alet%20b_2%20%3D%20%5B%5D%3B%0Aconsole.assert%28b_1%20/*%20%3D%3D%3D%20or%20!%3D%3D%20%3F%20*/%20b_2%29%3B%0A%0A//%20---%0A%0Aconst%20key%20%3D%200%3B%0A%0Alet%20a_1%5Bkey%5D%20%3D%203%3B%0Alet%20a_2%5Bkey%5D%20%3D%203%3B%0Aconsole.assert%28a_1%20/*%20%3D%3D%3D%20or%20!%3D%3D%20%3F%20*/%20a_2%29%3B%0A%0Alet%20b_1%5Bkey%5D%20%3D%205%3B%0Alet%20b_2%5Bkey%5D%20%3D%205%3B%0Aconsole.assert%28b_1%20/*%20%3D%3D%3D%20or%20!%3D%3D%20%3F%20*/%20b_2%29%3B%0A&mode=edit&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) ```js -{ - let a_1 = []; + let a_1 = []; let a_2 = a_1; - console.assert(a_1 /* === or !== ? */ a_2); + console.assert(a_1 === a_2); let b_1 = []; let b_2 = []; - console.assert(b_1 /* === or !== ? */ b_2); - - // --- + console.assert(b_1 !== b_2); const index = 0; let a_1[index] = 3; let a_2[index] = 3; - console.assert(a_1 /* === or !== ? */ a_2); + console.assert(a_1 === a_2); let b_1[index] = 5; let b_2[index] = 5; - console.assert(b_1 /* === or !== ? */ b_2); -} + console.assert(b_1 === b_2); ``` __Fill in the Blanks__ From 2ea90bb29f3fa0e071533f6d304169f3f4180962 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sat, 29 Jun 2019 22:54:32 +0200 Subject: [PATCH 41/54] Update jl-variables-sentences-1.md --- week-2/jl-variables-sentences-1.md | 40 +++++++++++++++++++++++++++++- 1 file changed, 39 insertions(+), 1 deletion(-) diff --git a/week-2/jl-variables-sentences-1.md b/week-2/jl-variables-sentences-1.md index 9d47c67..9bff7bd 100644 --- a/week-2/jl-variables-sentences-1.md +++ b/week-2/jl-variables-sentences-1.md @@ -1,2 +1,40 @@ > paste [this markdown of exercises](https://raw.githubusercontent.com/janke-learning/variable-exercises/master/sentences-without-temps.md) into this file and complete the exercises! -> references: [javascript.info variables](https://javascript.info/variables), [variables and hoisting](https://github.com/janke-learning/variables-and-hoisting) \ No newline at end of file +> references: [javascript.info variables](https://javascript.info/variables), [variables and hoisting](https://github.com/janke-learning/variables-and-hoisting) + +# Sentences without temp variables + +These exercises ask you to reassign variables so that at each step of execution the variables spell out the next word in a sentence. See how few reassignments you can use per step! + +You'll have to practice looking ahead of and behind the line you are writing to strategize how you will store and reuse data from earlier in your program. This is one of the fundamental challenges in development. + + +### example solutions: +1. the toad reads me: [pytut](https://goo.gl/pmpkJZ), [parsons](https://janke-learning.github.io/parsonizer/?snippet=%2F%2F%20the%20toad%20reads%20me%0Alet%20_1%20%3D%20%22%20%22%2C%20_2%20%3D%20%22%20%22%2C%20_3%20%3D%20%22%20%22%2C%20_4%20%3D%20%22%20%22%2C%20_5%20%3D%20%22%20%22%3B%0A%2F%2F%20the%0A_1%20%3D%20%22t%22%2C%20_2%20%3D%20%22h%22%2C%20_3%20%3D%20%22e%22%3B%0A%2F%2F%20toad%0A_2%20%3D%20%22o%22%2C%20_3%20%3D%20%22a%22%2C%20_4%20%3D%20%22d%22%3B%0A%2F%2F%20reads%0A_1%20%3D%20%22r%22%2C%20_2%20%3D%20%22e%22%2C%20_5%20%3D%20%22s%22%3B%0A%2F%2F%20me%0A_1%20%3D%20%22m%22%2C%20_3%20%3D%20%22%20%22%2C%20_4%20%3D%20%22%20%22%2C%20_5%20%3D%20%22%20%22%3B) +1. eating meat every meal: [pytut](https://goo.gl/bDVjKL), [parsons](https://janke-learning.github.io/parsonizer/?snippet=%2F%2F%20eating%20meat%20every%20meal%0Alet%20_1%20%3D%20'%20'%2C%20_2%20%3D%20'%20'%2C%20_3%20%3D%20'%20'%2C%20_4%20%3D%20'%20'%2C%20_5%20%3D%20'%20'%2C%20_6%3D%20'%20'%3B%0A%2F%2F%20eating%0A_1%20%3D%20%22e%22%2C%20_2%20%3D%20%22a%22%2C%20_3%20%3D%20%22t%22%2C%20_4%20%3D%20%22i%22%2C%20_5%20%3D%20%22n%22%2C%20_6%3D%20%22g%22%3B%0A%2F%2F%20meat%0A_4%20%3D%20_3%2C%20_3%20%3D%20_2%2C%20_2%20%3D%20_1%2C%20_1%20%3D%20%22m%22%2C%20_5%20%3D%20%22%20%22%2C%20_6%20%3D%20%22%20%22%3B%0A%2F%2F%20every%0A_1%20%3D%20_2%2C%20_3%20%3D%20_2%2C%20_2%20%3D%20%22v%22%2C%20_4%20%3D%20%22r%22%2C%20_5%20%3D%20%22y%22%3B%0A%2F%2F%20meal%0A_1%20%3D%20%22m%22%2C%20_2%20%3D%20_3%2C%20_3%20%3D%20%22a%22%2C%20_4%20%3D%20%22l%22%2C%20_5%20%3D%20%22%20%22%3B) +1. many men may melt my mind: [pytut](https://goo.gl/Gh8mCu), [parsons](https://janke-learning.github.io/parsonizer/?snippet=%2F%2F%20many%20men%20may%20melt%20my%20mind%0A%0Alet%20_1%20%3D%20'%20'%2C%20_2%20%3D%20'%20'%2C%20_3%20%3D%20'%20'%2C%20_4%20%3D%20'%20'%3B%0A%0A%2F%2F%20many%0A_1%20%3D%20'm'%2C%20_2%20%3D%20'a'%2C%20_3%20%3D%20'n'%2C%20_4%20%3D%20'y'%3B%0A%2F%2F%20men%0A_2%20%3D%20'e'%2C%20_4%20%3D%20'%20'%3B%0A%2F%2F%20may%0A_2%20%3D%20'a'%2C%20_3%20%3D%20'y'%3B%0A%2F%2F%20melt%0A_2%20%3D%20'e'%2C%20_3%20%3D%20'l'%2C%20_4%20%3D%20't'%3B%0A%2F%2F%20my%0A_2%20%3D%20'y'%2C%20_3%20%3D%20'%20'%2C%20_4%20%3D%20'%20'%3B%0A%2F%2F%20mind%0A_2%20%3D%20'i'%2C%20_3%20%3D%20'n'%2C%20_4%20%3D%20'd'%3B) +1. if fir trees ever fall: [pytut](https://goo.gl/tdJQwW), [parsons](https://janke-learning.github.io/parsonizer/?snippet=%2F%2F%20if%20fir%20trees%20ever%20fall%0A%0Alet%20_1%20%3D%20'%20'%2C%20_2%20%3D%20'%20'%2C%20_3%20%3D%20'%20'%2C%20_4%20%3D%20'%20'%2C%20_5%20%3D%20'%20'%3B%0A%0A%2F%2F%20if%0A_1%20%3D%20'i'%2C%20_2%20%3D%20'f'%3B%0A%2F%2F%20fir%0A_1%20%3D%20_2%2C%20_2%20%3D%20'i'%2C%20_3%20%3D%20'r'%3B%0A%2F%2F%20trees%0A_1%20%3D%20't'%2C%20_2%20%3D%20_3%2C%20_3%20%3D%20'e'%2C%20_4%20%3D%20_3%2C%20_5%20%3D%20's'%3B%0A%2F%2F%20ever%0A_1%20%3D%20_3%2C%20_2%20%3D%20'v'%2C%20_4%20%3D%20'r'%2C%20_5%20%3D%20'r'%3B%0A%2F%2F%20fall%0A_1%20%3D%20'f'%2C%20_2%20%3D%20'a'%2C%20_3%20%3D%20'l'%2C%20_4%20%3D%20_3%2C%20_5%20%3D%20'%20'%3B) + +### challenges: +1. [the toad reads me](https://goo.gl/imKwgj) +```js + +``` +1. [eating meat every meal](https://goo.gl/cwZijk) +```js + +``` +1. [many men may melt my mind](https://goo.gl/16C62t) +```js + +``` +1. [if fir trees ever fall](https://goo.gl/8y5Lh2) +```js + +``` + + + + +___ +___ +### Janke Learning From d8ae612bacb990dbc1994127491004a443bf7e3b Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sat, 29 Jun 2019 23:13:08 +0200 Subject: [PATCH 42/54] Update jl-variables-sentences-1.md --- week-2/jl-variables-sentences-1.md | 65 ++++++++++++++++++++++++++++++ 1 file changed, 65 insertions(+) diff --git a/week-2/jl-variables-sentences-1.md b/week-2/jl-variables-sentences-1.md index 9bff7bd..e0beb39 100644 --- a/week-2/jl-variables-sentences-1.md +++ b/week-2/jl-variables-sentences-1.md @@ -17,19 +17,84 @@ You'll have to practice looking ahead of and behind the line you are writing to ### challenges: 1. [the toad reads me](https://goo.gl/imKwgj) ```js +// the toad reads me +// we give you this +let _1 = " ", _2 = " ", _3 = " ", _4 = " ", _5 = " "; + +// -- you write this -- + +// the +_1 = "t", _2 = "h", _3 = "e"; + +// toad +_2 = "o", _3 = "a", _4 = "d"; + +// reads +_1 = "r", _2 = "e", _5 = "s"; + +// me "; +_1 = "m", _3 = " ", _4 = " ", _5 = " "; ``` 1. [eating meat every meal](https://goo.gl/cwZijk) ```js +// eating meat every meal + +// we give you this +let _1 = ' ', _2 = ' ', _3 = ' ', _4 = ' ', _5 = ' ', _6= ' '; +// -- you write this -- + +// eating +_1 = 'e', _2 = 'a', _3 = 't', _4 = 'i', _5 = 'n', _6 = 'g'; +// meat +_4 = _3, _3 = _2, _2 = _1, _1 = 'm', _5 = ' ', _6 = ' '; +// every +_1 = _2, _3 = _1; _2 = 'v', _4 = 'r', _5 = 'y'; +// meal +_1 = 'm', _2 = _3, _3 = 'a', _4 = 'l', _5 =' '; ``` 1. [many men may melt my mind](https://goo.gl/16C62t) ```js +// many men may melt my mind + +// we give you this +let _1 = ' ', _2 = ' ', _3 = ' ', _4 = ' '; + +// you write this +// many +_1 = 'm', _2 = 'a', _3 = 'n', _4 = 'y'; +// men +_2 = 'e', _4 = ' '; +// may +_2 = 'a', _3 = 'y'; +// melt +_2 = 'e', _3 = 'l', _4 = 't'; +// my +_2 = 'y', _3 = ' ', _4 = ' '; +// mind +_2 = 'i', _3 = 'n', _4 = 'd'; ``` 1. [if fir trees ever fall](https://goo.gl/8y5Lh2) ```js +// if fir trees ever fall + +// we give you this +let _1 = ' ', _2 = ' ', _3 = ' ', _4 = ' ', _5 = ' '; + +// you write this +// if +_1 = 'i', _2 = 'f'; +// fir +_1 = _2, _2 = 'i', _3 = 'r'; +// trees +_1 = 't', _2 = _3, _3 = 'e', _4 = _3, _5 = 's'; +// ever +_1 = _3, _2 = 'v', _4 = 'r', _5 = 'r'; +// fall +_1 = 'f', _2 = 'a', _3 = 'l', _4 = _3, _5 = ' '; ``` From e70bcce9fccd2c9d05136d308a0aa8d7b5ef04ef Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sat, 29 Jun 2019 23:13:36 +0200 Subject: [PATCH 43/54] Update jl-variables-sentences-2.md --- week-2/jl-variables-sentences-2.md | 30 +++++++++++++++++++++++++++++- 1 file changed, 29 insertions(+), 1 deletion(-) diff --git a/week-2/jl-variables-sentences-2.md b/week-2/jl-variables-sentences-2.md index 65feb7d..9308d0e 100644 --- a/week-2/jl-variables-sentences-2.md +++ b/week-2/jl-variables-sentences-2.md @@ -1,2 +1,30 @@ > paste [this markdown of exercises](https://raw.githubusercontent.com/janke-learning/variable-exercises/master/sentences-with-temps.md) into this file and complete the exercises! -> references: [javascript.info variables](https://javascript.info/variables), [variables and hoisting](https://github.com/janke-learning/variables-and-hoisting) \ No newline at end of file +> references: [javascript.info variables](https://javascript.info/variables), [variables and hoisting](https://github.com/janke-learning/variables-and-hoisting) + +# Sentences with Temp Variables + +These exercises ask you to reassign variables so that at each step of execution the variables spell out the next word in a sentence. + +You'll have to practice looking ahead of and behind the line you are writing to strategize how you will store and reuse data from earlier in your program. This is one of the fundamental challenges in development. + +They're just like the [sentences without temps](./3-sentences-without-temps.md) exercises, but with a couple extra variables like you saw in [swaps](./1-swaps.md). Pay attention to how your planning and solution changes when you can save values for later + +See how few reassignments you can use per step! + +### example solutions: +1. the toad reads me: [pytut](https://goo.gl/WrWMid), [parsons](https://janke-learning.github.io/parsonizer/?snippet=%2F%2F%20the%20toad%20reads%20me%0A%0Alet%20_1%20%3D%20%22%20%22%2C%20_2%20%3D%20%22%20%22%2C%20_3%20%3D%20%22%20%22%2C%20_4%20%3D%20%22%20%22%2C%20_5%20%3D%20%22%20%22%3B%0Alet%20x%20%3D%20'%20'%2C%20y%20%3D%20'%20'%3B%0A%0A%2F%2F%20the%0A_1%20%3D%20%22t%22%2C%20_2%20%3D%20%22h%22%2C%20_3%20%3D%20%22e%22%3B%0A%2F%2F%20toad%0Ax%20%3D%20_3%3B%0A_2%20%3D%20%22o%22%2C%20_3%20%3D%20%22a%22%2C%20_4%20%3D%20%22d%22%3B%0A%2F%2F%20reads%0A_1%20%3D%20%22r%22%2C%20_2%20%3D%20x%2C%20_5%20%3D%20%22s%22%3B%0A%2F%2F%20me%0A_1%20%3D%20%22m%22%2C%20_3%20%3D%20%22%20%22%2C%20_4%20%3D%20%22%20%22%2C%20_5%20%3D%20%22%20%22%3B) +1. eating meat every meal: [pytut](https://goo.gl/ioTN8v), [parsons](https://janke-learning.github.io/parsonizer/?snippet=%2F%2F%20eating%20meat%20every%20meal%0A%0Alet%20_1%20%3D%20'%20'%2C%20_2%20%3D%20'%20'%2C%20_3%20%3D%20'%20'%2C%20_4%20%3D%20'%20'%2C%20_5%20%3D%20'%20'%2C%20_6%3D%20'%20'%3B%0Alet%20x%20%3D%20'%20'%2C%20y%20%3D%20'%20'%3B%0A%0A%2F%2F%20eating%0A_1%20%3D%20%22e%22%2C%20_2%20%3D%20%22a%22%2C%20_3%20%3D%20%22t%22%2C%20_4%20%3D%20%22i%22%2C%20_5%20%3D%20%22n%22%2C%20_6%3D%20%22g%22%3B%0A%2F%2F%20meat%0Ax%20%3D%20_2%3B%0A_4%20%3D%20_3%2C%20_3%20%3D%20_2%2C%20_2%20%3D%20_1%2C%20_1%20%3D%20%22m%22%2C%20_5%20%3D%20%22%20%22%2C%20_6%20%3D%20%22%20%22%3B%0A%2F%2F%20every%0Ay%20%3D%20_1%3B%0A_1%20%3D%20_2%2C%20_3%20%3D%20_2%2C%20_2%20%3D%20%22v%22%2C%20_4%20%3D%20%22r%22%2C%20_5%20%3D%20%22y%22%3B%0A%2F%2F%20meal%0A_1%20%3D%20y%2C%20_2%20%3D%20_3%2C%20_3%20%3D%20x%2C%20_4%20%3D%20%22l%22%2C%20_5%20%3D%20%22%20%22%3B) +1. many men may melt my mind: [pytut](https://goo.gl/Q8LtiR), [parsons](https://janke-learning.github.io/parsonizer/?snippet=%2F%2F%20many%20men%20may%20melt%20my%20mind%0A%0Alet%20_1%20%3D%20'%20'%2C%20_2%20%3D%20'%20'%2C%20_3%20%3D%20'%20'%2C%20_4%20%3D%20'%20'%3B%0Alet%20x%20%3D%20'%20'%2C%20y%20%3D%20'%20'%3B%0A%0A%2F%2F%20many%0A_1%20%3D%20'm'%2C%20%20_2%20%3D%20'a'%2C%20_3%20%3D%20'n'%2C%20_4%20%3D%20'y'%3B%0A%2F%2F%20men%0Ax%20%3D%20_2%2C%20y%20%3D%20_4%3B%0A_2%20%3D%20'e'%2C%20_4%20%3D%20'%20'%3B%0A%2F%2F%20may%0A_3%20%3D%20y%2C%20y%20%3D%20_2%2C%20_2%20%3D%20x%3B%0A%2F%2F%20melt%0Ax%20%3D%20_3%3B%0A_2%20%3D%20y%2C%20_3%20%3D%20'l'%2C%20_4%20%3D%20't'%3B%0A%2F%2F%20my%0A_2%20%3D%20x%2C%20_3%20%3D%20'%20'%2C%20_4%20%3D%20'%20'%3B%0A%2F%2F%20mind%0A_2%20%3D%20'i'%2C%20_3%20%3D%20'n'%2C%20_4%20%3D%20'd'%3B) +1. if fir trees ever fall: [pytut](https://goo.gl/SpjB6t), [parsons](https://janke-learning.github.io/parsonizer/?snippet=%2F%2F%20if%20fir%20trees%20ever%20fall%0A%0Alet%20_1%20%3D%20'%20'%2C%20_2%20%3D%20'%20'%2C%20_3%20%3D%20'%20'%2C%20_4%20%3D%20'%20'%2C%20_5%20%3D%20'%20'%3B%0Alet%20x%20%3D%20'%20'%2C%20y%20%3D%20'%20'%3B%20%2F%2F%20to%20save%20extra%20values%20for%20later%0A%0A%2F%2F%20if%0A_1%20%3D%20'i'%2C%20_2%20%3D%20'f'%3B%0A%2F%2F%20fir%0Ax%20%3D%20_2%3B%0A_2%20%3D%20_1%2C%20_1%20%3D%20x%2C%20_3%20%3D%20'r'%3B%0A%2F%2F%20trees%0A_1%20%3D%20't'%2C%20_2%20%3D%20_3%2C%20_3%20%3D%20'e'%2C%20_4%20%3D%20_3%2C%20_5%20%3D%20's'%3B%0A%2F%2F%20ever%0Ay%20%3D%20_2%3B%0A_1%20%3D%20_3%2C%20_2%20%3D%20'v'%2C%20_4%20%3D%20y%2C%20_5%20%3D%20'%20'%3B%0A%2F%2F%20fall%0A_1%20%3D%20x%2C%20_2%20%3D%20'a'%2C%20_3%20%3D%20'l'%2C%20_4%20%3D%20_3%2C%20_5%20%3D%20'%20'%3B) + + +### challenges: +1. [the toad reads me](https://goo.gl/4eqhLb) +1. [eating meat every meal](https://goo.gl/F9Njwp) +1. [many men may melt my mind](http://www.pythontutor.com/javascript.html#code=//%20many%20men%20may%20melt%20my%20mind%0A%0A//%20we%20give%20you%20this%0Alet%20_1%20%3D%20'%20',%20_2%20%3D%20'%20',%20_3%20%3D%20'%20',%20_4%20%3D%20'%20'%3B%0Alet%20x,%20y%3B%0A//%20--%20you%20write%20this%20--%0A%0A//%20many%0A%0A//%20men%0A%0A//%20may%0A%0A//%20melt%0A%0A//%20my%0A%0A//%20mind&mode=edit&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) +1. [if fir trees ever fall](https://goo.gl/BCC6pz) + + +___ +___ +### Janke Learning From a38e4ddbbaff81757848ebb608e8182e3adf283b Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sat, 29 Jun 2019 23:17:36 +0200 Subject: [PATCH 44/54] Update jl-variables-sentences-2.md --- week-2/jl-variables-sentences-2.md | 19 +++++++++++++++++++ 1 file changed, 19 insertions(+) diff --git a/week-2/jl-variables-sentences-2.md b/week-2/jl-variables-sentences-2.md index 9308d0e..7ac0867 100644 --- a/week-2/jl-variables-sentences-2.md +++ b/week-2/jl-variables-sentences-2.md @@ -20,6 +20,25 @@ See how few reassignments you can use per step! ### challenges: 1. [the toad reads me](https://goo.gl/4eqhLb) +---js +// the toad reads me + +// we give you this +let _1 = " ", _2 = " ", _3 = " ", _4 = " ", _5 = " "; +let x = ' ', y = ' '; + +// you write this + +// the +_1 = "t", _2 = "h", _3 = "e"; +// toad +x = _3; +_2 = "o", _3 = "a", _4 = "d"; +// reads +_1 = "r", _2 = x, _5 = "s"; +// me +_1 = "m", _3 = " ", _4 = " ", _5 = " "; +--- 1. [eating meat every meal](https://goo.gl/F9Njwp) 1. [many men may melt my mind](http://www.pythontutor.com/javascript.html#code=//%20many%20men%20may%20melt%20my%20mind%0A%0A//%20we%20give%20you%20this%0Alet%20_1%20%3D%20'%20',%20_2%20%3D%20'%20',%20_3%20%3D%20'%20',%20_4%20%3D%20'%20'%3B%0Alet%20x,%20y%3B%0A//%20--%20you%20write%20this%20--%0A%0A//%20many%0A%0A//%20men%0A%0A//%20may%0A%0A//%20melt%0A%0A//%20my%0A%0A//%20mind&mode=edit&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) 1. [if fir trees ever fall](https://goo.gl/BCC6pz) From 76d8415101164205eb0614629cd397dfa4773a04 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sat, 29 Jun 2019 23:19:38 +0200 Subject: [PATCH 45/54] Update jl-variables-sentences-2.md --- week-2/jl-variables-sentences-2.md | 72 +++++++++++++++++++++++++++++- 1 file changed, 70 insertions(+), 2 deletions(-) diff --git a/week-2/jl-variables-sentences-2.md b/week-2/jl-variables-sentences-2.md index 7ac0867..69f831c 100644 --- a/week-2/jl-variables-sentences-2.md +++ b/week-2/jl-variables-sentences-2.md @@ -20,7 +20,7 @@ See how few reassignments you can use per step! ### challenges: 1. [the toad reads me](https://goo.gl/4eqhLb) ----js +```js // the toad reads me // we give you this @@ -38,11 +38,79 @@ _2 = "o", _3 = "a", _4 = "d"; _1 = "r", _2 = x, _5 = "s"; // me _1 = "m", _3 = " ", _4 = " ", _5 = " "; ---- +``` + 1. [eating meat every meal](https://goo.gl/F9Njwp) +```js +// eating meat every meal + +// we give you this +let _1 = ' ', _2 = ' ', _3 = ' ', _4 = ' ', _5 = ' ', _6= ' '; +let x = ' ', y = ' '; + +// you write this + +// eating +_1 = "e", _2 = "a", _3 = "t", _4 = "i", _5 = "n", _6= "g"; +// meat +x = _2; +_4 = _3, _3 = _2, _2 = _1, _1 = "m", _5 = " ", _6 = " "; +// every +y = _1; +_1 = _2, _3 = _2, _2 = "v", _4 = "r", _5 = "y"; +// meal +_1 = y, _2 = _3, _3 = x, _4 = "l", _5 = " "; +``` + 1. [many men may melt my mind](http://www.pythontutor.com/javascript.html#code=//%20many%20men%20may%20melt%20my%20mind%0A%0A//%20we%20give%20you%20this%0Alet%20_1%20%3D%20'%20',%20_2%20%3D%20'%20',%20_3%20%3D%20'%20',%20_4%20%3D%20'%20'%3B%0Alet%20x,%20y%3B%0A//%20--%20you%20write%20this%20--%0A%0A//%20many%0A%0A//%20men%0A%0A//%20may%0A%0A//%20melt%0A%0A//%20my%0A%0A//%20mind&mode=edit&origin=opt-frontend.js&py=js&rawInputLstJSON=%5B%5D) +```js +// many men may melt my mind + +// we give you this +let _1 = ' ', _2 = ' ', _3 = ' ', _4 = ' '; +let x = ' ', y = ' '; + +// you write this + +// many +_1 = 'm', _2 = 'a', _3 = 'n', _4 = 'y'; +// men +x = _2, y = _4; +_2 = 'e', _4 = ' '; +// may +_3 = y, y = _2, _2 = x; +// melt +x = _3; +_2 = y, _3 = 'l', _4 = 't'; +// my +_2 = x, _3 = ' ', _4 = ' '; +// mind +_2 = 'i', _3 = 'n', _4 = 'd'; +``` + 1. [if fir trees ever fall](https://goo.gl/BCC6pz) +```js +// if fir trees ever fall + +// we give you this +let _1 = ' ', _2 = ' ', _3 = ' ', _4 = ' ', _5 = ' '; +let x = ' ', y = ' '; // to save extra values for later + +// you write this +// if +_1 = 'i', _2 = 'f'; +// fir +x = _2; +_2 = _1, _1 = x, _3 = 'r'; +// trees +_1 = 't', _2 = _3, _3 = 'e', _4 = _3, _5 = 's'; +// ever +y = _2; +_1 = _3, _2 = 'v', _4 = y, _5 = ' '; +// fall +_1 = x, _2 = 'a', _3 = 'l', _4 = _3, _5 = ' '; +``` ___ ___ From eb8a1a1792eea44b19a04fc2ed5188390a515be8 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sat, 29 Jun 2019 23:31:41 +0200 Subject: [PATCH 46/54] Update js-tracing-conditionals.md --- week-2/js-tracing-conditionals.md | 583 +++++++++++++++++++++++++++++- 1 file changed, 582 insertions(+), 1 deletion(-) diff --git a/week-2/js-tracing-conditionals.md b/week-2/js-tracing-conditionals.md index ffac81e..9ab3dad 100644 --- a/week-2/js-tracing-conditionals.md +++ b/week-2/js-tracing-conditionals.md @@ -1,2 +1,583 @@ > paste [this markdown of exercises](https://raw.githubusercontent.com/colevandersWands/conditional-exercises/master/tracing-paths.md) into this file and complete the exercises! -> references: [js.info conditionals](https://javascript.info/ifelse), [js.info logical operators](https://javascript.info/logical-operators), [js.info comparisons](https://javascript.info/comparison) [jl truthiness](https://github.com/janke-learning/truthiness) \ No newline at end of file +> references: [js.info conditionals](https://javascript.info/ifelse), [js.info logical operators](https://javascript.info/logical-operators), [js.info comparisons](https://javascript.info/comparison) [jl truthiness](https://github.com/janke-learning/truthiness) + +# Tracing Paths + +Tracing is when you can point to the lines of code that were executed in the order they were executed, tracking values as you go for understanding and debugging. These exercises ask you to refactor and log conditional statements for a dynamic trace of what happened as the code was executed. + +Learn this well, your debugging & problem solving future self will thank you! + +> PS. In these exercises and examples you will be dealing with some difficult expressions. Don't worry about understanding them perfectly, one of the goals for these exercises is to learn how to work with code you don't fully understand! Don't hesitate using some trial and error to find your tracing values. + +### Index +* tracings to study + * [if else](#if-else) + * [if else if else](#if-else-if-else) + * [nested if else](#nested-if-else) +* tracing exercises + * [one](#one) + * [two](#two) + * [three](#three) + * [four](#four) + * [five](#five) + * [six](#six) + * [seven](#seven) + * [eight](#eight) + +--- + +## if else + +[on pytut](http://www.pythontutor.com/live.html#code=const%20x%20%3D%20,%20y%20%3D%20%3B%20//%20test%20out%20a%20bunch%20of%20values%0A%0Aconst%20expression%20%3D%20!x%20%26%26%20y%3B%0Alet%20truthiness%20%3D%20Boolean%28expression%29%3B%0A%0Alet%20path%3B%0A%0Aif%20%28%20truthiness%20%29%20%7B%0A%20%20path%20%3D%20%22if%22%3B%0A%7D%20else%20%7B%0A%20%20path%20%3D%20%22else%22%3B%0A%7D%0A%0Atruthiness%20%2B%3D%20%22y%22%3B&cumulative=false&curInstr=7&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) + +__original code__ +```js +{ + const x = , y = ; // test out different values + + if (!x && y) { + // if body + } else { + // else body + } + +} +``` + +__refactored and traced__ +```js +{ + const x = , y = ; // test out a bunch of values + + const expression = !x && y; + const truthiness = Boolean(expression); + + let path; + + if ( truthiness ) { + path = "if"; + } else { + path = "else"; + } + + console.log("x: " + typeof x + ", " + x); + console.log("y: " + typeof y + ", " + y); + console.log("EXP: ", typeof expression+", "+expression+", "+truthiness+"y"); + console.log("PATH: ", path); +} +``` + + +__some tracings__ +```js +x: 1, y: 1, path: "else" +x: 0, y: 1, path: "if" +x: 1, y: 0, path: "else" +x: 0, y: 0, path: "else" +x: null, y: true, path: "if" +x: NaN, y: Infinity, path: "if" +x: undefined, y: "", path: "else" +``` + + + +[TOP](#conditional-exercises) + +--- + +## if else if else + +[on pytut](http://www.pythontutor.com/live.html#code=const%20x%20%3D%20,%20y%20%3D%20%3B%20//%20test%20out%20a%20bunch%20of%20values%0A%0Aconst%20expression_1%20%3D%20x%20%7C%7C%20y%3B%0Alet%20truthiness_1%20%3D%20Boolean%28expression_1%29%3B%0A%0Aconst%20expression_2%20%3D%20x%20!%3D%20y%3B%0Alet%20truthiness_2%20%3D%20Boolean%28expression_2%29%3B%0A%0Alet%20path%3B%0A%0Aif%20%28%20truthiness_1%20%29%20%7B%0A%20%20path%20%3D%20%22first%20if%22%3B%0A%7D%20else%20if%20%28%20truthiness_2%20%29%20%7B%0A%20%20path%20%3D%20%22second%20if%22%3B%0A%7D%20else%20%7B%0A%20%20path%20%3D%20%22else%22%3B%0A%7D%0A%0Atruthiness_1%20%2B%3D%20%22y%22%3B%0Atruthiness_2%20%2B%3D%20%22y%22%3B&cumulative=false&curInstr=11&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) + +__original code__ +```js +{ + const x = , y = ; // test out different values + + if (x || y) { + // first if body + } else if (x != y) { + // second if body + } else { + // else body + } + +} +``` + +__refactored and traced__ +```js +{ + const x = , y = ; // test out a bunch of values + + const expression_1 = x || y; + const truthiness_1 = Boolean(expression_1); + + const expression_2 = x != y; + const truthiness_2 = Boolean(expression_2); + + let path; + + if ( truthiness_1 ) { + path = "first if"; + } else if ( truthiness_2 ) { + path = "second if"; + } else { + path = "else"; + } + + console.log("x: " + typeof x + ", " + x); + console.log("y: " + typeof y + ", " + y); + console.log("FIRST EXP: ", typeof expression_1+", "+expression_1+", "+truthiness_1+"y"); + console.log("SECOND EXP: ", typeof expression_2+", "+expression_2+", "+truthiness_2+"y"); + console.log("PATH: ", path); +} +``` + +__some tracings__ +```js +x: true, y: true, path: "first if" +x: true, y: false, path: "first if" +x: false, y: true, path: "first if" +x: false, y: false, path: "else" +x: null, y: undefined, path: "else" +x: NaN, y: undefined, path: "second if" +x: NaN, y: null, path: "second if" +``` + + +[TOP](#conditional-exercises) + +--- + + +## nested if else + +[on pytut](http://www.pythontutor.com/live.html#code=const%20x%20%3D%20,%20y%20%3D%20%3B%20//%20test%20out%20a%20bunch%20of%20values%0A%0Aconst%20expression_1%20%3D%20!x%20%26%26%20y%3B%0Alet%20truthiness_1%20%3D%20Boolean%28expression_1%29%3B%0A%0Aconst%20expression_2%20%3D%20!!y%20%7C%7C%20%2Bx%3B%0Alet%20truthiness_2%20%3D%20Boolean%28expression_2%29%3B%0A%0Aconst%20third_expression%20%3D%20x%20-%20y%20%7C%7C%20y%20-%20x%3B%0Alet%20truthiness_3%20%3D%20Boolean%28third_expression%29%3B%0A%0Alet%20path%3B%0A%0Aif%20%28%20truthiness_1%20%29%20%7B%0A%20%20if%20%28%20truthiness_2%20%29%20%7B%0A%20%20%20%20path%20%3D%20%22if%20if%22%3B%0A%20%20%7D%20else%20%7B%0A%20%20%20%20path%20%3D%20%22if%20else%22%3B%0A%20%20%7D%0A%7D%20else%20%7B%0A%20%20if%20%28%20truthiness_3%20%29%20%7B%0A%20%20%20%20path%20%3D%20%22else%20if%22%3B%0A%20%20%7D%20else%20%7B%0A%20%20%20%20path%20%3D%20%22else%20else%22%3B%0A%20%20%7D%0A%7D%0A%0Atruthiness_1%20%2B%3D%20%22y%22%3B%0Atruthiness_2%20%2B%3D%20%22y%22%3B%0Atruthiness_3%20%2B%3D%20%22y%22%3B&cumulative=false&curInstr=1&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) + +__original code__ +```js +{ + const x = , y = ; // test out different values + + if (!x && y) { + if (!!y || +x) { + // if if body + } else { + // if else body + } + } else { + if (x - y || y - x) { + // else if body + } else { + // else else body + } + } + +} +``` + +__refactored and traced__ +```js +{ + const x = , y = ; // test out a bunch of values + + const expression_1 = !x && y; + const truthiness_1 = Boolean(expression_1); + + const expression_2 = !!y || +x; + const truthiness_2 = Boolean(expression_2); + + const expression_3 = x - y || y - x; + const truthiness_3 = Boolean(expression_3); + + let path; + + if ( truthiness_1 ) { + if ( truthiness_2 ) { + path = "if if"; + } else { + path = "if else"; + } + } else { + if ( truthiness_3 ) { + path = "else if"; + } else { + path = "else else"; + } + } + + console.log("x: " + typeof x + ", " + x); + console.log("y: " + typeof y + ", " + y); + console.log("FIRST EXP: ", typeof expression_1+", "+expression_1+", "+truthiness_1+"y"); + console.log("SECOND EXP: ", typeof expression_2+", "+expression_2+", "+truthiness_2+"y"); + console.log("THIRD EXP: ", typeof expression_3+", "+expression_3+", "+truthiness_3+"y"); + console.log("PATH: ", path); +} +``` + + +__some tracings__ +```js +x: null, y: null, path: "else else" +x: false, y: null, path: "else else" +x: false, y: true, path: "if if" +x: NaN, y: 1, path: "if if" +x: Infinity, y: "", path: "else if" +x: 1, y: "", path: "else if" +// I think "if else" is unreachable! +``` + + + +[TOP](#conditional-exercises) + +--- +--- + +## One + +[on pytut](http://www.pythontutor.com/live.html#code=const%20x%20%3D%20%3B%20//%20try%20a%20bunch%20of%20values!%0A%0Aif%20%28x%20%3D%3D%3D%20%2Bx%20%7C%7C%20x%20%3D%3D%3D%20!x%29%20%7B%0A%0A%7D%20else%20%7B%0A%0A%7D&cumulative=false&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) + +__original code__ +```js +{ + const x = ; // try a bunch of values! + + if (x === +x || x === !x) { + + } else { + + } + +} +``` + +__refactored and traced__ +```js +{ + +} +``` + +__some tracings__ +```js +// find 6+ tracing values +// try to find at least 1 set for each path +// or can you? some paths are unreachable! +``` + + +[TOP](#tracing-paths) + +--- + +## Two + + +[on pytut](http://www.pythontutor.com/live.html#code=const%20x%20%3D%20%3B%20//%20try%20a%20bunch%20of%20values!%0A%0Aif%20%28x%20%3D%3D%3D%20%2Bx%29%20%7B%0A%0A%7D%20else%20if%20%28x%20%3D%3D%3D%20!x%29%20%7B%0A%0A%7D%20else%20%7B%0A%0A%7D&cumulative=false&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) + +__original code__ +```js +{ + const x = ; // try a bunch of values! + + if (x === +x) { + + } else if (x === !x) { + + } else { + + } + +} +``` + +__refactored and traced__ +```js +{ + +} +``` + +__some tracings__ +```js +// find 6+ tracing values +// try to find at least 1 set for each path +// or can you? some paths are unreachable! +``` + + +[TOP](#tracing-paths) + +--- + +## Three + + +[on pytut](http://www.pythontutor.com/live.html#code=const%20x%20%3D%20,%20y%20%3D%20%3B%20//%20try%20a%20bunch%20of%20values!%0A%0Aif%20%28x%20%3D%3D%20%2Bx%29%20%7B%0A%0A%7D%20%0Aif%20%28x%20%3D%3D%20!!x%29%20%7B%0A%0A%7D%20else%20%7B%0A%0A%7D%0A&cumulative=false&curInstr=1&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) + +__original code__ +```js +{ + const x = , y = ; // try a bunch of values! + + if (x == +x) { + + } + if (x == !!x) { + + } else { + + } + +} +``` + +__refactored and traced__ +```js +{ + +} +``` + +__some tracings__ +```js +// find 6+ tracing values +// try to find at least 1 set for each path +// or can you? some paths are unreachable! +``` + + +[TOP](#tracing-paths) + +--- + +## Four + + +[on pytut](http://www.pythontutor.com/live.html#code=const%20x%20%3D%20,%20y%20%3D%20%3B%20//%20try%20a%20bunch%20of%20values!%0A%0Aif%20%28x%29%20%7B%0A%20%20if%20%28y%29%20%7B%0A%0A%20%20%7D%20else%20%7B%0A%20%20%20%20%0A%20%20%7D%0A%7D%20else%20%7B%0A%20%20if%20%28y%29%20%7B%0A%0A%20%20%7D%20else%20%7B%0A%20%20%20%20%0A%20%20%7D%0A%7D%0A&cumulative=false&curInstr=1&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) + +__original code__ +```js +{ + const x = , y = ; // try a bunch of values! + + if (x) { + if (y) { + + } else { + + } + } else { + if (y) { + + } else { + + } + } + +} +``` + +__refactored and traced__ +```js +{ + +} +``` + +__some tracings__ +```js +// find 6+ tracing values +// try to find at least 1 set for each path +// or can you? some paths are unreachable! +``` + + +[TOP](#tracing-paths) + +--- + +## Five + + +[on pytut](http://www.pythontutor.com/live.html#code=const%20x%20%3D%20,%20y%20%3D%20%3B%20//%20try%20a%20bunch%20of%20values!%0A%0Aif%20%28%20!x%20%7C%7C%20!y%20%29%20%7B%0A%0A%7D%20else%20if%20%28%20!%28x%20%26%26%20y%29%20%29%20%7B%0A%0A%7D%20else%20%7B%20%0A%0A%7D&cumulative=false&curInstr=1&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) + +__original code__ +```js +{ + const x = , y = ; // try a bunch of values! + + if ( !x || !y ) { + + } else if ( !(x && y) ) { + + } else { + + } + +} +``` + +__refactored and traced__ +```js +{ + +} +``` + +__some tracings__ +```js +// find 6+ tracing values +// try to find at least 1 set for each path +// or can you? some paths are unreachable! +``` + +> [De Morgan's Law](https://www.youtube.com/watch?v=tKnS3s8fOu4) + + + +[TOP](#tracing-paths) + +--- + +## Six + + +[on pytut](http://www.pythontutor.com/live.html#code=const%20x%20%3D%20,%20y%20%3D%20%3B%20//%20try%20a%20bunch%20of%20values!%0A%0Aif%20%28x%29%20%7B%0A%20%20if%20%28y%29%20%7B%0A%0A%20%20%7D%20else%20%7B%0A%20%20%20%20%0A%20%20%7D%0A%7D%20else%20%7B%0A%20%20if%20%28x%29%20%7B%0A%0A%20%20%7D%20else%20%7B%0A%20%20%20%20%0A%20%20%7D%0A%7D%20%20&cumulative=false&curInstr=1&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) + +__original code__ +```js +{ + const x = , y = ; // try a bunch of values! + + if (x) { + if (y) { + + } else { + + } + } else { + if (x) { + + } else { + + } + } + +} +``` + +__refactored and traced__ +```js +{ + // can you remove on conditional statement without changing the bahavior? +} +``` + +__some tracings__ +```js +// find 6+ tracing values +// try to find at least 1 set for each path +// or can you? some paths are unreachable! +``` + + +[TOP](#tracing-paths) + +--- + +## Seven + + + +[on pytut](http://www.pythontutor.com/live.html#code=const%20x%20%3D%20,%20y%20%3D%20%3B%20//%20try%20a%20bunch%20of%20values!%0A%0Aif%20%28x%20%7C%7C%20y%29%20%7B%0A%20%20if%20%28x%20!%3D%3D%20y%29%20%7B%0A%0A%20%20%7D%0A%7D%20else%20if%20%28x%20%26%26%20y%29%20%7B%0A%20%20if%20%28x%20!%3D%3D%20y%29%20%7B%0A%20%20%20%20%0A%20%20%7D%0A%7D%20else%20%7B%0A%20%20if%20%28x%20!%3D%3D%20y%29%20%7B%0A%20%20%20%20%0A%20%20%7D%0A%7D&cumulative=false&curInstr=1&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) + +__original code__ +```js +{ + const x = , y = ; // try a bunch of values! + + if (x || y) { + if (x !== y) { + + } + } else if (x && y) { + if (x !== y) { + + } + } else { + if (x !== y) { + + } + } + +} +``` + +__refactored and traced__ +```js +{ + +} +``` + +__some tracings__ +```js +// find 6+ tracing values +// try to find at least 1 set for each path +// or can you? some paths are unreachable! +``` + + +[TOP](#tracing-paths) + +--- + + +## Eight + + + +[on pytut](http://www.pythontutor.com/live.html#code=const%20x%20%3D%20,%20y%20%3D%20%3B%20//%20try%20a%20bunch%20of%20values!%0A%0Aif%20%28x%20%7C%7C%20y%29%20%7B%0A%20%20if%20%28x%20!%3D%3D%20y%29%20%7B%0A%0A%20%20%7D%0A%7D%20else%20if%20%28x%20%26%26%20y%29%20%7B%0A%20%20if%20%28x%20!%3D%3D%20y%29%20%7B%0A%20%20%20%20%0A%20%20%7D%0A%7D%20else%20%7B%0A%20%20if%20%28x%20!%3D%3D%20y%29%20%7B%0A%20%20%20%20%0A%20%20%7D%0A%7D&cumulative=false&curInstr=1&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) + +__original code__ +```js +{ + const x = , y = ; // try a bunch of values! + + if (x !== y) { + if (x || y) { + + } else if (x && y) { + + } else { + + } + } + +} +``` + +__refactored and traced__ +```js +{ + +} +``` + +__some tracings__ +```js +// find 6+ tracing values +// try to find at least 1 set for each path +// or can you? some paths are unreachable! +``` + + +[TOP](#tracing-paths) + + +___ +___ +### Janke Learning From f9e8e158ed89399db54bd6488669e29c4f9845f5 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sat, 29 Jun 2019 23:32:45 +0200 Subject: [PATCH 47/54] Update jl-loop-refactors.md --- week-2/jl-loop-refactors.md | 532 ++++++++++++++++++++++++++++++++++++ 1 file changed, 532 insertions(+) diff --git a/week-2/jl-loop-refactors.md b/week-2/jl-loop-refactors.md index d55b4e5..69c100f 100644 --- a/week-2/jl-loop-refactors.md +++ b/week-2/jl-loop-refactors.md @@ -1 +1,533 @@ > paste [this markdown of exercises](https://raw.githubusercontent.com/colevandersWands/loop-refactors/master/README.md) into this file and complete the exercises! + +# Loop Refactors + +At it's simplist _refactoring_ is rewriting code while keeping it's original behavior. In the exercises and examples below you can test your refactors by pasting & running the original code in the console, then pasting & running your refactor in console. If both snippets log the exact same messages you have successfully completed the exercise! + +Learning to refactor loops is one of the best ways to learn how they work without struggling to solve code challenges. As you practice shifting between ```while``` and ```for``` loops you'll begin to recognize the general principles of iteration: +1. initial value +1. advancing operation +1. end condition + +Learning to identify these steps and rewrite loops in different ways will help you with debugging, problem solving & understanding other people's code. + +### INDEX +* [learning objectives](#learning-objectives) +* completed examples + * [for](#for) + * [while](#while) + * [do-while](#do-while) +* exercises + * [for to while (4)](#for-to-while) + * [while to for (4)](#while-to-for) +* [for or while?](#for-or-while) +* [resources](#resources) + + +--- + +## Learning Objectives + +* mastering JS loop syntax +* identifying the 3 key components of an iteration +* shifting easily between loop types +* separating the __structure__ of written code from the __behavior__ of program data + +[TOP](#loop-refactors) + +--- + +## Completed Examples + +### For + + +__[From w3schools](https://www.w3schools.com/js/js_loop_for.asp)__: +> The for loop has the following syntax: +``` +for (statement 1; statement 2; statement 3) { + code block to be executed +} +``` +> Statement 1 is executed (one time) before the execution of the code block. +> Statement 2 defines the condition for executing the code block. +> Statement 3 is executed (every time) after the code block has been executed. + +* [study ```for``` on pytut](http://www.pythontutor.com/live.html#code=//%20for%20loop%0Afor%20%28%20let%20stepper%20%3D%200%3B%20stepper%20%3C%204%3B%20stepper%2B%2B%20%29%20%7B%0A%20%20//%20body%0A%7D%0A%0A%0A&cumulative=false&curInstr=9&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +* [```for``` loop parsonized](https://janke-learning.github.io/parsonizer/?snippet=%2F%2F%20for%20loop%0Afor%20%28%20let%20stepper%20%3D%200%3B%20stepper%20%3C%204%3B%20stepper%2B%2B%20%29%20%7B%0A%20%20%2F%2F%20body%0A%7D%0A%0A%0A) +* [block scope in for loops](http://www.pythontutor.com/live.html#code=for%20%28var%20x%20%3D%200%3B%20x%20%3C%202%3B%20x%2B%2B%29%20%7B%0A%20%20console.log%28%22x%3A%20%22,%20x%29%3B%0A%7D%0A%0Afor%20%28let%20y%20%3D%200%3B%20y%20%3C%202%3B%20y%2B%2B%29%20%7B%0A%20%20console.log%28%22y%3A%20%22,%20y%29%3B%0A%7D&cumulative=false&curInstr=0&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) - JS does an unexpected thing by creating 2 blocks while stepping through the loop. for now just know that this happens, you can understand why later when you learn about closure. + +_original for loop_ +```js +{ + let result = ''; + console.log("initial result: ", result); + + for ( let stepper = 0; stepper < 3; stepper++ ) { + result += stepper; + console.log(result); + } + + console.log("final result: ", result); +} +``` + +_refactored to while_ +```js +{ + let result = ''; + console.log("initial result: ", result); + + let stepper = 0; + while ( stepper < 3 ) { + result += stepper; + console.log(result); + stepper++; + } + + console.log("final result: ", result); +} +``` + +_refactored to do-while_ +```js +/* + it is not possible to refactor for loops into do-while loops + for loops might never execute their body + do-while loops will always execute their body at least once +*/ +``` + + +[TOP](#loop-refactors) + +--- + +### While + +* [```while``` on pytut](http://www.pythontutor.com/live.html#code=//%20while%20loop%0Alet%20stepper%20%3D%200%3B%0Awhile%20%28%20%20stepper%20%3C%204%20%29%20%7B%0A%20%20//%20body%0A%20%20stepper%2B%2B%3B%3B%0A%7D%0A%0A%0A&cumulative=false&curInstr=10&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +* [```while``` parsonized](https://janke-learning.github.io/parsonizer/?snippet=%2F%2F%20while%20loop%0Alet%20stepper%20%3D%200%3B%0Awhile%20%28stepper%20%3C%204%29%20%7B%0A%20%20%2F%2F%20body%0A%20%20stepper%2B%2B%3B%0A%7D%0A%0A%0A) + +_original while loop_ +```js +{ + let result = ''; + console.log("initial result: ", result); + + let stepper = 0; + while ( stepper < 3 ) { + result += stepper; + console.log(result); + stepper++; + } + + console.log("final result: ", result); +} +``` + +_refactored to for loop_ +```js +{ + let result = ''; + console.log("initial result: ", result); + + for ( let stepper = 0; stepper < 3; stepper++ ) { + result += stepper; + console.log(result); + } + + console.log("final result: ", result); +} +``` + +_refactored to do-while_ +```js +/* + it is not possible to refactor while loops into do-while loops + while loops might never execute their body + do-while loops will always execute their body at least once +*/ +``` + + +[TOP](#loop-refactors) + +--- + +### Do-While + +* [```do-while``` on pytut](http://www.pythontutor.com/live.html#code=//%20do-while%20loop%0Alet%20stepper%20%3D%200%3B%0Ado%20%7B%0A%20%20//%20body%0A%20%20stepper%2B%2B%3B%0A%7D%20while%20%28stepper%20%3C%204%29%3B%0A%0A%0A&cumulative=false&curInstr=9&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +* [```do-while``` parsonized](https://janke-learning.github.io/parsonizer/?snippet=%2F%2F%20do-while%20loop%0Alet%20stepper%20%3D%200%3B%0Ado%20%7B%0A%20%20%2F%2F%20body%0A%20%20stepper%2B%2B%3B%0A%7D%20while%20%28stepper%20%3C%204%29%3B%0A%0A%0A) + +_original do-while_ +```js +{ + let result = ''; + console.log("initial result: ", result); + + let stepper = 0; + do { + result += stepper; + console.log(result); + stepper++; + } while (stepper < 3); + + console.log("final result: ", result); +} +``` + +_refactored to while_ +```js +{ + let result = ''; + console.log("initial result: ", result); + + let stepper = 0; + + // do + result += stepper; + console.log(result); + stepper++; + + while (stepper < 3) { + result += stepper; + console.log(result); + stepper++; + } + + console.log("final result: ", result); +} +``` + +_refactored to for_ +```js +{ + let result = ''; + console.log("initial result: ", result); + + let stepper = 0; + + // do + result += stepper; + console.log(result); + + for ( stepper = 1; stepper < 3; stepper++ ) { + result += stepper; + console.log(result); + } + + console.log("final result: ", result); +} +``` + + +[TOP](#loop-refactors) + +--- + + +## Exercises + + +### For to While + +### for -> while 1 + +[practice on pytut](http://www.pythontutor.com/live.html#code=%7B%0A%20%20let%20result%20%3D%200%3B%0A%20%20for%20%28let%20i%20%3D%201%3B%20i%20%3C%2010%3B%20i%20%2B%3D%20result%29%20%7B%0A%20%20%20%20result%20%2B%3D%20i%3B%0A%20%20%20%20console.log%28i%29%3B%0A%20%20%7D%0A%7D%0A//%20refactor%20to%20while%20loop%0A%0Awhile%20%28%29%20%7B%0A%20%20%0A%7D&cumulative=false&curInstr=15&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) + +_original for loop_ +```js +{ + let result = 0; + for (let i = 1; i < 10; i += result) { + result += i; + console.log(i); + } +} +``` + +_refactor to while_ +```js +{ + while () { + + } +} +``` + +[parsonized solution](https://janke-learning.github.io/parsonizer/?snippet=let%20result%20%3D%200%3B%0Alet%20i%20%3D%201%3B%0Awhile%20%28%20i%20%3C%2010%20%29%20%7B%0A%20%20result%20%2B%3D%20i%3B%0A%20%20console.log%28i%29%3B%0A%20%20i%20%2B%3D%20result%3B%0A%7D) + +--- + +### for -> while 2 + +[practice on pytut](http://www.pythontutor.com/live.html#code=for%20%28let%20i%20%3D%20-3%3B%20i%20%3D%3D%3D%2010%20%7C%7C%20i%20%3C%2020%3B%20i%20*%3D%20-1.5%29%20%7B%0A%20%20console.log%28i%29%3B%0A%7D%0A%0A//%20refactor%20to%20while%20loop%0A%0Awhile%20%28%29%20%7B%0A%20%20%0A%7D&cumulative=false&curInstr=0&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) + +_original for loop_ +```js +{ + for (let i = -3; i === 10 || i < 20; i *= -1.5) { + console.log(i); + } +} +``` + +_refactor to while_ +```js +{ + while () { + + } +} +``` + +[parsonized solution](https://janke-learning.github.io/parsonizer/?snippet=let%20i%20%3D%20-3%3B%0Awhile%20%28i%20%3D%3D%3D%2010%20%7C%7C%20i%20%3C%2020%29%20%7B%0A%20%20console.log%28i%29%3B%0A%20%20i%20*%3D%20-1.5%3B%0A%7D) + +--- + +### for -> while 3 + +[practice on pytut](http://www.pythontutor.com/live.html#code=%7B%0A%20%20for%20%28let%20i%20%3D%200,%20j%20%3D%2010%3B%20i%20!%3D%3D%20j%3B%20i%2B%2B,%20j--%29%20%7B%0A%20%20%20%20console.log%28%22i%3A%20%22,%20i%29%3B%0A%20%20%20%20console.log%28%22j%3A%20%22,%20j%29%3B%0A%20%20%20%20console.log%28%22i%20%2B%20j%3A%20%22,%20i%20%2B%20j%29%3B%0A%20%20%7D%0A%7D%0A%0A//%20refactor%20to%20while%20loop%0A%0Awhile%20%28%29%20%7B%0A%20%20%0A%7D&cumulative=false&curInstr=0&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) + +_original for loop_ +```js +{ + for (let i = 0, j = 10; i !== j; i++, j--) { + console.log("i: ", i); + console.log("j: ", j); + console.log("i + j: ", i + j); + } +} +``` + +_refactor to while_ +```js +{ + while () { + + } +} +``` + +[parsonized solution](https://janke-learning.github.io/parsonizer/?snippet=let%20i%20%3D%200%2C%20j%20%3D%2010%3B%0Awhile%20%28%20i%20!%3D%3D%20j%20%29%20%7B%0A%20%20console.log%28%22i%3A%20%22%2C%20i%29%3B%0A%20%20console.log%28%22j%3A%20%22%2C%20j%29%3B%0A%20%20console.log%28%22i%20%2B%20j%3A%20%22%2C%20i%20%2B%20j%29%3B%0A%20%20i%2B%2B%2C%20j--%3B%0A%7D) + +--- + + +### for -> while 4 + +> The logic in this loop is difficult to understand; The goal of these refactors is to recognize the __form__ of your code without worrying about the content. You can easily complete this exercise without understanding what's happening! This is the power of learning reliable refactoring patterns + +[practice on pytut](http://www.pythontutor.com/live.html#code=%7B%0A%20%20const%20mixitup%20%3D%20false%3B%0A%20%20let%20val%3B%0A%20%20for%20%28let%20i%20%3D%20''%3B%20!!i%20!%3D%3D%20true%20%3B%20i%20%3D%20%2Bval%29%20%7B%0A%20%20%20%20val%20%3D%20!i%20%7C%7C%20mixitup%20*%20i%3B%0A%20%20%20%20console.log%28!!val%29%3B%0A%20%20%7D%0A%7D%0A%0A//%20refactor%20to%20while%20loop%0A%0Awhile%20%28%29%20%7B%0A%20%20%0A%7D&cumulative=false&curInstr=0&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) + +_original for loop_ +```js +{ + const mixitup = false; + let val; + for (let i = ''; !!i !== true ; i = +val) { + val = !i || mixitup * i; + console.log(!!val); + } +} +``` + +_refactor to while_ +```js +{ + while () { + + } +} +``` + +[parsonized solution](https://janke-learning.github.io/parsonizer/?snippet=const%20mixitup%20%3D%20false%3B%0Alet%20val%3B%0Alet%20i%20%3D%20''%3B%0Awhile%20%28%20!!i%20!%3D%3D%20true%20%29%20%7B%0A%20%20val%20%3D%20!i%20%7C%7C%20mixitup%20*%20i%3B%0A%20%20console.log%28!!val%29%3B%0A%20%20i%20%3D%20%2Bval%3B%0A%7D) + + + +[TOP](#loop-refactors) + +--- + +### While to For + +### while -> for 1 + +[practice on pytut](http://www.pythontutor.com/live.html#code=let%20x%20%3D%209%3B%0Awhile%20%28x%20%3E%202%29%20%7B%0A%20%20console.log%28x%20*%203%29%3B%0A%20%20x--%3B%0A%7D%0A%0A//%20refactor%20to%20for%20loop%0A%0Afor%20%28%20%3B%20%3B%20%29%20%7B%0A%20%20%0A%7D&cumulative=false&curInstr=0&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +[parsonized while loop](https://janke-learning.github.io/parsonizer/?snippet=let%20x%20%3D%209%3B%0Awhile%20%28x%20%3E%202%29%20%7B%0A%20%20console.log%28x%20*%203%29%3B%0A%20%20x--%3B%0A%7D) + +_original while loop_ +```js +{ + let x = 9; + while (x > 2) { + console.log(x * 3); + x--; + } +} +``` + +_refactor to for_ +```js +{ + for ( ; ; ) { + + } +} +``` + +--- + +### while -> for 2 + +> the [```++``` operator](https://github.com/janke-learning/expanding/blob/master/worked-in-place-operators.md) does two things in one step, it increments it's variable and returns a value. When used in a while loop condition it does the work of the second & third parts of a for loop statement. + +[practice on pytut](http://www.pythontutor.com/live.html#code=let%20x%20%3D%209%3B%0Awhile%20%28x%2B%2B%20%3C%2020%29%20%7B%0A%20%20console.log%28x%29%3B%0A%7D%0A%0A//%20refactor%20to%20for%20loop%0A%0Afor%20%28%20%3B%20%3B%20/*%20nothing%20goes%20here%20*/%20%29%20%7B%0A%20%20%0A%7D&cumulative=false&curInstr=0&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) + + +_original while loop_ +```js +{ + let x = 9; + while (x++ < 20) { + console.log(x); + } +} +``` + +_refactor to for_ +```js +{ + for ( ; ; /* nothing goes here */ ) { + + } +} +``` + + +--- + +### while -> for 3 + +> for this refactor, write your for loop without using [```++``` operator](https://github.com/janke-learning/expanding/blob/master/worked-in-place-operators.md) in the condition check. we've started the refactor so you can get the idea + +[practice on pytut](http://www.pythontutor.com/live.html#code=/*%20%0Afor%20this%20refactor,%20write%20your%20for%20loop%20without%20using%20%0A%20%20%60%60%60%2B%2B%60%60%60%20in%20the%20condition%20check.%20%0A%20%20we've%20started%20the%20refactor%20so%20you%20can%20get%20the%20idea%0A*/%0A%0Alet%20x%20%3D%209%3B%0Awhile%20%28x%2B%2B%20%3C%2020%29%20%7B%0A%20%20console.log%28x%29%3B%0A%7D%0A%0A//%20refactor%20to%20for%20loop%0A%0Afor%20%28%20%3B%20x%20%3C%20%3B%20x%20%2B%3D%201%20%29%20%7B%0A%20%20%0A%7D&cumulative=false&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) + + +_original while loop_ +```js +{ + let x = 9; + while (x++ < 20) { + console.log(x); + } +} +``` + +_refactor to for_ +```js +{ + for ( ; x < ; x += 1 ) { + + } +} +``` + +--- + +### while -> for 4 + +> for this refactor, write your for loop without using [```++``` operator](https://github.com/janke-learning/expanding/blob/master/worked-in-place-operators.md) in the condition check. we're not starting this one for you + +[practice on pytut](http://www.pythontutor.com/live.html#code=/*%20%0Afor%20this%20refactor,%20write%20your%20for%20loop%20without%20using%20%0A%20%20%60%60%60%2B%2B%60%60%60%20in%20the%20condition%20check.%20%0A%20%20we're%20not%20starting%20this%20one%20for%20you%0A*/%0A%0Alet%20x%20%3D%209%3B%0Awhile%20%28%2B%2Bx%20%3C%2020%29%20%7B%0A%20%20console.log%28x%29%3B%0A%7D%0A%0A//%20refactor%20to%20for%20loop%0A%0Afor%20%28%20%3B%20%3B%20%29%20%7B%0A%20%20%0A%7D&cumulative=false&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) + + +_original while loop_ +```js +{ + let x = 9; + while (++x < 20) { + console.log(x); + } +} +``` + +_refactor to for_ +```js +{ + for ( ; ; ) { + + } +} +``` + +[TOP](#loop-refactors) + +--- + +## For or While + + +__[From StackOverflow](https://stackoverflow.com/questions/8109509/in-which-situations-should-i-use-while-loops-instead-for-loops-in-javascript#)__ +> (This will soon get closed as too subjective, or moved to another forum, but anyway...) +> Obviously any for loop can easily be rewritten using "while". But given the syntax of: + +``` +for ([initialization]; [condition]; [final-expression]) +``` +> that is used by the for loop it is obviously very well suited to situations where there is some simple initialisation and a simple end-of-iteration update or counter increment. Putting all of the loop control logic right there in the loop's opening statement makes it easy to see at a glance what makes the loop tick. +> With a while loop the end-of-iteration processing generally has to happen at the bottom of the loop's body, so it's harder to see at a glance how the loop works, but also that is much more suited to the situation where you have to perform a number of calculations to decide whether to keep the loop going. +> Of course you can shove multiple statements in a for loop initialisation or final-expression by separating them with commas, but if that is anything more complicated than i++, j++, k-- it quickly gets too messy for my taste and a while loop would be a better choice. +> +> -- nnnnnn + +__For__ loops in JavaScript could be considered [syntactic sugar](https://www.quora.com/What-is-syntactic-sugar-in-programming-languages), meaning you can replicate their exact behavior using simpler language features. + +--- + + +## Resources + + +__study tools__ +* [python tutor for JS](http://www.pythontutor.com/live.html#code=&cumulative=false&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) +* [parsonizer](https://janke-learning.org/parsonizer) + +__control-flow visualization__ +* (neither of these tools are perfect. if you find them confusing that's just fine, if they help you all the better!) +* [code2flow](https://code2flow.com/app) +* [flowviz](https://janke-learning.org/flowviz) + +__while loops__ +* [javascript.info](https://javascript.info/while-for#the-while-loop) +* [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/while) +* [Video](https://www.youtube.com/watch?v=PpbFyLTtpWI) +* [use while instead of for](https://teamtreehouse.com/community/why-use-while-loop-instead-of-for) + +__for loops__ +* [MDN on For Loops](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for) +* [Video + Article](https://www.kirupa.com/html5/loops_in_javascript.htm) +* [StackOverflow](https://stackoverflow.com/questions/39969145/while-loops-vs-for-loops-in-javascript) +* [block scope in for loops](http://www.pythontutor.com/live.html#code=for%20%28var%20x%20%3D%200%3B%20x%20%3C%202%3B%20x%2B%2B%29%20%7B%0A%20%20console.log%28%22x%3A%20%22,%20x%29%3B%0A%7D%0A%0Afor%20%28let%20y%20%3D%200%3B%20y%20%3C%202%3B%20y%2B%2B%29%20%7B%0A%20%20console.log%28%22y%3A%20%22,%20y%29%3B%0A%7D&cumulative=false&curInstr=0&heapPrimitives=nevernest&mode=display&origin=opt-live.js&py=js&rawInputLstJSON=%5B%5D&textReferences=false) - JS does an unexpected thing by creating 2 blocks while stepping through the loop. for now just know that this happens, you can understand why later when you learn about closure. + +__do-while loops__ +* [javascript.info](https://javascript.info/while-for#the-do-while-loop) +* [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/do...while) +* [do vs. while: Tutorial GateWay](https://www.tutorialgateway.org/difference-between-javascript-while-and-do-while-loop/) +* [do vs. while: Digital Ocean](https://www.digitalocean.com/community/tutorials/using-while-and-do-while-loops-in-javascript) + + +__loops__ +* [So many of them!](https://www.hackreactor.com/blog/javascript-loops-difference-between-types-while-for-in) +* [interactive examples](http://www.dofactory.com/tutorial/javascript-loops) + + + + + + +[TOP](#loop-refactors) + +___ +___ +### Janke Learning From b8c13d229cb4bcdf68f8fd641a60df1af04a5029 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sun, 30 Jun 2019 00:05:27 +0200 Subject: [PATCH 48/54] Update js-tracing-conditionals.md --- week-2/js-tracing-conditionals.md | 90 +++++++++++++++++++++++++++---- 1 file changed, 81 insertions(+), 9 deletions(-) diff --git a/week-2/js-tracing-conditionals.md b/week-2/js-tracing-conditionals.md index 9ab3dad..d402170 100644 --- a/week-2/js-tracing-conditionals.md +++ b/week-2/js-tracing-conditionals.md @@ -256,15 +256,35 @@ __original code__ __refactored and traced__ ```js { + const x = ; // test out a bunch of values + const expression = x === +x || x === !x; + const truthiness = Boolean(expression); + + let path; + + if ( truthiness ) { + path = "if"; + } else { + path = "else"; + } + + console.log("x: " + typeof x + ", " + x); + console.log("EXP: ", typeof expression+", "+expression); + console.log("PATH: ", path); } + ``` __some tracings__ ```js -// find 6+ tracing values -// try to find at least 1 set for each path -// or can you? some paths are unreachable! +x: 5, path: else +x: 'ramzi', path: else +x: null, path: else +x: false, path: else +x: NaN, path: else +x: undefined, path: else +//So I think "IF" is unreachable! ``` @@ -296,15 +316,41 @@ __original code__ __refactored and traced__ ```js { +const x = ; // test out a bunch of values + + const expression_1 = x === +x; + const truthiness_1 = Boolean(expression_1); + + const expression_2 = x === !x; + const truthiness_2 = Boolean(expression_2); + + let path; + + if ( truthiness_1 ) { + path = "if"; + } else if ( truthiness_2 ) { + path = "else if"; + } else { + path = "else"; + } + console.log("x: " + typeof x + ", " + x); + console.log("FIRST EXP: ", typeof expression_1+", "+expression_1); + console.log("SECOND EXP: ", typeof expression_2+", "+expression_2); + console.log("PATH: ", path); } ``` __some tracings__ ```js -// find 6+ tracing values -// try to find at least 1 set for each path -// or can you? some paths are unreachable! +x: 5, path: if +x: null, path: else +x: 'ramzi', path: else +x: NaN, path: else +x: true, path: else +x: false, path: else +x: undefined, path: else +// the "else if" is unreachable! ``` @@ -337,15 +383,41 @@ __original code__ __refactored and traced__ ```js { + const x = , y = ; // test out a bunch of values + + const expression_1 = x == +x; + const truthiness_1 = Boolean(expression_1); + + const expression_2 = x == !!x; + const truthiness_2 = Boolean(expression_2); + + let path; + + if ( truthiness_1 ) { + path = "first if"; + } if ( truthiness_2 ) { + path = "second if"; + } else { + path = "else"; + } + console.log("x: " + typeof x + ", " + x); + console.log("y: " + typeof y + ", " + y); + console.log("FIRST EXP: ", typeof expression_1+", "+expression_1+", "+truthiness_1+"y"); + console.log("SECOND EXP: ", typeof expression_2+", "+expression_2+", "+truthiness_2+"y"); + console.log("PATH: ", path); } ``` __some tracings__ ```js -// find 6+ tracing values -// try to find at least 1 set for each path -// or can you? some paths are unreachable! +x: 5, y: 6, path: else +x: 0, y: 0, path: second if +x: null, y: 4, path: else +x: true, y: 3, path: second if +x: false, y: NaN, path: second if +x: 0, y: 1, path: second if + ``` From 660ec7c301641b57a10cdc2b3c122f39697f1ee5 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sun, 30 Jun 2019 00:14:47 +0200 Subject: [PATCH 49/54] Update jsinfo-objects.md --- week-2/jsinfo-objects.md | 57 ++++++++++++++++++++++++++++++++++++++++ 1 file changed, 57 insertions(+) diff --git a/week-2/jsinfo-objects.md b/week-2/jsinfo-objects.md index 7f271be..9df6ea2 100644 --- a/week-2/jsinfo-objects.md +++ b/week-2/jsinfo-objects.md @@ -2,3 +2,60 @@ > Don't be afraid of peeking at the solutions! Just be sure you study them well +## 1. Hello, object +```js +let user = {}; +user.name = "John"; +user.surname = "Smith"; +user.name = "Pete"; +delete user.name; +``` + +## 1. Check for emptiness +```js +function isEmpty(obj) { + for (let key in obj) { + // if the loop has started, there is a property + return false; + } + return true; +} +``` + +## 1. Constant objects? +```js +const user = { + name: "John" +}; + +// works +user.name = "Pete"; + +// error +user = 123; +``` + +## 1. Sum object properties +```js +let salaries = { + John: 100, + Ann: 160, + Pete: 130 +}; + +let sum = 0; +for (let key in salaries) { + sum += salaries[key]; +} +``` + +## 1. Multiply numeric properties by 2 +```js +function multiplyNumeric(obj) { + for (let key in obj) { + if (typeof obj[key] == 'number') { + obj[key] *= 2; + } + } +} +``` From b70fd44f95754c4df6dfc5b22310ce34154c4983 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sun, 30 Jun 2019 00:15:09 +0200 Subject: [PATCH 50/54] Update jsinfo-objects.md --- week-2/jsinfo-objects.md | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/week-2/jsinfo-objects.md b/week-2/jsinfo-objects.md index 9df6ea2..6f1003a 100644 --- a/week-2/jsinfo-objects.md +++ b/week-2/jsinfo-objects.md @@ -11,7 +11,7 @@ user.name = "Pete"; delete user.name; ``` -## 1. Check for emptiness +## 2. Check for emptiness ```js function isEmpty(obj) { for (let key in obj) { @@ -22,7 +22,7 @@ function isEmpty(obj) { } ``` -## 1. Constant objects? +## 3. Constant objects? ```js const user = { name: "John" @@ -35,7 +35,7 @@ user.name = "Pete"; user = 123; ``` -## 1. Sum object properties +## 4. Sum object properties ```js let salaries = { John: 100, @@ -49,7 +49,7 @@ for (let key in salaries) { } ``` -## 1. Multiply numeric properties by 2 +## 5. Multiply numeric properties by 2 ```js function multiplyNumeric(obj) { for (let key in obj) { From 448746a618add1efae4e23da7179745d1a4390bb Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sun, 30 Jun 2019 00:19:34 +0200 Subject: [PATCH 51/54] Update README.md --- week-2/README.md | 26 +++++++++++++------------- 1 file changed, 13 insertions(+), 13 deletions(-) diff --git a/week-2/README.md b/week-2/README.md index 4b2a67b..159afaf 100644 --- a/week-2/README.md +++ b/week-2/README.md @@ -2,19 +2,19 @@ | | your Emoji | your comments | coach emoji | coach comments | | --- | --- | --- | --- | --- | -| :seedling: __[fcc: finish js basics](./fcc-basic-js-pt-2.md) | | | | | -| :dash: __[janke: tracing conditionals](./jl-tracing-conditionals.md) | | | | | -| :seedling: __[javascript.info: loops](./jsinfo-loops.md) | | | | | -| :dash: __[janke: loop refactors](./jl-loop-refactors.md) | | | | | -| :seedling: __[fcc: data structures](./fcc-data-structures.md) | | | | | -| :seedling: __[janke: errors const](./jl-errors-const.md) | | | | | -| :seedling: __[janke: errors arrays](./jl-errors-arrays.md) | | | | | -| :seedling: __[janke: errors objects](./jl-errors-objects.md) | | | | | -| :seedling: __[javascript.info: objects](./jsinfo-objects.md) | | | | | -| :dash: __[janke: reference types](./jl-reference-types.md) | | | | | -| :fire: __[janke: ref-type arguments](./jl-functions-ref-type-args.md) | | | | | -| :dash: __[janke: sentences w/o temps](./jl-variables-sentences-1.md) | | | | | -| :fire: __[janke: sentences w/ temps](./jl-variables-sentences-2.md) | | | | | +| :seedling: __[fcc: finish js basics](./fcc-basic-js-pt-2.md) | ✅ | | | | +| :dash: __[janke: tracing conditionals](./jl-tracing-conditionals.md) | ✅ | There is still some exercises I have to finish it | | | +| :seedling: __[javascript.info: loops](./jsinfo-loops.md) | :wavy_dash: | | | | +| :dash: __[janke: loop refactors](./jl-loop-refactors.md) | :wavy_dash: | | | | +| :seedling: __[fcc: data structures](./fcc-data-structures.md) | ✅ | | | | +| :seedling: __[janke: errors const](./jl-errors-const.md) | ✅ | | | | +| :seedling: __[janke: errors arrays](./jl-errors-arrays.md) | ✅ | | | | +| :seedling: __[janke: errors objects](./jl-errors-objects.md) | ✅ | | | | +| :seedling: __[javascript.info: objects](./jsinfo-objects.md) | ✅ | | | | +| :dash: __[janke: reference types](./jl-reference-types.md) | ✅ | | | | +| :fire: __[janke: ref-type arguments](./jl-functions-ref-type-args.md) | ✅ | | | | +| :dash: __[janke: sentences w/o temps](./jl-variables-sentences-1.md) | ✅ | | | | +| :fire: __[janke: sentences w/ temps](./jl-variables-sentences-2.md) | ✅ | | | | From d5ce648e3c5044e2f08c849750edac02fe081753 Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sun, 30 Jun 2019 12:40:58 +0200 Subject: [PATCH 52/54] Update jl-functions-ref-type-args.md --- week-2/jl-functions-ref-type-args.md | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/week-2/jl-functions-ref-type-args.md b/week-2/jl-functions-ref-type-args.md index 1e9a656..2a7581d 100644 --- a/week-2/jl-functions-ref-type-args.md +++ b/week-2/jl-functions-ref-type-args.md @@ -248,8 +248,9 @@ console.assert(array !== by_copy); function start_new_object(obj) { var new_obj = {}; - for (let i = Object.keys(obj).length - 1; i>=0; i--){ - new_obj = Object.assign(i); + + for (let key in obj) { + new_obj[key] = obj[key]; } return new_obj; } From 24589daa00249b4fcdfe43949ef71e3c59ea8f8f Mon Sep 17 00:00:00 2001 From: Ramzi Salem <50933665+ramzisalem@users.noreply.github.com> Date: Sun, 30 Jun 2019 16:41:48 +0200 Subject: [PATCH 53/54] Update jl-replicate-loose-equality.md --- week-3/jl-replicate-loose-equality.md | 184 ++++++++++++++++++++++++++ 1 file changed, 184 insertions(+) diff --git a/week-3/jl-replicate-loose-equality.md b/week-3/jl-replicate-loose-equality.md index 9db11da..a33fa75 100644 --- a/week-3/jl-replicate-loose-equality.md +++ b/week-3/jl-replicate-loose-equality.md @@ -1,2 +1,186 @@ > paste [this markdown of exercises](https://raw.githubusercontent.com/janke-learning/implicit-coercion/master/replicate-loose-equality.md) into this file and complete the exercises! +# Replicate Loose Equality + + +["What I cannot create, I do not understand."](https://blog.codinghorror.com/when-understanding-means-rewriting/) + +Gain a deeper understanding of implicit coercion and the tricky ```==``` operator by developing your own replication for primitive values onlu using a [TDD methodology](https://github.com/janke-learning/tdd). + + +### Index +* [describing behavior](#describing-behavior) +* [run\_tests function](#run--tests-function) +* [test driven development](#test-driven-development) +* [study ```==```](#study-it) +* [replicate ```==```](#replicate-it) + +--- + +## Describing Behavior + +Code's behavior is what has changed in your program _after_ the code has executed, implementation is the lines of text that make up the code. This exercise will introduce how to understand behavior using __test cases__. + +Practically speaking you can think of test cases as just inputs and outputs. What values went into the function, and what values come out of the function? The test case will contain the input-output pairs that your function _should_ implement, a test case fails if the function returns something else. + +Test cases may be relatively easy to read and use, but writing good ones can be tricky. You have to think about all possible strange combinations and fringe cases. So don't worry about writing the perfect test cases yet, just do your best and compare with a friend to help each other understand how you thought of your test cases. + +For this exercise you will write test cases in this format: +```js +test_cases = [ + {name:'meaningful name', args:['the inputs', 'for this snippet'], expected: 'what it should output'}, + {name:'another test case', args:['different', 'inputs'], expected: 'the expected output'}, + ]; +``` + +[TOP](#replicate-loose-equality) + +--- + +## run\_tests Function + +To check if your function passes all of it's test cases, we'll be using this function. It takes two arguments (the function to test, and the test cases), and console.log's a message for every test case that fails. + +Study it for a minute then paste it in the console, the exercises below won't work otherwise. If you don't understand entirely how this function works that's okay. The main objective for this exercise is to write & use test cases, understand JS operators. + +```js +function run_tests(_target, _cases) { + console.groupCollapsed('<- click this arrow to see the function') + console.log(_target.toString()); + console.groupEnd(); + + for (let t_case of _cases) { + + // create variables for readability + const expected = t_case.expected; + const args = t_case.args; + + // run function with test case + const actual = _target(...args); + + // compare + let pass; + if (typeof expected === 'object' && expected !== null) { + const _actual = JSON.stringify(actual); + const _expected = JSON.stringify(expected); + pass = _actual === _expected; + } else if ( expected !== expected ) { + pass = actual !== actual; + } else { + pass = actual === expected; + }; + + // communicate result to developer + if (pass) { + console.groupCollapsed(`%cPASS: ${t_case.name}`, 'color:green'); + } else { + console.groupCollapsed(`%c: ${t_case.name}`, 'color:red'); + console.log("%cactual: ", 'color:orange', typeof actual +", "+ actual); + }; + + for (let i = 0; i < args.length; i++) { + console.log(`arg ${i+1}: ${typeof args[i]},`, args[i]); + } + console.log("%cexpected: ", 'color:blue', typeof expected +", "+ expected); + console.groupEnd(); + }; +} +``` + +[TOP](#replicate-loose-equality) + +--- + +## Test Driven Development + +Very briefly this is a development philosophy that says to write all the tests your code should pass, then write the code to pass the tests. + +In the following exercise you will be practicing TDD by starting with the ```test_cases```, and then writing the ```==``` replication to pass the tests. + +For more info and TDD exercises [check this out](https://github.com/janke-learning/tdd). + +[TOP](#replicate-loose-equality) + +--- + +### Study It + +Study [this comparison table](https://dorey.github.io/JavaScript-Equality-Table/). +Play around with this [interactive table](https://janke-learning.org/equalities-coercion/). +Then test yourself with [this quiz](https://eqeq.js.org). + + +[TOP](#replicate-loose-equality) + +--- + +### Replicate It + +It's your turn. In this exercise you'll write your own replication of the == operator for primitive values 'number', 'string', 'boolean', 'null' and 'undefined'. We've provided you with a whole bunch of test cases and a commented starter function. It's up to you to do the rest! (hint: try focusing on one comment at a time, pass it then, move on to pass the next. also, the test cases are organized to match up with the three sections of the function) + +__Passing Test Cases:__ you will use these tests to develop your replication of ```==```. Copy-paste them into the console and hit enter. to make sure they are loaded type ```test_cases``` into the console. Feel free to add more passing test cases before moving on the replication! +```js +test_cases = [ + { name: 'null, undefined', args: [null, undefined], expected: true}, + { name: 'undefined, null', args: [undefined, null], expected: true}, + { name: 'null, null', args: [null, null], expected: true}, + { name: 'undefined, undefined', args: [undefined, undefined], expected: true}, + { name: 'null, "anything else"', args: [null, "anything else"], expected: false}, + { name: 'undefined, "anything else"', args: [undefined, "anything else"], expected: false}, + { name: 'true, false', args: [true, false], expected: false}, + { name: 'false, false', args: [false, false], expected: true}, + { name: '3, 3', args: [3, 3], expected: true}, + { name: '3.0, 3', args: [3.0, 3], expected: true}, + { name: '+0, -0', args: [+0, -0], expected: true}, + { name: '"\t", "\t"', args: ["\t", '\t'], expected: true}, + { name: '-3, +3', args: [-3, +3], expected: false}, + { name: '3, "3"', args: [3, "3"], expected: true}, + { name: '"3", 3', args: ["3", 3], expected: true}, + { name: '"3", "3"', args: ["3", "3"], expected: true}, + { name: 'true, 1', args: [true, 1], expected: true}, + { name: 'false, 0', args: [false, 0], expected: true}, + { name: 'false, ""', args: [false, ""], expected: true}, + { name: '0, ""', args: [0, ""], expected: true}, + { name: '"e", true', args: ["e", true], expected: false}, + { name: 'undefined, ""', args: [undefined, ""], expected: false} +]; +``` + +__Native Operation:__ Before moving on, copy-paste this code into the console and hit enter. Study the test results to build a first understanding of how ```==``` works. (if there are any red test cases, something went wrong!) +```js +{ + function loose_equality(a, b) { + return a == b; + } + run_tests(loose_equality, test_cases); +} +``` + +__Your Replication:__ Your turn! Paste the code below into the console and begin developing your own replication of the ```==``` operator. Write little bits of code at once and run the code frequently. Try perhaps implementing one comment at a time or to pass one test case at a time. +Once you've passed all the tests, paste your code back into this markdown for studying later! +```js +{ + function loose_replication(a, b) { + // if both a and b are null or undefined, return true + // if only one is null or undefined, return false + + // if both arguments are the same type (num, string, or bool) + // compare them with === and return the result + + // if both are not the same type + // make sure both are type 'number' + // compare them with ===, and return the result + } + run_tests(loose_replication, test_cases); +} +``` + +[TOP](#replicate-loose-equality) + +--- + +> [a complete replication of ```==```](https://gist.github.com/qntm/d899c00aa1ac2c663ac6db23bcffcaba), not just for primitives + +___ +___ +### Janke Learning From efe80afac85512269977d4382d4d2d12bd88aae0 Mon Sep 17 00:00:00 2001 From: Evan Cole <18554853+colevandersWands@users.noreply.github.com> Date: Mon, 1 Jul 2019 14:07:57 +0200 Subject: [PATCH 54/54] Update README.md --- week-2/README.md | 26 +++++++++++++------------- 1 file changed, 13 insertions(+), 13 deletions(-) diff --git a/week-2/README.md b/week-2/README.md index 159afaf..62c40c4 100644 --- a/week-2/README.md +++ b/week-2/README.md @@ -2,19 +2,19 @@ | | your Emoji | your comments | coach emoji | coach comments | | --- | --- | --- | --- | --- | -| :seedling: __[fcc: finish js basics](./fcc-basic-js-pt-2.md) | ✅ | | | | -| :dash: __[janke: tracing conditionals](./jl-tracing-conditionals.md) | ✅ | There is still some exercises I have to finish it | | | -| :seedling: __[javascript.info: loops](./jsinfo-loops.md) | :wavy_dash: | | | | -| :dash: __[janke: loop refactors](./jl-loop-refactors.md) | :wavy_dash: | | | | -| :seedling: __[fcc: data structures](./fcc-data-structures.md) | ✅ | | | | -| :seedling: __[janke: errors const](./jl-errors-const.md) | ✅ | | | | -| :seedling: __[janke: errors arrays](./jl-errors-arrays.md) | ✅ | | | | -| :seedling: __[janke: errors objects](./jl-errors-objects.md) | ✅ | | | | -| :seedling: __[javascript.info: objects](./jsinfo-objects.md) | ✅ | | | | -| :dash: __[janke: reference types](./jl-reference-types.md) | ✅ | | | | -| :fire: __[janke: ref-type arguments](./jl-functions-ref-type-args.md) | ✅ | | | | -| :dash: __[janke: sentences w/o temps](./jl-variables-sentences-1.md) | ✅ | | | | -| :fire: __[janke: sentences w/ temps](./jl-variables-sentences-2.md) | ✅ | | | | +| :seedling: [fcc: finish js basics](./fcc-basic-js-pt-2.md) | ✅ | | ✅ | | +| :dash: [janke: tracing conditionals](./jl-tracing-conditionals.md) | ✅ | There is still some exercises I have to finish it | ✅ | any more questions since we talked? | +| :seedling: [javascript.info: loops](./jsinfo-loops.md) | :wavy_dash: | | | | +| :dash: [janke: loop refactors](./jl-loop-refactors.md) | :wavy_dash: | | | | +| :seedling: [fcc: data structures](./fcc-data-structures.md) | ✅ | | ✅ | | +| :seedling: [janke: errors const](./jl-errors-const.md) | ✅ | | ✅ | check your creation/syntax decisions | +| :seedling: [janke: errors arrays](./jl-errors-arrays.md) | ✅ | | ✅ | | +| :seedling: [janke: errors objects](./jl-errors-objects.md) | ✅ | | ✅ | you fixed the errors, but didn't get at the _intended_ behavior. | +| :seedling: [javascript.info: objects](./jsinfo-objects.md) | ✅ | | ✅ | | +| :dash: [janke: reference types](./jl-reference-types.md) | ✅ | | ✅ | your solutions aren't in there, but we saw this together | +| :fire: [janke: ref-type arguments](./jl-functions-ref-type-args.md) | ✅ | | ✅ | | +| :dash: [janke: sentences w/o temps](./jl-variables-sentences-1.md) | ✅ | | :green_heart: | "eating meat" & "fir trees" have an off word | +| :fire: [janke: sentences w/ temps](./jl-variables-sentences-2.md) | ✅ | | :green_heart: | |