diff --git a/Sprint-1/1-key-exercises/1-count.js b/Sprint-1/1-key-exercises/1-count.js index 117bcb2b6e..39d82bcdbd 100644 --- a/Sprint-1/1-key-exercises/1-count.js +++ b/Sprint-1/1-key-exercises/1-count.js @@ -4,3 +4,7 @@ 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 reassigning the variable +// The equal sign is an assignment operator + +console.log(count); \ 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..46958ce3fa 100644 --- a/Sprint-1/1-key-exercises/2-initials.js +++ b/Sprint-1/1-key-exercises/2-initials.js @@ -5,7 +5,9 @@ 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..4cb0af6ca9 100644 --- a/Sprint-1/1-key-exercises/3-paths.js +++ b/Sprint-1/1-key-exercises/3-paths.js @@ -10,14 +10,30 @@ // (All spaces in the "" line should be ignored. They are purely for formatting.) const filePath = "/Users/mitch/cyf/Module-JS1/week-1/interpret/file.txt"; + const lastSlashIndex = filePath.lastIndexOf("/"); 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 +// console.log(`The base part of ${filePath} is ${base}`); + // Create a variable to store the ext part of the variable +let indexOfTheBase = base.lastIndexOf(".") +console.log(base); + +let ext = base.slice(indexOfTheBase); +console.log(ext); +console.log("-----------------------------------------------------------") + +// Create a variable to store the dir part of the filePath variable +console.log(filePath) +console.log(lastSlashIndex) + +let pathToDir = filePath.slice(0, lastSlashIndex) +console.log(pathToDir) + +let indexOfDir = pathToDir.lastIndexOf("/") +console.log(indexOfDir) -const dir = ; -const ext = ; +let dir = pathToDir.slice(indexOfDir + 1) +console.log(dir) -// 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..4e91ec1de0 100644 --- a/Sprint-1/1-key-exercises/4-random.js +++ b/Sprint-1/1-key-exercises/4-random.js @@ -7,3 +7,7 @@ const num = Math.floor(Math.random() * (maximum - minimum + 1)) + minimum; // 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 +console.log(num) +console.log(`Minimum: ${minimum}`); +console.log(`Maximum: ${maximum}`); +console.log(`Generated random number (num): ${num}`); \ 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..e1b1225b71 100644 --- a/Sprint-1/2-mandatory-errors/0.js +++ b/Sprint-1/2-mandatory-errors/0.js @@ -1,2 +1,5 @@ -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 +// 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 text is not a valid javascript syntax, which could cause a syntaxError +// to fix this, a single-line comment marker (//) should be at the beginning of each line. \ 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..3970ff0a65 100644 --- a/Sprint-1/2-mandatory-errors/1.js +++ b/Sprint-1/2-mandatory-errors/1.js @@ -1,4 +1,10 @@ // trying to create an age variable and then reassign the value by 1 -const age = 33; -age = age + 1; +// const age = 33; +// age = age + 1; + +// To do this i will change "const" to "let" +let age = 33; +age = age + 1; // This value is now a valid reassignment + +console.log(age) diff --git a/Sprint-1/2-mandatory-errors/2.js b/Sprint-1/2-mandatory-errors/2.js index e09b89831d..f74a930e2f 100644 --- a/Sprint-1/2-mandatory-errors/2.js +++ b/Sprint-1/2-mandatory-errors/2.js @@ -1,5 +1,12 @@ // 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"; + +// The error here is referenceError +// To fix this, the declaration will have to move to the top + const cityOfBirth = "Bolton"; + +console.log(`I was born in ${cityOfBirth}`); \ 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..413f21a094 100644 --- a/Sprint-1/2-mandatory-errors/3.js +++ b/Sprint-1/2-mandatory-errors/3.js @@ -1,5 +1,5 @@ -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 @@ -7,3 +7,14 @@ 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 + +// JavaScript treats the cardNumber variable as a number primitive. The .slice() method, which is used to extract a section of a sequence, is exclusively available on string and array objects. +// The console output here´s TypeError: cardNumber.slice is not a function +// Yes, the prediction was essentially correct. The core problem is that .slice(). +// The Number object does not have a method named slice. JavaScript reserves this method for sequences like strings and arrays. + +// Fix +const cardNumber = 4533787178994213; +const last4Digits = cardNumber.toString().slice(-4) + +console.log(last4Digits) \ No newline at end of file diff --git a/Sprint-1/2-mandatory-errors/4.js b/Sprint-1/2-mandatory-errors/4.js index 21dad8c5d1..1dd7ebad5f 100644 --- a/Sprint-1/2-mandatory-errors/4.js +++ b/Sprint-1/2-mandatory-errors/4.js @@ -1,2 +1,18 @@ -const 12HourClockTime = "20:53"; -const 24hourClockTime = "08:53"; \ No newline at end of file +// const 12HourClockTime = "20:53"; // Error: variable name can not start with a number +// const 24hourClockTime = "08:53"; // Error: variable name can not start with a number + + +// This is a syntaxError: invalid or unexpected token +// To start, the Variable has to be renamed with a letter on both + +const time24Hour = "20:53"; +const time12Hour = "08:53"; + +// To structure the data for conversion (demonstrating the logic) +const thisIs24HourTime = "20:53"; + +// To convert 20:53 (8:53 PM), you'd need logic: +const thisIs12HourTime = "08:53 PM"; + +console.log(`24-Hour Time: ${thisIs24HourTime}`); +console.log(`12-Hour Time: ${thisIs12HourTime}`); \ 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..5cf038c938 100644 --- a/Sprint-1/3-mandatory-interpret/1-percentage-change.js +++ b/Sprint-1/3-mandatory-interpret/1-percentage-change.js @@ -2,21 +2,54 @@ let carPrice = "10,000"; let priceAfterOneYear = "8,543"; carPrice = Number(carPrice.replaceAll(",", "")); -priceAfterOneYear = Number(priceAfterOneYear.replaceAll("," "")); +priceAfterOneYear = Number(priceAfterOneYear.replaceAll(",", "")); const priceDifference = carPrice - priceAfterOneYear; const percentageChange = (priceDifference / carPrice) * 100; console.log(`The percentage change is ${percentageChange}`); +console.log(carPrice) +console.log(priceAfterOneYear) +console.log(priceDifference) +console.log(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 5 functional call in this file, and they´re on the following line: Line 4: replaceAll, Line 5: replaceAll, Line 10: console.log +carPrice = Number(carPrice.replaceAll(",", "")); +priceAfterOneYear = Number(priceAfterOneYear.replaceAll(",", "")); +Number(...), carPrice.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? +/*After running the code, the error is identified in line 5: +priceAfterOneYear = Number(priceAfterOneYear.replaceAll("," "")); +The error is a SyntaxError because the arguments for the replaceAll() method are not correctly separated. It should be replaceAll(searchValue, replaceValue). +*/ +//To fix insert the required comma separator: priceAfterOneYear = Number(priceAfterOneYear.replaceAll(",", "")); // c) Identify all the lines that are variable reassignment statements +/* Variable reassignment statements change the value of an already declared variable. +This is possible because both variables were declared "let" +The lines that are variable reassignment statement are; +line 4: carPrice = Number(carPrice.replaceAll(",", "")); +line 5: priceAfterOneYear = Number(priceAfterOneYear.replaceAll(",", "")); */ // d) Identify all the lines that are variable declarations +/* This is were new variables are introduce into the scope using "let" or "const". +the following lines are stated to be variable declared; +line 1: "let carPrice" +line 2: "let priceAfterOneYear" +line 7: "const priceDifference" +line 8: "const percentageChange" */ // e) Describe what the expression Number(carPrice.replaceAll(",","")) is doing - what is the purpose of this expression? +/* This expression Number(carPrice.replaceAll(",", "")) is performing data cleaning and type conversion. +carPrice.replaceAll(",", ""): this is the string method, that searches the string stored in carPrice(10,000) for all the occurrences of the comma character (,) +and then replace it with an empty string (""). +The second part is a builth-in function Number(...), that attempt to convert the resulting clean string ("10000") into numeric data type. +*/ + +/* The main purpose is to take a price string formatted for human reading and then convert it into valid number type (10000) so that mathematical calculation can be performed correctly.*/ \ 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..3872491e77 100644 --- a/Sprint-1/3-mandatory-interpret/2-time-format.js +++ b/Sprint-1/3-mandatory-interpret/2-time-format.js @@ -8,18 +8,47 @@ const totalHours = (totalMinutes - remainingMinutes) / 60; const result = `${totalHours}:${remainingMinutes}:${remainingSeconds}`; console.log(result); +console.log(movieLength) +console.log(remainingSeconds) +console.log(totalMinutes) +console.log(remainingMinutes) +console.log(totalHours) // 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? +/* In this program, there are six variable declaration, +the list is as follows: +i. const movieLength, +ii. const remainingSeconds +iii. const totalMinutes +iv. const remainingMinutes +v. const totalHours +vi. const result */ // b) How many function calls are there? +/* There is only 6 function call in the program and the call is console.log(result)*/ // c) Using documentation, explain what the expression movieLength % 60 represents // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators +/* This computes the remainder left over when one operand (movieLength) is divided by a second operand (60) +It is the number of seconds remaining after the total second (movieLength) have been converted into whole minute. +meanwhile they are 60 seconds in a minute, dividing by 60 and taking the remainder will give the seconds that don´t make up a full minute. */ // d) Interpret line 4, what does the expression assigned to totalMinutes mean? +/* Line 4 is const totalMinutes = (movieLength - remainingSeconds) / 60; +The expression calculates the total number of whole minutes contained in the (movieLength) +i.e movieLength - remainingSeconds which subtraction removes the partial seconds, then leaving a value that is divisible perfectly by 60. + +(...) / 60; This division converts the total seconds into total minutes. */ // e) What do you think the variable result represents? Can you think of a better name for this variable? +/* The variable result represent the movie duration formatted as a time string in the structure Hours:Minutes:Seconds ("2:26:24"). +A better descriptive name for this variable for me would be "timeString". */ // f) Try experimenting with different values of movieLength. Will this code work for all values of movieLength? Explain your answer +/* No, this code will not work well for all values of movieLength, specifically for displaying the time correctly. +If any component (totalHours, remainingMinutes, or remainingSeconds) is less than 10, the output will look unusual. +The conversion logic is mathematically sound, but the final output format is unreliable because it does not include padding (leading zeros). +For short movie; If movieLength = 65 seconds, the result is "0:1:5" (0 hours, 1 minute, 5 seconds). This is usually expected to be displayed as "00:01:05". +The expression const result = \${totalHours}:${remainingMinutes}:${remainingSeconds}`;uses simple string interpolation.*/ \ No newline at end of file diff --git a/Sprint-1/3-mandatory-interpret/3-to-pounds.js b/Sprint-1/3-mandatory-interpret/3-to-pounds.js index 60c9ace69a..d704a609dc 100644 --- a/Sprint-1/3-mandatory-interpret/3-to-pounds.js +++ b/Sprint-1/3-mandatory-interpret/3-to-pounds.js @@ -25,3 +25,17 @@ console.log(`£${pounds}.${pence}`); // To begin, we can start with // 1. const penceString = "399p": initialises a string variable with the value "399p" + +// 3. const penceStringWithoutTrailingP = penceString.substring(0, penceString.length -1); +// cleaning the trailing P character. it uses the string´s length minus 1 as the end index for substring(), this leave only the numeric value while drop the last character. + +// 8. const paddedPenceNumberString = penceStringWithoutTrailingP.padStar(3, "0"); Padding- ensure the numeric string is at least three characters long by prepending zeros. +// this is important for separating pounds from pence especially when values is less than 100p + +// 9. const pounds = paddedPenceNumberString.substring(0, paddedPenceNumberString.length - 2); Extracting pounds component, this uses substring() +// to take all character from the start (index 0) up to, but not including the last two characters, they are always pence. + +// 14. const pence = paddedPenceNumberString.substring(paddedPenceNumberString.length - 2).padEnd(2, "0"); Extracting and formatting price- +// Extracts the pence component (the last two digits) and ensures they are always two digits long by padding the end with a zero if needed (though not needed for "99"). + +// 18. console.log(\£${pounds}.${pence}`);` Output: Format the extracted components into the standard currency display £3.99. \ 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..c71ecc2ec7 100644 --- a/Sprint-1/4-stretch-explore/chrome.md +++ b/Sprint-1/4-stretch-explore/chrome.md @@ -11,8 +11,12 @@ In the Chrome console, invoke the function `alert` with an input string of `"Hello world!"`; What effect does calling the `alert` function have? +// A pop-up window appears in the browser window, displaying the message "Hello world" along with a button "Ok". 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? +// A pop-up dialog box appears in the browser window. This box displays the message "What is your name?" and contains a text input field along with "OK" and "Cancel" buttons. This dialog requires user interaction (typing text and clicking a button) before the browser can proceed. + What is the return value of `prompt`? +// when i type my name "Ifeyinwa Ofulue", the return value of the prompt was "Ifeyinwa Ofulue". diff --git a/Sprint-1/4-stretch-explore/objects.md b/Sprint-1/4-stretch-explore/objects.md index 0216dee56a..2760eaca7e 100644 --- a/Sprint-1/4-stretch-explore/objects.md +++ b/Sprint-1/4-stretch-explore/objects.md @@ -5,12 +5,36 @@ 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? +// I got the output; f log() ((native code)) Now enter just `console` in the Console, what output do you get back? +// I got quite number of output; { + assert: f assert() + clear: f clear() + count: f count() + countReset: f countReset() + info: f info() + log: f log() + profile: f profile() + table: f table() + and many more. +} Try also entering `typeof console` +// I got the output: "object" Answer the following questions: What does `console` store? +// The variable console stores a reference to a global Host Object provided by the browser environment. This object is a container (or dictionary) that holds a collection of methods (functions) + What does the syntax `console.log` or `console.assert` mean? In particular, what does the `.` mean? +// The syntax represents Property Access on an object. + +console: is the object itself. + +. (Dot Notation): The dot (.) is the Member Access Operator. It tells the JavaScript engine to look inside the console object for a specific property. + +log or assert: These are the properties (or keys) of the console object. Since these properties hold functions as their values, they are specifically referred to as methods of the console object. + +// In otherwords, console.log means: Access the property named log that resides inside the console object.