In this simple algorithm practice we’ll reverse a string. We have a couple things to consider in this exercise. Strings are immutable so manipulations on a string will result in a new string that we probably have to assign to a variable. You can get a char at certain position or index in a string. A string is just a grouping of characters.
The Problem points
- We get a string as input
- We need to reverse the string
- Keep punctuation etc.
- Can use some basic array and string methods
Reverse solution with array and string functions
Since a string is immutable we can’t just reposition characters in a string. We can do manipulations on a string which would result in a new string. We use a couple of methods on array and the string. I could have chained the methods here, but to make everthing a little more readable I separated the calls on different lines.
String.prototype.split()
In this case we’ll use the String.prototype.split() method to split the string. The split method will split our string in substring elements. Depending on the argument we pass to the split method we can get varying results. If we don’t pass an argument to the split method, we get an array with one element. When we pass an empty string ” the string is split per character, characters include punctuation and whitespaces.
Array.prototype.reverse()
With the JavaScript reserve method on the array we just reverse all the elements in the array. Something you could also do yourself by looping, but why reinvent the wheel euh reverse method…
Array.prototype.join()
We use the join method on the array to add all the elements together again and return a complete string.
/* SOLUTION 1 */
function reverseString(str) {
var stringArray = str.split('');
stringArray.reverse();
return stringArray.join('');
}
reverseString('The test string');
A loop for reversing a string
Here we’ll use a for loop to reverse a string. We will build the new string by taking a character from the end of the given string. We will concatenate the character on ‘myReversedString’. In these cases we loop over the input string by decrementing our counter, we start at the end.
Then we get the element from the string that is at the current counter value. We concatenate that element to the previous value of ‘myReversedString’. We assign the new result to the ‘myReversedString’ variable. We do this over and over until we got every element from the original string.
Access chars in string with index, like array access
In this case we just access the string by index, like we do with array access syntax. This will return the character at that position in the string. This is a valid feature since ECMAScript 5, it wasn’t support everywhere in the past especially old IE browsers.
/* SOLUTION 2.1 */
function reverseString(str) {
var myReversedString = '';
for (var i = str.length - 1; i >= 0; i--) {
myReversedString += str[i];
}
return myReversedString;
}
reverseString('The test string');
String.prototype.charAt()
Here we use the charAt() function on the string to return the element or character at index. It is more or less the same as above, you’ll just have less trouble with older browsers / standards.
/* SOLUTION 2.2 */
function reverseString(str) {
var myReversedString = '';
for (var i = str.length - 1; i >= 0; i--) {
myReversedString += str.charAt(i);
}
return myReversedString;
}
reverseString('The test string');
