London | 26-ITP-Jan | Carlos Abreu | Sprint 1 | Module Structuring and Testing Data

.gitignore

@@ -1,4 +1,7 @@
 node_modules
 .DS_Store
 .vscode
-**/.DS_Store
+**/.DS_Store
+.gitignore
+.git
+

Sprint-1/1-key-exercises/1-count.js

@@ -4,3 +4,8 @@ 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
+
+/* Solution of the problem:
+ * The line 3 is increasing the variable count by 1 and assigning the result to count variable on the left hand  * side.   
+ */
+

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[0]}${middleName[0]}${lastName[0]}`;
+console.log(initials);
 
 // https://www.google.com/search?q=get+first+character+of+string+mdn
 

Sprint-1/1-key-exercises/3-paths.js

@@ -17,7 +17,8 @@ console.log(`The base part of ${filePath} is ${base}`);
 // Create a variable to store the dir part of the filePath variable
 // Create a variable to store the ext part of the variable
 
-const dir = ;
-const ext = ;
+const dir = filePath.slice(0, lastSlashIndex);
+const ext = base.slice(base.lastIndexOf(".") + 1);
 
-// https://www.google.com/search?q=slice+mdn
+console.log(`The dir part of the ${filePath} is ${dir} and the extension is ${ext}`);
+// https://www.google.com/search?q=slice+mdn

Sprint-1/1-key-exercises/4-random.js

@@ -3,7 +3,38 @@ const maximum = 100;
 
 const num = Math.floor(Math.random() * (maximum - minimum + 1)) + minimum;
 
+console.log(num);
+
+for (let i = 0; i < 10; i++) {
+	console.log(Math.floor(Math.random() * (maximum - minimum + 1)) + minimum);
+}
+
 // 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
+/** These set the range between 1 to 100
+ * const minimum = 1;
+ * const maximum = 100;
+ *
+ * The expression inside Math.random() (maxim - minimum + 1) calculates the range like: 100 - 1 + 1 = 100
+ * And the function Math.random() returns a random decimal number between 0 (inclusive) and 1 (exclusive) but never exactly 1
+ * The multiplication inside the inner parenthesis Math.random() * (maximum - minimum + 1) computes the ranges between 0 (inclusive) and 100 (exclusive)
+ *
+ * The function Math.floor() rounds down to the nearest integer like:
+ * 14.9 -> 14 
+ * 88.3 -> 88
+ *
+ * Adding the minimum the Math.floor(...) + minimum changes the range from (0, 99) to (1, 100)
+ *
+ * Actually the order of calculation is the following:
+ * 1. (maximum - minimu + 1)
+ * 2. Math.random() is called
+ * 3. Then the multiplication occurs 
+ * 4. The function Math.floor() is applied
+ * 5. And the minimum is added at end
+ *
+ * Each time the program is run it'll produce a different number between 1 and 100.
+ */
+
 // 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

Sprint-1/2-mandatory-errors/0.js

@@ -1,2 +1,19 @@
-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?
+// 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?
+
+	// There are 3 ways to do that.
+
+	// 1. Using double slash at beginning of each line
+        // 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. Using single slash and asterisk at beginner and asterisk and slash at end with this line inside
+	/**
+	 *
+	 * 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?
+	 */
+
+	// 3. Using backtick at beginner and end of these two lines.
+	`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?`

Sprint-1/2-mandatory-errors/1.js

@@ -1,4 +1,11 @@
 // trying to create an age variable and then reassign the value by 1
 
-const age = 33;
+/** const age = 33;
 age = age + 1;
+*/
+
+let age = 33; // javascript keyword "const" can't be reassign instead we need to use the keyword "let"
+age = age + 1;
+
+console.log(age);
+

Sprint-1/2-mandatory-errors/2.js

@@ -1,5 +1,10 @@
 // Currently trying to print the string "I was born in Bolton" but it isn't working...
 // what's the error ?
 
-console.log(`I was born in ${cityOfBirth}`);
+/** console.log(`I was born in ${cityOfBirth}`);
 const cityOfBirth = "Bolton";
+*/
+
+const cityOfBirth = "Bolton"; // the declaration must be assign before to be able to call it
+console.log(`I was born in ${cityOfBirth}`);
+

Sprint-1/2-mandatory-errors/3.js

@@ -1,9 +1,24 @@
-const cardNumber = 4533787178994213;
-const last4Digits = cardNumber.slice(-4);
+// const cardNumber = 4533787178994213;
+// const last4Digits = cardNumber.slice(-4);
 
 // 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
 // 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
+
+/**
+ * When I run this code I get:
+ *
+ * TypeError: cardNumber.slice is not a function.
+ *
+ * To fix the error we need to convert the number data type to string first, then use slice function like below
+ */
+
+
+const cardNumber = 4533787178994213;
+const last4Digits = cardNumber.toString().slice(-4);
+
+console.log(last4Digits);
+

Sprint-1/2-mandatory-errors/4.js

@@ -1,2 +1,10 @@
-const 12HourClockTime = "20:53";
-const 24hourClockTime = "08:53";
+// const 12HourClockTime = "20:53";
+// const 24hourClockTime = "08:53";
+
+/**
+ * I've changed the variable names to tweelveHourClockTime and twentyFourHourClockTime since JavaScript doesn't allow variable names starting with numbers.
+ */
+
+const twelveHourClockTime = "20:53";
+const twentyFourHourClockTime = "08:53";
+

Sprint-1/3-mandatory-interpret/1-percentage-change.js

@@ -2,7 +2,8 @@ let carPrice = "10,000";
 let priceAfterOneYear = "8,543";
 
 carPrice = Number(carPrice.replaceAll(",", ""));
-priceAfterOneYear = Number(priceAfterOneYear.replaceAll("," ""));
+// priceAfterOneYear = Number(priceAfterOneYear.replaceAll("," ""));
+priceAfterOneYear = Number(priceAfterOneYear.replaceAll(",", ""));
 
 const priceDifference = carPrice - priceAfterOneYear;
 const percentageChange = (priceDifference / carPrice) * 100;
@@ -12,11 +13,29 @@ 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 are two functions call: Number() and replaceAll()
+ * And the function call is made on lines 4 and 5
+ */
 
 // 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?
+/**
+ * The error is coming from line 5 and it's because it's missing a comma between the inner rounded braces ("," "").
+ * To fix it is easy: Just insert a comma between the double commas (",", "")
+ */
 
 // c) Identify all the lines that are variable reassignment statements
+/**
+ *  The reassignment lines are 4 and 5
+ */
 
 // d) Identify all the lines that are variable declarations
+/**
+ * Lines 1, 2, 8 and 9
+ */
 
 // e) Describe what the expression Number(carPrice.replaceAll(",","")) is doing - what is the purpose of this expression?
+/**
+ * First the expression apply the function replaceAll(",", "") to strip out all comma in the string  
+ * assign to a variable carPrice then the function Number() convert the string into a number.
+ */

Sprint-1/3-mandatory-interpret/2-time-format.js

@@ -12,14 +12,45 @@ 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 six variable declarations
+ */
 
 // b) How many function calls are there?
+/**
+ * There is only one function call console.log()
+ */
 
 // c) Using documentation, explain what the expression movieLength % 60 represents
 // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators
+/**
+ * It represents the remainder when movieLength is divided by 60 to extract the seconds from a total number of seconds.
+ */
 
 // d) Interpret line 4, what does the expression assigned to totalMinutes mean?
+/**
+ * 1. This line calculates the total number of whole minutes in the movie by subtracting the remainder seconds from the total seconds and giving the number of seconds that can be evenly divided into minutes (a multiple of 60) - movieLength - remainingSeconds
+ * 2. Then divides that result by 60 to convert from seconds to minutes - / 60
+ */
 
 // e) What do you think the variable result represents? Can you think of a better name for this variable?
+/**
+ * result is too vague and tells us almost nothing.
+ * Better name can be: 
+ * timeDisplay - shows it's meant to display time
+ * movieDuration - relates what is being calculated.
+ */
 
 // f) Try experimenting with different values of movieLength. Will this code work for all values of movieLength? Explain your answer
+/**
+ * No leading zeros for single digits:
+ *
+ * Current output: "2:5:7" for 2 hours, 5 minutes, 7 seconds
+ * Normally standard time format expects: "02:05:07"
+ * 
+ * No validation for invalid inputs:
+ * 
+ * movieLength = -30;    // "-0:-0:-30" (doesn't make sense)
+ * movieLength = 60.5;   // "0:1:0.5" (shows decimal seconds)
+ * movieLength = "abc";  // NaN:NaN:NaN (it breaks completely)
+ */

Sprint-1/3-mandatory-interpret/3-to-pounds.js

@@ -24,4 +24,56 @@ console.log(`£${pounds}.${pence}`);
 // 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"
+
+// This represents a price in pence (the "p" at the end indicates pence in UK pricing style).
+
+/**
+ * 2. const penceStringWithoutTrailingP = penceString.substring(0, penceString.length - 1);
+ *
+ * penceString.length is 4 (characters: '3', '9', '9', 'p').
+ * penceString.length - 1 is 3.
+ * penceString.substring(0, 3) extracts characters from index 0 up to but not including index 3.
+ * Removes the trailing 'p' so the numeric part "399" can be processed.
+ */
+
+/**
+ * 3. const paddedPenceNumberString = penceStringWithoutTrailingP.padStart(3, "0");
+ *
+ * penceStringWithoutTrailingP is "399".
+ * "399".padStart(3, "0") ensures the string is at least 3 characters long, padding from the left with '0' if needed.
+ * Since "399" is already length 3, it stays "399".
+ * Objective: It normalizes in UK currrency such that the pence values like "99p" (which becomes "099") so pounds/pence splitting works correctly.
+ */
+
+/**
+ * 4. const pounds = paddedPenceNumberString.substring(0, paddedPenceNumberString.length - 2);
+ *
+ * paddedPenceNumberString.length is 3.
+ * paddedPenceNumberString.length - 2 is 1.
+ * paddedPenceNumberString.substring(0, 1) extracts characters from index 0 to 1 exclusive → index 0 only → '3'.
+ * For "399", pounds part is "3".
+ * For "099" (if originally "99p"), pounds part would be "0".
+ */
+
+/**
+ * 5. const pence = paddedPenceNumberString
+ *
+ * .substring(paddedPenceNumberString.length - 2)
+ * .padEnd(2, "0");
+ *
+ * paddedPenceNumberString.length - 2 is 1.
+ * paddedPenceNumberString.substring(1) extracts from index 1 to end → "99".
+ * "99".padEnd(2, "0"): it ensures string is at least length 2, padding at end with '0' if needed.
+ * In this case, it's already length 2, so stays "99".
+ * If pence part were "5", it would become "50" (pence shown as 2 digits).
+ */
+
+/**
+ * 6. console.log(`£${pounds}.${pence}`);
+ *
+ * Uses template literal to format output as £3.99.
+ * Joins pounds and pence with a decimal point.
+ */
+

Sprint-1/4-stretch-explore/chrome.md

@@ -16,3 +16,31 @@ Now try invoking the function `prompt` with a string input of `"What is your nam
 
 What effect does calling the `prompt` function have?
 What is the return value of `prompt`?
