London | Ali Qassab | Module-Structuring-and-Testing-Data | Sprint-1 | Week 1

Sprint-1/errors/0.js

@@ -1,2 +1,11 @@
+// To make  the JavaScript engine ignore this code, we can use a single line comments
+
+//1- We can use a single line comment //
+// 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?
+
+//2- We can use a multi-line comment /* */
+/*
 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?
+We don't want the computer to run these 2 lines - how can we solve this problem?
+*/

Sprint-1/errors/1.js

@@ -1,4 +1,13 @@
 // trying to create an age variable and then reassign the value by 1
 
+// Wrong way to do it
+/*
 const age = 33;
 age = age + 1;
+*/
+
+// Correct way to do it
+let age = 33;
+age = age + 1;
+
+console.log(age); // 34

Sprint-1/errors/2.js

@@ -1,5 +1,15 @@
 // Currently trying to print the string "I was born in Bolton" but it isn't working...
 // what's the error ?
+/*
+The error in the "Wrong way to do it" section is that it's trying to use the cityOfBirth variable before it's declared. In JavaScript, variables are not hoisted when using const or let, meaning they can't be used before they're declared in the code. 
+*/
 
+// Wrong way to do it
+/*
 console.log(`I was born in ${cityOfBirth}`);
 const cityOfBirth = "Bolton";
+*/
+
+// Correct way to do it
+let cityOfBirth = "Bolton";
+console.log(`I was born in ${cityOfBirth}`); // I was born in Bolton

Sprint-1/errors/3.js

@@ -1,9 +1,21 @@
 const cardNumber = 4533787178994213;
-const last4Digits = cardNumber.slice(-4);
+// const last4Digits = cardNumber.slice(-4);// Wrong way to do it
 
 // The last4Digits variable should store the last 4 digits of cardNumber
 // However, the code isn't working
 // Before running the code, make and explain a prediction about why the code won't work
+// 1- Explain the error
+/*
+The code won't work because  In JavaScript, the slice() method is available for strings and arrays, but not for numbers 
+*/
 // 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?
+// 2- Expected Error
+/* 
+The error is TypeError: cardNumber.slice is not a function. 
+(YES)
+*/
 // Then try updating the expression last4Digits is assigned to, in order to get the correct value
+// 3- Solution
+const last4Digits = cardNumber.toString().slice(-4);
+console.log(last4Digits); // 4213

Sprint-1/errors/4.js

@@ -1,2 +1,11 @@
+/* 
+ Explain the error
+. In JavaScript, variable names cannot start with a number, but they can end with a number.
+. The values of the two variables don’t match the intended clock formats.
+
 const 12HourClockTime = "20:53";
-const 24hourClockTime = "08:53";
+const 24hourClockTime = "08:53";
+*/
+// Correct way to do it
+const hourClock12 = "08:53"; // 12-hour format example (AM)
+const hourClock24 = "20:53"; // 24-hour format (PM)

Sprint-1/exercises/count.js

@@ -4,3 +4,6 @@ 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
+
+// Description
+/* The assignment operator (=) is updating the value of count by assigning the result of count + 1 back to count. After this line executes, the count will hold the value 1. */

Sprint-1/exercises/decimal.js

@@ -3,7 +3,15 @@ const num = 56.5678;
 // You should look up Math functions for this exercise https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math
 
 // Create a variable called wholeNumberPart and assign to it an expression that evaluates to 56 ( the whole number part of num )
+const wholeNumberPart = Math.floor(num);
+
 // Create a variable called decimalPart and assign to it an expression that evaluates to 0.5678 ( the decimal part of num )
+const decimalPart = (num - wholeNumberPart).toFixed(4);
+
 // Create a variable called roundedNum and assign to it an expression that evaluates to 57 ( num rounded to the nearest whole number )
+const roundedNum = Math.round(num);
 
 // Log your variables to the console to check your answers
