Working with strings in JavaScript
HTML is a text-based, so if you’re reading or writing data on a web page, it’s inevitable that you’re going to have to deal with text. Sometimes you’ll create text yourself, while at other times it will be returned automatically by another function, but any time you handle text in JavaScript, it will be stored in an object called a string. This article explores the ways in which you can manipulate strings to find information, store data, and prepare text for out.
Including a Special Character in a String
The nature of the syntax that JavaScript uses to declare strings prevents us from including some characters simply by typing them literally into the code.
For example, if the start and end of the string is marked with single quote (‘), you can’t type a string that contains an actual quotation mark, as this special character would be misinterpreted as a string start/end marker.For more clarification consider this example:
console.log(‘this’s the Endgame now’)
This will produce a uncaught syntax error.
Other special character mark the location of formatting devices such as tabs or new lines.
How to deal with it?
Special characters are preceded by a backslash itself, and the character that follows it, to be a special character sequence, and performs the necessary translation.If it helps, you think of the backslash character as indicating that the “alternative meaning” of the character should be used. For instance, the line feed character is represented by “n,” but in order to be recognized as a line feed, and not the character “n,” it must be escaped using a backslash(\).
Special character can be used in a number of circumstances. Sometime, we can turn letters of the alphabet into control character by escaping them. At other times, characters may be used as special syntax for a function, in which case they must be escaped in order to represent their literal notation.
Transforming the character of a String
String data is rarely presented in the form in which you want it. However, if your string is in uppercase when you need it in lowercase characters, JavaScript can help ease your worries.
JavaScript has two strings object methods that can transform strings into all lowercase or uppercase characters. To make your string all uppercase, use the toUpperCase method.
To make your string all lowercase, use the toLowerCase method.
note : both the methods are camel case letters and JavaScript is case-sensitive language. This means that language keywords, variables, function names, and any other identifiers must always be typed with a consistent capitalization of letters.
Encoding a URL
URLs reserve a number of characters for special syntax. To include these characters as part of an actual URL — particularly in the case of CGI GET parameters you must encode them with a per cent sign(%) followed by the equivalent ASCII character code.
The escape function saves you from figuring out which characters to encode and what to decode them to. If you pass a string to this function, it returns a duplicate string with all sensitive characters converted to their URL-safe equivalents. As a common example, you might need to pass a URL as a parameter in the query string of another URL :
The value of variable encoded will be now
This value has a number of URL special characters that have been escaped properly, so it can be included safely in the query string of another URL.
Anything that is encoded can be decoded in this world, so as your encoded URL too. If you wish to decode your encoded URL, you have to use escape’s inverse function, unescape.
Comparing Two Strings
Checking the text in a string against a given value(string) is one of the most common thing we all do. String comparison can be used in many ways for example to validate form fields, to parse data, etc.
note : JavaScript has both strict and type–converting comparisons. So it should be known first that how these two operators compare the operands.
A strict comparison (e.g., === ) is only true if the operands are of the same type and the contents match. The more commonly-used abstract comparison (e.g. == ) converts the operands to the same type before making the comparison. For example 42 == “42” will give the result as true whereas
42 === “42” will give the result as false.
So, now that you know which operator to use let’s move on to a simple string comparison example.
The value of the variable idnty will now be “Different”.
The same program can be written in terms of negative comparison. To do this, you would use the inequality operator(!=) or (!==) like so:
The value of the idnty will now be “Different”.
Finding a Substring within a String
JavaScript allows you to check if a piece of text is a part of a larger string, and to know exactly where the text is located within the string. For this you have to use indexOf method. This method takes one argument -the text you want to find and returns the index of that text.
The value of the variable wrd is now 8
String index numbering starts at 0, so although the text “Costanza” starts on the ninth character, its index will be 8.
If the text you searching for doesn’t occur in the string, the method will return an index of -1. Because of this ability of the method we can also test for the existence of required data.
The value of the variable exists will now be true.
As JavaScript is a case-sensitive language, you can’t search for “Singer” in the string ( “Singer” !== “singer” ).
Splitting a String into Substrings
You can extract one continuous piece of text within a string. This might be helpful in many ways for example if you want the root domain name of a URL, CGI variables, or the anchor reference.
To do so you have to use the substring method. This method retrieves the characters between two indexes and returns a new substring. substring method doesn’t replace the original string.
General syntax : string.substring(start, end)
Here you can see the substring method takes two arguments. start that specifies the starting index of the text fragment, and the end that specifies the ending index of the text fragment.
The value of the substr is now Current.
There’s an another method substr which do the same task as the substring method do but there’s a slight difference in both the method. The substr() method is very similar, but the second argument is not for the end index, it’s for the amount of characters.
The value of the variable substr is now Curr.
Thanks for reading this article this far. For any queries, comment down.
CYA.