+
+ANSWER:
+
+1. alert("Hello world!");
+
+When we type this into the console and press Enter:
+A small pop-up window (dialog box) appears in the Chrome browser window.
+It will show the message: "Hello world!".
+Then there is an OK button to close it.
+The console shows undefined after the dialog is closed because alert() itself does not return a value (i.e., it returns undefined).
+The alert function is used to show a simple message to the user. 
+Execution of JavaScript is paused until the user clicks OK.
+
+2. let myName = prompt("What is your name?");
+
+When we type this and press Enter:
+Another pop-up dialog appears, but this time with a text input field.
+It will display the prompt message: "What is your name?".
+There will be an OK button and a Cancel button.
+When typed something and press OK (or just press OK without typing), the dialog closes.
+If you type a name and press OK, the return value (stored in myName) is the string entered.
+If pressed Cancel, the return value is null.
+If pressed OK without typing anything, the return value is an empty string "".
+
+3. Checking the return value
+
+After running prompt, type myName in the console and press Enter. It will show the value that I have entered (or null or "").
+

Sprint-1/4-stretch-explore/objects.md

@@ -14,3 +14,44 @@ Answer the following questions:
 
 What does `console` store?
 What does the syntax `console.log` or `console.assert` mean? In particular, what does the `.` mean?
