From 93a68305e3761adeb543afa58d9ed53bc4ef155c Mon Sep 17 00:00:00 2001 From: Kate Saslow <39833858+ksaslow@users.noreply.github.com> Date: Mon, 29 Jan 2024 08:35:35 -0500 Subject: [PATCH 01/11] updated README with name --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index a3a32bc..8078c6b 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,4 @@ # learn-js JavaScript tutorial repo -### REPLACE WITH YOUR FULL NAME +### Katie Saslow From 0b95893f18de26651422ac0ff85b764db58e7faf Mon Sep 17 00:00:00 2001 From: Kate Saslow <39833858+ksaslow@users.noreply.github.com> Date: Mon, 29 Jan 2024 08:52:13 -0500 Subject: [PATCH 02/11] fixed error in quiz/where2putjs.html --- quiz/where2putjs.html | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/quiz/where2putjs.html b/quiz/where2putjs.html index 0dff0b6..fe8fdc0 100644 --- a/quiz/where2putjs.html +++ b/quiz/where2putjs.html @@ -4,12 +4,7 @@ Title - +
@@ -17,6 +12,11 @@

Demo JavaScript in Body

Placeholder ...

- + \ No newline at end of file From c2730499dab0436461443b8b12e301d8ef7b73b6 Mon Sep 17 00:00:00 2001 From: Kate Saslow <39833858+ksaslow@users.noreply.github.com> Date: Mon, 29 Jan 2024 09:29:52 -0500 Subject: [PATCH 03/11] fixed error in quiz/vars1 --- quiz/vars1.html | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/quiz/vars1.html b/quiz/vars1.html index 3e4b023..c89e25b 100644 --- a/quiz/vars1.html +++ b/quiz/vars1.html @@ -2,12 +2,12 @@ From 7267b2809c55223f70be71ecaddd6386703d326e Mon Sep 17 00:00:00 2001 From: Kate Saslow <39833858+ksaslow@users.noreply.github.com> Date: Tue, 30 Jan 2024 11:54:48 -0500 Subject: [PATCH 05/11] added comment to code vars1 --- quiz/vars1.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/quiz/vars1.html b/quiz/vars1.html index 21c93c3..731994c 100644 --- a/quiz/vars1.html +++ b/quiz/vars1.html @@ -7,7 +7,7 @@ { y = y + 1; // cannot access y before initialization, Reference Error, using before line 10! console.log(x+y); - var y = 2; // change from let y = 2 to var y = 2 (KS) + var y = 2; // change from let y = 2 to var y = 2 (KS). (This changes the semantic rules around declaring variables) } console.log(x); console.log(y); From 05b60e8e637e91996f8e5f6fbc588375d43ba111 Mon Sep 17 00:00:00 2001 From: Kate Saslow <39833858+ksaslow@users.noreply.github.com> Date: Tue, 30 Jan 2024 12:01:32 -0500 Subject: [PATCH 06/11] fixed errors in quiz/vars3.html and added comments for explanation vars2 --- quiz/vars2.html | 8 +++++++- quiz/vars3.html | 7 ++++--- 2 files changed, 11 insertions(+), 4 deletions(-) diff --git a/quiz/vars2.html b/quiz/vars2.html index a6da64e..ec03e3f 100644 --- a/quiz/vars2.html +++ b/quiz/vars2.html @@ -6,7 +6,13 @@ // setTimeout executes the function after 5 ms setTimeout(function() { // setTimeout is an API call. lookup console.log(i); // each time we console log it, we get 5, not 0, 1, 2, 3, 4, 5. - }, 0); + }, 0); + // this is how you do ASYNCHRONOUS programming. The whole for loop is going to run, and with each iteration, + // this function is going to be put on some Q. Once the whole loop runs, every function in the Q will get executed!!! + // we want to console log 0 to 4 sequentially, so we do this asynchronous programming + + // NOTE: We see the changes I made (when I changed var to let in line 5), because of BLOCK SCOPE! the variable + // declared with var i was NOT ACCESSIBLE to the block function. Needed to change it to let i. } diff --git a/quiz/vars3.html b/quiz/vars3.html index 5b2d10d..63e9b17 100644 --- a/quiz/vars3.html +++ b/quiz/vars3.html @@ -2,11 +2,12 @@ From 8f0590ce4f4c4caf14c29a6fc39b03ccd8767ff6 Mon Sep 17 00:00:00 2001 From: Kate Saslow <39833858+ksaslow@users.noreply.github.com> Date: Tue, 30 Jan 2024 12:45:05 -0500 Subject: [PATCH 08/11] fixed error in logger.js --- quiz/scripts/logger.js | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/quiz/scripts/logger.js b/quiz/scripts/logger.js index 5d03eb6..575ef4a 100644 --- a/quiz/scripts/logger.js +++ b/quiz/scripts/logger.js @@ -1 +1,11 @@ // Define a JavaScript function called logMsg() that can be used to log an error message for any object that contains the property errMsg. + +function logMsg() { + console.log(`Error message: ${this.errMsg}`); +}; + +const o1 = { + errMsg: '01' +}; + +logMsg.call(o1) \ No newline at end of file From 8c0fb9ac752dcc50d734b5db3e1481d739697fe7 Mon Sep 17 00:00:00 2001 From: Kate Saslow <39833858+ksaslow@users.noreply.github.com> Date: Tue, 30 Jan 2024 12:57:35 -0500 Subject: [PATCH 09/11] fixed closure.js script --- quiz/scripts/closure.js | 9 ++++++++- quiz/scripts/javascript.js | 1 + quiz/scripts/js | 0 quiz/scripts/test_code.js | 0 4 files changed, 9 insertions(+), 1 deletion(-) create mode 100644 quiz/scripts/javascript.js create mode 100644 quiz/scripts/js create mode 100644 quiz/scripts/test_code.js diff --git a/quiz/scripts/closure.js b/quiz/scripts/closure.js index 627414d..93e5915 100644 --- a/quiz/scripts/closure.js +++ b/quiz/scripts/closure.js @@ -1,9 +1,11 @@ function setColor(set) { let changeColor = set; - if(changeColor) { + return () => { // added (KS), need to return a closure! + if(changeColor) { let userColor = document.getElementById('color').value; document.getElementById('myPara').style.color = userColor; } + } } @@ -11,3 +13,8 @@ window.onload = function() { let toggle = true; document.getElementById('btn').onclick = setColor(toggle); } + + +// error: the function setColor is not actually returning anything! +// fix: need the function to execute when the click happens. To do this, we need to create a nested function, aka a closure!! +// added line 3 to add the arrow func \ No newline at end of file diff --git a/quiz/scripts/javascript.js b/quiz/scripts/javascript.js new file mode 100644 index 0000000..831efd2 --- /dev/null +++ b/quiz/scripts/javascript.js @@ -0,0 +1 @@ +let sum \ No newline at end of file diff --git a/quiz/scripts/js b/quiz/scripts/js new file mode 100644 index 0000000..e69de29 diff --git a/quiz/scripts/test_code.js b/quiz/scripts/test_code.js new file mode 100644 index 0000000..e69de29 From f3c69f30868e732ed530004c16e68e895a357e6b Mon Sep 17 00:00:00 2001 From: Kate Saslow <39833858+ksaslow@users.noreply.github.com> Date: Tue, 30 Jan 2024 13:00:05 -0500 Subject: [PATCH 10/11] added comment to closure.js --- quiz/scripts/closure.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/quiz/scripts/closure.js b/quiz/scripts/closure.js index 93e5915..32dfa06 100644 --- a/quiz/scripts/closure.js +++ b/quiz/scripts/closure.js @@ -1,6 +1,6 @@ function setColor(set) { let changeColor = set; - return () => { // added (KS), need to return a closure! + return () => { // added (KS), need to return a closure! could do either return () => OR return fucntion() if(changeColor) { let userColor = document.getElementById('color').value; document.getElementById('myPara').style.color = userColor; From 2c59f47bc6aa07685ef79d9ab9d2d972b4867de8 Mon Sep 17 00:00:00 2001 From: Kate Saslow <39833858+ksaslow@users.noreply.github.com> Date: Tue, 30 Jan 2024 13:19:27 -0500 Subject: [PATCH 11/11] fixed errors in addEvents.js --- quiz/scripts/addEvent.js | 14 ++++++++++---- 1 file changed, 10 insertions(+), 4 deletions(-) diff --git a/quiz/scripts/addEvent.js b/quiz/scripts/addEvent.js index 53ed60e..eb0f203 100644 --- a/quiz/scripts/addEvent.js +++ b/quiz/scripts/addEvent.js @@ -1,18 +1,24 @@ window.onload = function() { let x = document.getElementById('myBtn'); - x.addEventListener('mouseover', myFunction('Moused over!')); + x.addEventListener('mouseover', myFunction('Moused over!')); // now these functions take input parameters! x.addEventListener('click', mySecondFunction('Clicked!')); x.addEventListener('mouseout', myThirdFunction('Moused out!')); } function myFunction(msg) { - document.getElementById('demo').textContent = msg; + return () => document.getElementById('demo').textContent = msg; } function mySecondFunction(msg) { - document.getElementById('demo').textContent = msg; + return () => document.getElementById('demo').textContent = msg; } function myThirdFunction(msg) { - document.getElementById('demo').textContent = msg; + return () => document.getElementById('demo').textContent = msg; } + +// why doesnt this work as expected? What changed now that the functions in EventListeners take parameters? +// maybe that the functions to be handled don't return anything? +// the functions need to return CLOSURES! +// How do we do this? Convert the function into arrow function at line 3 +// OR return closures below in the individual functions! (done KS) \ No newline at end of file