+console.log("Whole Number Part:", wholeNumberPart);
+console.log("Decimal Part:", decimalPart);
+console.log("Rounded Number:", roundedNum);

Sprint-1/exercises/initials.js

@@ -4,3 +4,6 @@ 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.
+const initials = firstName[0] + middleName[0] + lastName[0];
+// const initials = `${firstName[0]}${middleName[0]}${lastName[0]}`;
+console.log(initials); // CKJ

Sprint-1/exercises/paths.js

@@ -15,4 +15,8 @@ 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
+const dir = filePath.slice(0, lastSlashIndex);
+console.log(`The dir part of ${filePath} is ${dir}`);
 // Create a variable to store the ext part of the variable
+const ext = base.slice(base.lastIndexOf(".") + 1);
+console.log(`The ext part of ${base} is ${ext}`);

Sprint-1/exercises/random.js

@@ -2,8 +2,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
+
+//1- Math.random() generates a random decimal number between 0 and 1.
+//2- This decimal is then multiplied by (maximum - minimum + 1).
+/*
+    a- (maximum - minimum + 1) calculates the range of numbers between minimum and maximum.
+    b- Multiplying Math.random() by 100 means we’ll get a random decimal between 0 and 100.
+    c- Adding 1 to the result means we’ll get a random decimal between 1 and 100
+*/
+//3- Math.floor() rounds down to the nearest whole number.
+//4- This means that num will be a random whole number between 1 and 100.

Sprint-1/explore/chrome.md

@@ -12,7 +12,18 @@ invoke the function `alert` with an input string of `"Hello world!"`;
 
 What effect does calling the `alert` function have?
 
+1. It displays a dialog with a message and an OK button.
+2. It contains an OK button that the user must click to close the dialog box.
+3. Interaction with the rest of the webpage is blocked until the alert is dismissed.
+
 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?
+
+1. A modal dialog box will appear with the message "What is your name?" and a text input field.
+2. The dialog box also contains two buttons: "OK" and "Cancel".
+
 What is the return value of `prompt`?
+
+1. If the user enters a value and clicks "OK," the value they entered is returned, and this value will be stored in the variable myName.
+2. If the user clicks "Cancel" or closes the dialog box without entering anything, the prompt function will return null.

Sprint-1/explore/objects.md

@@ -5,12 +5,31 @@ In this activity, we'll explore some additional concepts that you'll encounter i
 Open the Chrome devtools Console, type in `console.log` and then hit enter
 
 What output do you get?
+ƒ log() { [native code] }
 
 Now enter just `console` in the Console, what output do you get back?
+console: {
+log: ƒ,
+warn: ƒ,
+error: ƒ,
+info: ƒ,
+assert: ƒ,
+...
+}
 
 Try also entering `typeof console`
+"object"
 
 Answer the following questions:
 
 What does `console` store?
-What does the syntax `console.log` or `console.assert` mean? In particular, what does the `.` mean?
+
+1. `console` is an object that contains methods for logging messages to the console.
+2. It is a built-in object in JavaScript that provides a set of methods for debugging and logging information.
+
+What does the syntax `console.log` or `console.assert` mean?
+In particular, what does the `.` mean?
+
+- The dot `.` is used to access the methods of the `console` object.
+- `console.log` is a method that logs a message to the console.
+- `console.assert` is a method that logs a message to the console if the assertion is false.

Sprint-1/interpret/percentage-change.js

@@ -12,11 +12,31 @@ 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
+//a) There are 5 function calls in this file:
+// carPrice.replaceAll(",", "")
+// Number(carPrice.replaceAll(",", ""))
+// priceAfterOneYear.replaceAll("," "")
+// Number(priceAfterOneYear.replaceAll("," ""))
+// console.log(`The percentage change is ${percentageChange}`)
 
 // 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?
+// b) The error is coming from line 5:
+// priceAfterOneYear = Number(priceAfterOneYear.replaceAll("," ""));
+priceAfterOneYear = Number(priceAfterOneYear.replaceAll(",", ""));
 