+
+ANSWERS:
+
+When you type console.log and hit enter:
+You get back the function definition for log:
+
+ƒ log() { [native code] }
+
+This shows that console.log is a built-in function (native code) that outputs messages to the console.
+
+When you type just console and hit enter:
+You get back an object containing many methods and properties:
+
+Console {debug: ƒ, error: ƒ, info: ƒ, log: ƒ, warn: ƒ, …}
+
+Expanding this reveals all the available console methods like assert, clear, count, group, table, time, trace, etc.
+
+When you type typeof console:
+You get back:
+
+"object"
+
+ANSWERING THE QUESTIONS:
+
+1. What does console store?
+
+console stores an object that contains methods (functions) for debugging and logging information to the browser's developer console. It's a built-in object provided by the browser's JavaScript environment that gives developers tools to output messages, test code, measure performance, and debug applications.
+
+2. What does the syntax console.log or console.assert mean? In particular, what does the . mean?
+
+The dot (.) is the property accessor or member operator in JavaScript. It's used to access properties (which can be values or functions/methods) of an object.
+So:
+console is an object
+. means "access a property of this object"
+log is a property of the console object that happens to be a function (method)
+console.log together means "access the 'log' property from the 'console' object"
+When we execute console.log("Hello"), we're:
+Starting with the console object
+Using the dot operator to access its log property (which is a function)
+Calling that function with the argument "Hello"
+