The JavaScript String Object Pt. 2
A Brief Introduction
In our last tutorial, we talked about the basics of dealing with strings in JavaScript. Today, we’ll expand on the previous tutorial and describe some of the more advanced methods that the string object has to offer us. You should find that you can pick apart a string to the minute details to get exactly what you need out of it when using the JavaScript language.
As usual, we’ll be putting together a very simple HTML page with a single div. This div will be used to inject the results of our JavaScript functions into so that you will be able to view them. Here’s what the simple HTML setup looks like initially:
Step 2 – Part 1: The Replace( ) Method
The JavaScript replace( ) method allows us to pinpoint a specific piece of a string, and replace it with another string of our choice. In the following code, you’ll see that we replace the word “World” with the word “Whoever” in our original string by using the replace method. Here’s what that looks like in JavaScript:
Viewing this in the browser will result in the string “Hello Whoever” being displayed. We simply passed 2 string arguments to the replace method. The first was what part of the string we’d like to replace, the second was what we’d like to replace it with. Simple enough? Let’s move on!
Part 2: The IndexOf( ) method
Sometimes it helps to be able to find exactly where some characters are located inside of a string. The indexOf( ) method will return to us the number of where in a string our specified characters begin. Take a look at the following example for a quick reference:
If you load up the previous code into your browser, you’ll notice that JavaScript simply returns the number 4. What this tells us is that the first position of the letter “o” is located at the 4th position in our string (starting with zero and counting up). We could use this in conjunction with replace( ) also if we needed to swap something into this position.
Part 3: The Slice( ) method
Another handy string method built into JavaScript is the Slice( ) method. This takes only a single argument to tell JavaScript at what index you’d like to slice your string, and it will chop it all the way up to that point and spit out whatever’s left. Here’s an example:
Load this page up in the browser and you’ll see that our “Hello World” string has been chopped down to just say “orld”. JavaScript has counted up to the 7th character in our string and cut off everything that’s come before it.
Part 4: The split( ) Method
Last but not least is the JavaScript split method. This takes a string and splits it into an array of strings based on the index you pass into it. Here’s an example of the split( ) method:
A Few Last Words
JavaScript comes with lots of ways to manipulate strings, and knowing the common ones is sure to come in handy in the future.
In our last tutorial, we talked about the basics of dealing with strings in JavaScript. Today, we’ll expand on the previous tutorial and describe some of the more advanced methods that the string object has to offer us. You should find that you can pick apart a string to the minute details to get exactly what you need out of it when using the JavaScript language.
We used over 10 web hosting companies before we found Server Intellect. Our new server with cloud hosting,was set up in less than 24 hours. We were able to confirm our order over the phone. They responded to our inquiries within an hour. Server Intellect’s customer support and assistance are the best we’ve ever experienced.
Step 1: The HTMLAs usual, we’ll be putting together a very simple HTML page with a single div. This div will be used to inject the results of our JavaScript functions into so that you will be able to view them. Here’s what the simple HTML setup looks like initially:
Step 2 – Part 1: The Replace( ) Method
The JavaScript replace( ) method allows us to pinpoint a specific piece of a string, and replace it with another string of our choice. In the following code, you’ll see that we replace the word “World” with the word “Whoever” in our original string by using the replace method. Here’s what that looks like in JavaScript:
Code Block
main.js
window.onload = function () {
var resultDiv = document.getElementById('results');
var oldString = "Hello World";
var newString = oldString.replace("World", "Whoever")
resultDiv.innerHTML = newString;
}
Part 2: The IndexOf( ) method
Sometimes it helps to be able to find exactly where some characters are located inside of a string. The indexOf( ) method will return to us the number of where in a string our specified characters begin. Take a look at the following example for a quick reference:
Code Block
main.js
window.onload = function () {
var resultDiv = document.getElementById('results');
var oldString = "Hello World";
var newString = oldString.replace("World", "Whoever")
var newString = oldString.indexOf("o");
resultDiv.innerHTML = newString;
}
Part 3: The Slice( ) method
Another handy string method built into JavaScript is the Slice( ) method. This takes only a single argument to tell JavaScript at what index you’d like to slice your string, and it will chop it all the way up to that point and spit out whatever’s left. Here’s an example:
Code Block
main.js
window.onload = function () {
var resultDiv = document.getElementById('results');
var oldString = "Hello World";
var newString = oldString.replace("World", "Whoever")
//var newString = oldString.indexOf("o");
var newString = oldString.slice(7);
resultDiv.innerHTML = newString;
}
Part 4: The split( ) Method
Last but not least is the JavaScript split method. This takes a string and splits it into an array of strings based on the index you pass into it. Here’s an example of the split( ) method:
Code Block
main.js
window.onload = function () {
var resultDiv = document.getElementById('results');
var oldString = "Hello World";
var newString = oldString.replace("World", "Whoever")
//var newString = oldString.indexOf("o");
//var newString = oldString.slice(7);
var newString = oldString.split("");
resultDiv.innerHTML = newString;
}
JavaScript comes with lots of ways to manipulate strings, and knowing the common ones is sure to come in handy in the future.
Yes, it is possible to find a good web host. Sometimes it takes a while to find one you are comfortable with. After trying several, we went with Server Intellect and have been very happy thus far. They are by far the most professional, customer service friendly and technically knowledgeable host we’ve found so far.
JavaScript Strings.zip