-// c) Identify all the lines that are variable reassignment statements
 
+// c) Identify all the lines that are variable reassignment statements
+carPrice = Number(carPrice.replaceAll(",", ""));
+priceAfterOneYear = Number(priceAfterOneYear.replaceAll("," ""));
 // d) Identify all the lines that are variable declarations
+/*
+let carPrice = "10,000";
+let priceAfterOneYear = "8,543";
+const priceDifference = carPrice - priceAfterOneYear;
+const percentageChange = (priceDifference / carPrice) * 100;*/
 
 // e) Describe what the expression Number(carPrice.replaceAll(",","")) is doing - what is the purpose of this expression?
+/*
+The expression Number(carPrice.replaceAll(",","")) 1. carPrice.replaceAll(",","") removes all commas from the string carPrice.
+ 2. Number() converts the resulting string to a number.
+*/

Sprint-1/interpret/time-format.js

@@ -2,7 +2,6 @@ const movieLength = 8784; // length of movie in seconds
 
 const remainingSeconds = movieLength % 60;
 const totalMinutes = (movieLength - remainingSeconds) / 60;
-
 const remainingMinutes = totalMinutes % 60;
 const totalHours = (totalMinutes - remainingMinutes) / 60;
 
@@ -12,13 +11,24 @@ 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
 
 // b) How many function calls are there?
+// There are 1 function
 
 // c) Using documentation, explain what the expression movieLength % 60 represents
+//The modulo operation (%) calculates the remainder when movieLength is divided by 60.
 
 // d) Interpret line 4, what does the expression assigned to totalMinutes mean?
+// The expression assigned to totalMinutes calculates the total number of whole minutes in the movie's length (in seconds) by removing the leftover seconds and then converting the remaining time to minutes
 
 // e) What do you think the variable result represents? Can you think of a better name for this variable?
-
+/*
+The variable result represents the total time of the movie in the format of hours:minutes:seconds.
+A better name for this variable could be movieTime.
+*/
 // f) Try experimenting with different values of movieLength. Will this code work for all values of movieLength? Explain your answer
+/*
+Yes, the code will work for all values of movieLength.
+The code works by calculating the total hours, minutes, and seconds from the total length of the movie in seconds.
+*/

Sprint-1/interpret/to-pounds.js

@@ -21,7 +21,30 @@ console.log(`£${pounds}.${pence}`);
 // The program then builds up a string representing the price in pounds
 
 // You need to do a step-by-step breakdown of each line in this program
+
 // Try and describe the purpose / rationale behind each step
 
 // To begin, we can start with
 // 1. const penceString = "399p": initialises a string variable with the value "399p"
+
+// 2. const penceStringWithoutTrailingP = penceString.substring(0, penceString.length - 1);
+// Removes the trailing 'p' from the input string
+// Rationale: We need to work with the numeric part of the string
+
+// 3. const paddedPenceNumberString = penceStringWithoutTrailingP.padStart(3, "0");
+// Pads the numeric string with leading zeros to ensure it's at least 3 characters long
+// Rationale: This ensures we can always extract pounds and pence correctly, even for small amounts
+
+// 4. const pounds = paddedPenceNumberString.substring(0, paddedPenceNumberString.length - 2);
+// Extracts all but the last two characters from the padded string to get the pounds amount
+// Rationale: The last two digits represent pence, so the rest is pounds
+
+// 5. const pence = paddedPenceNumberString
+//   .substring(paddedPenceNumberString.length - 2)
+//   .padEnd(2, "0");
+// Extracts the last two characters for pence and pads with zeros if necessary
+// Rationale: Ensures we always have two decimal places for pence
+
+// 6. console.log(`£${pounds}.${pence}`);
+// Outputs the formatted price string with pounds and pence
+// Rationale: Presents the final result in the desired format (£X.XX)