The Code for REWIND
//Get the string from page
//Controller function
function getValue(){
document.getElementById("alert").classList.add("invisible");
let userString = document.getElementById("userString").value;
let revString = reverseString(userString);
displayString(revString);
}
//Reverse the string
//logic function
function reverseString(userString){
let reverseString = [];
//reverse a string using a for loop
for (let index = userString.length - 1; index > 0; index--) {
reverseString += userString[index];
}
return reverseString;
}
//Display reversed string to user
// View Function
function displayString(reverseString){
//write to the page
document.getElementById("msg").innerHTML = `Your string reversed is: ${reverseString}`;
//show the alert box
document.getElementById("alert").classList.remove("invisible");
}
The code is structured in three functions.
Function getValue
The getValue function is the controller function of the app. It does three tasks. This function takes in the input string value from user. This value is then passed to the reverseString function as a parameter. Finally the displayString function is called with reverseString function passed into it as a parameter
Function reverseString
The reverseString function uses a "for loop" to iterate through a string, however this iteration is performed in reverse by starting with the last index position and decrementing each loop.
Function displayString
The displayString function displays the string that was input from user in reverse order on the screen along with a alert.