Palindrome Checker Project challenge

1

Hie Everyone.I’m busy designing a small UI for the Palindrome Checker under the Javascript Algorithms And Data Structures section.However i have encountered a small challenge.I’m struggling to understand why the variable “textFormatted” changes on the second output.Any ideas/suggestions? I need to maintain the original "textFormatted’ after the code block.The identical code snippet is as follows.

//Breaking down string into an array
let textValue = "This is a test";
const regex = /[^a-z]+/gi;
let textFormatted = ((textValue.replace(regex, "")).toLowerCase()).split('');
console.log(textFormatted);
//Outputs [ 't', 'h', 'i', 's', 'i', 's', 'a', 't', 'e', 's', 't' ]

let textReversed = textFormatted.reverse();
console.log(textFormatted);
//Outputs [ 't', 's', 'e', 't', 'a', 's', 'i', 's', 'i', 'h', 't' ]
2

reverse mutates the original array. So the line where you initiate textReversed is also reversing the original TestFormatted array.

To prevent the original array from being mutated, you can create a copy of the original array. There’s alot of ways to create a copy of an array, here’s a couple of way to create a shallow copy.

//using slice.
let textReversed = textFormatted.slice().reverse();

//using spread
let textReversed = [...textFormatted].reverse();
3

Thank you.Well explained and much appreciated

However i have a fresh new challenge.My javascript code runs once.I need to refresh the webpage to to do a 2nd palindrome check.Any idea on what i should look at?

https://codepen.io/dchishakwe/pen/XWWWjNp

4

Hie Everyone.I’m busy designing a small UI for the Palindrome Checker under the Javascript Algorithms And Data Structures section.However i have encountered another small challenge.

My code only runs once.I need to refresh the webpage to to do a 2nd palindrome check.Any idea on what i should look at?

Project Link : https://codepen.io/dchishakwe/pen/XWWWjNp

5

Hey, sorry i just saw this on the other post.

let msgbox = document.querySelector('.msg');
msgbox.innerHTML = '<h1>Not a palindrome</h1>'; 
setTimeout(() => msgbox.remove(),3000);

You’re removing your msgbox, so when you try to find it on the next attempt, you’ve got nothing to find, technically you can do a second palindrome, it just has to be within 3 seconds of the first one.