diff --git a/Sprint-1/1-key-exercises/1-count.js b/Sprint-1/1-key-exercises/1-count.js index 117bcb2b6e..7661d75c53 100644 --- a/Sprint-1/1-key-exercises/1-count.js +++ b/Sprint-1/1-key-exercises/1-count.js @@ -4,3 +4,5 @@ count = count + 1; // Line 1 is a variable declaration, creating the count variable with an initial value of 0 // Describe what line 3 is doing, in particular focus on what = is doing + +//Line 3 is a statement. Here we reassign the value of count from 0 to 1 by adding value one to it \ No newline at end of file diff --git a/Sprint-1/1-key-exercises/2-initials.js b/Sprint-1/1-key-exercises/2-initials.js index 47561f6175..10cc52f0ab 100644 --- a/Sprint-1/1-key-exercises/2-initials.js +++ b/Sprint-1/1-key-exercises/2-initials.js @@ -5,7 +5,8 @@ let lastName = "Johnson"; // Declare a variable called initials that stores the first character of each string. // This should produce the string "CKJ", but you must not write the characters C, K, or J in the code of your solution. -let initials = ``; +let initials = firstName.charAt(0)+middleName.charAt(0)+lastName.charAt(0); +console.log(initials); // https://www.google.com/search?q=get+first+character+of+string+mdn diff --git a/Sprint-1/1-key-exercises/3-paths.js b/Sprint-1/1-key-exercises/3-paths.js index ab90ebb28e..1e9adc0328 100644 --- a/Sprint-1/1-key-exercises/3-paths.js +++ b/Sprint-1/1-key-exercises/3-paths.js @@ -15,9 +15,21 @@ const base = filePath.slice(lastSlashIndex + 1); console.log(`The base part of ${filePath} is ${base}`); // Create a variable to store the dir part of the filePath variable +function dirString(){ + const dirName = filePath.slice(1,lastSlashIndex); + return dirName; +} + // Create a variable to store the ext part of the variable +function extString(){ + const lastDotIndex = filePath.lastIndexOf("."); + const extName = filePath.slice(lastDotIndex); + return extName; +} -const dir = ; -const ext = ; +const dir = dirString(filePath); +const ext = extString(filePath); +console.log(dir); +console.log(ext); // https://www.google.com/search?q=slice+mdn \ No newline at end of file diff --git a/Sprint-1/1-key-exercises/4-random.js b/Sprint-1/1-key-exercises/4-random.js index 292f83aabb..d8fd5d4bb7 100644 --- a/Sprint-1/1-key-exercises/4-random.js +++ b/Sprint-1/1-key-exercises/4-random.js @@ -1,9 +1,18 @@ const minimum = 1; const maximum = 100; - const num = Math.floor(Math.random() * (maximum - minimum + 1)) + minimum; +console.log(num); // In this exercise, you will need to work out what num represents? // Try breaking down the expression and using documentation to explain what it means // It will help to think about the order in which expressions are evaluated // Try logging the value of num and running the program several times to build an idea of what the program is doing + +//In the declaration of num, we can break it down to below: + +//1. A randon number, which is with decimals between 0 and 1, is created by method Math.random() +//2. The random number in step 1 is multipled by 100. That makes an number with decimals. +//3. The method Math.floor grounded the number in step 2 down to a whole number between 0 - 99. +//4. The number from step 3 is added 1, so it makes a whole number between 1-100. + +//I think the overall javascript code here is to make a random whole number between 1-100. \ No newline at end of file diff --git a/Sprint-1/2-mandatory-errors/0.js b/Sprint-1/2-mandatory-errors/0.js index cf6c5039f7..a01fb27746 100644 --- a/Sprint-1/2-mandatory-errors/0.js +++ b/Sprint-1/2-mandatory-errors/0.js @@ -1,2 +1,6 @@ This is just an instruction for the first activity - but it is just for human consumption -We don't want the computer to run these 2 lines - how can we solve this problem? \ No newline at end of file +We don't want the computer to run these 2 lines - how can we solve this problem? + +//This file has error indicate 'SyntaxError: Unexpected identifier' and some syntax broke the whole file. +//I can tell that the first 2 lines in this file is not code but some written line which should be commented. +//So I tried commenting the lines and the error disappeared. \ No newline at end of file diff --git a/Sprint-1/2-mandatory-errors/1.js b/Sprint-1/2-mandatory-errors/1.js index 7a43cbea76..ca7c2dbb62 100644 --- a/Sprint-1/2-mandatory-errors/1.js +++ b/Sprint-1/2-mandatory-errors/1.js @@ -2,3 +2,8 @@ const age = 33; age = age + 1; + +//TypeError: Assignment to constant variable. +//This error is caused by the wrong reassignment of variable 'age'. It is a constant that cannot be reassigned. +//So the error prompted when the second line code try to reassign the variable value. +//In this case, I would use let age instead of const age to assign age and set its value. \ No newline at end of file diff --git a/Sprint-1/2-mandatory-errors/2.js b/Sprint-1/2-mandatory-errors/2.js index e09b89831d..48e360edba 100644 --- a/Sprint-1/2-mandatory-errors/2.js +++ b/Sprint-1/2-mandatory-errors/2.js @@ -3,3 +3,7 @@ console.log(`I was born in ${cityOfBirth}`); const cityOfBirth = "Bolton"; + +//ReferenceError: Cannot access 'cityOfBirth' before initialization. +//This error indicates that the variable 'cityOfBirth' cannot be accessed. +//It is caused by the wrong order of code. We need to move the declaration of 'cityOfBirth' before the fourth line which calls the variable. \ No newline at end of file diff --git a/Sprint-1/2-mandatory-errors/3.js b/Sprint-1/2-mandatory-errors/3.js index ec101884db..0fb705cb80 100644 --- a/Sprint-1/2-mandatory-errors/3.js +++ b/Sprint-1/2-mandatory-errors/3.js @@ -7,3 +7,9 @@ const last4Digits = cardNumber.slice(-4); // Then run the code and see what error it gives. // Consider: Why does it give this error? Is this what I predicted? If not, what's different? // Then try updating the expression last4Digits is assigned to, in order to get the correct value + +//Before running the code, I see .slice() method is applied in this javascript but then I can see this method is used on a number. +//So I expected an error to tell me this method is applied on wrong elements. +//When I run it, "TypeError: cardNumber.slice is not a function" which is different to my expectation. +//I googled it and found this type of error can be triggered by typo or wrong object application and in this case I think it is because the number is wrongly applied. +//I tried to fix it by adding " " double quotation mark on the number to make it a string and print the last4Digits. I got the last 4 digits successfully. diff --git a/Sprint-1/2-mandatory-errors/4.js b/Sprint-1/2-mandatory-errors/4.js index 5f86c730bc..d4d6f886dd 100644 --- a/Sprint-1/2-mandatory-errors/4.js +++ b/Sprint-1/2-mandatory-errors/4.js @@ -1,2 +1,6 @@ const 12HourClockTime = "8:53pm"; const 24hourClockTime = "20:53"; + +//SyntaxError: Invalid or unexpected token is shown. So I googled and found there are a lot of different cases would trigger this error. I initially thought thar the " " maybe wrongly use as some cases smart quote can confuse developer. I simply replace that with straight quote but the same error shown. +//Then I tried to comment the first line and saw the same error shown for the second line. There are a double arrow under 12 or 24 in the variable name. +//So I googled and found the error is due to variable name started with number is not allowed and will trigger error. So I solved the error by removing the number from both variable names. \ No newline at end of file diff --git a/Sprint-1/3-mandatory-interpret/1-percentage-change.js b/Sprint-1/3-mandatory-interpret/1-percentage-change.js index e24ecb8e18..7f80cd1f8f 100644 --- a/Sprint-1/3-mandatory-interpret/1-percentage-change.js +++ b/Sprint-1/3-mandatory-interpret/1-percentage-change.js @@ -12,11 +12,17 @@ console.log(`The percentage change is ${percentageChange}`); // Read the code and then answer the questions below // a) How many function calls are there in this file? Write down all the lines where a function call is made +// There is 5 function calls in line 4, 5 and 10. Number() and console.log() both are the function. +// And XXX.replaceAll(",", "") is another function call. So in total there are 5 function calls in this code. // b) Run the code and identify the line where the error is coming from - why is this error occurring? How can you fix this problem? +// It shows "SyntaxError: missing ) after argument list" point at the end of line 5. I can see there is a missing comma in method .replaceAll() comparing to line method structure. By adding the comma after the ",", the error is solved. // c) Identify all the lines that are variable reassignment statements +// Line 4 and 5 are variable reassignment statements. // d) Identify all the lines that are variable declarations +// Line 1, 2, 7 and 8 are variable declarations. // e) Describe what the expression Number(carPrice.replaceAll(",","")) is doing - what is the purpose of this expression? +// This expression is removing the comma within the value contains in the variable being called. \ No newline at end of file diff --git a/Sprint-1/3-mandatory-interpret/2-time-format.js b/Sprint-1/3-mandatory-interpret/2-time-format.js index 47d2395587..d16ebd1675 100644 --- a/Sprint-1/3-mandatory-interpret/2-time-format.js +++ b/Sprint-1/3-mandatory-interpret/2-time-format.js @@ -12,14 +12,21 @@ console.log(result); // For the piece of code above, read the code and then answer the following questions // a) How many variable declarations are there in this program? +// There are 6 variable declarations. // b) How many function calls are there? +// Only one, console.log() is the function call. // c) Using documentation, explain what the expression movieLength % 60 represents // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators +// % is a remainder operation which in this expression trying to calculate the remaining seconds to be shown in the Hour:Minute:Second format. // d) Interpret line 4, what does the expression assigned to totalMinutes mean? +// Line 4 is calculating the quotient of the calculation (8784-remainder) divided by 60 to find the movie length in minute. That will be later used to find the display minute in the Hour:Minute:Second format. // e) What do you think the variable result represents? Can you think of a better name for this variable? +// I think the original movie length is in second and this code is to calculate the display of movie length in the Hour:Minute:Second format like what what we see in a normal movie information. I would suggest using durationFormatted as the variable name as it could explain to others clearly what it contains. // f) Try experimenting with different values of movieLength. Will this code work for all values of movieLength? Explain your answer +//When testing the output with different values of movie length, the output seems right. No matter a 0 value, small or large value, it can display the the Hour:Minute:Second format well. +// One thing I have comment on is the display format is not in two digit in each holder of Hour:Minute:Second format. So there is a case 1:5:5 can be displayed which doesn't look user friendly for audience. diff --git a/Sprint-1/3-mandatory-interpret/3-to-pounds.js b/Sprint-1/3-mandatory-interpret/3-to-pounds.js index 60c9ace69a..e6bac2736c 100644 --- a/Sprint-1/3-mandatory-interpret/3-to-pounds.js +++ b/Sprint-1/3-mandatory-interpret/3-to-pounds.js @@ -1,4 +1,4 @@ -const penceString = "399p"; +const penceString = "1399p"; const penceStringWithoutTrailingP = penceString.substring( 0, @@ -25,3 +25,14 @@ console.log(`£${pounds}.${pence}`); // To begin, we can start with // 1. const penceString = "399p": initialises a string variable with the value "399p" + +// This program start with a string represents pence which is calculated and displayed in £X.XX in format. +// Line 3-6 is to remove the character p at the end of the string and store the remaining string in a variable penceStringWithoutTrailingP. + +// Line 8-12 is to make sure the string taken in from the previous step has at least 3 characters. If it isn't, fill the start with '0' until it is 3 characters long. +// Then use this at least 3 characters length string to remove the last 2 characters and store the string as the string of pound. + +// Line 14-19 is to make sure the string which is at least 3 characters long to get the last two characters and make sure it is 2 characters long. If it isn't, fill the end with '0' until it 2 characters long. And it is stored as pence. + +// Line 18 displayed the string all together to show £x.xx in format. +// I tested the string works for longer string like 399999p. \ No newline at end of file diff --git a/Sprint-1/4-stretch-explore/chrome.md b/Sprint-1/4-stretch-explore/chrome.md index e7dd5feafe..baa79c189b 100644 --- a/Sprint-1/4-stretch-explore/chrome.md +++ b/Sprint-1/4-stretch-explore/chrome.md @@ -10,9 +10,18 @@ Let's try an example. In the Chrome console, invoke the function `alert` with an input string of `"Hello world!"`; +Answer: A modal window pop up showing Hello World! on it. + What effect does calling the `alert` function have? +Answer: When the modal window pop up, user would see message "Hello World!" and has to click OK on the window. + Now try invoking the function `prompt` with a string input of `"What is your name?"` - store the return value of your call to `prompt` in an variable called `myName`. What effect does calling the `prompt` function have? + +Answer: A modal window pop up showing a question 'What is your name?' on it and a input field in shown under it for user to insert the name. + What is the return value of `prompt`? + +Answer: 'Undefined' is shown in the return value. diff --git a/Sprint-1/4-stretch-explore/objects.md b/Sprint-1/4-stretch-explore/objects.md index 0216dee56a..c251ff4400 100644 --- a/Sprint-1/4-stretch-explore/objects.md +++ b/Sprint-1/4-stretch-explore/objects.md @@ -6,11 +6,22 @@ Open the Chrome devtools Console, type in `console.log` and then hit enter What output do you get? +Answer: 'ƒ log() { [native code] }' is shown. + Now enter just `console` in the Console, what output do you get back? +Answer: I got 'console {debug: ƒ, error: ƒ, info: ƒ, log: ƒ, warn: ƒ, …}'. + Try also entering `typeof console` +Answer: 'object'. + Answer the following questions: What does `console` store? + +Answer: 'Console' stores the varaiables we declared temporarily until we refresh the page. + What does the syntax `console.log` or `console.assert` mean? In particular, what does the `.` mean? + +Both of it has the syntax XXX.XXX at the front is the object and after dot is the method called. So now I know console is the built-in browser object. The dot is the Member Access Operator which make connection or indication between the object and method.