{"id":65150,"date":"2019-08-01T18:19:35","date_gmt":"2019-08-01T12:49:35","guid":{"rendered":"https:\/\/data-flair.training\/blogs\/?p=65150"},"modified":"2021-02-17T21:32:29","modified_gmt":"2021-02-17T16:02:29","slug":"javascript-strings","status":"publish","type":"post","link":"https:\/\/data-flair.training\/blogs\/javascript-strings\/","title":{"rendered":"JavaScript Strings &#8211; Find Out Different Methods of String Objects!"},"content":{"rendered":"<div class='__iawmlf-post-loop-links' style='display:none;' data-iawmlf-post-links='[{&quot;id&quot;:1454,&quot;href&quot;:&quot;https:\\\/\\\/en.wikipedia.org\\\/wiki\\\/JavaScript&quot;,&quot;archived_href&quot;:&quot;http:\\\/\\\/web-wp.archive.org\\\/web\\\/20251208180004\\\/https:\\\/\\\/en.wikipedia.org\\\/wiki\\\/JavaScript&quot;,&quot;redirect_href&quot;:&quot;&quot;,&quot;checks&quot;:[{&quot;date&quot;:&quot;2025-12-09 07:25:01&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2025-12-12 10:12:19&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2025-12-19 20:12:26&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2025-12-23 14:26:43&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2025-12-26 20:33:05&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2025-12-30 03:46:49&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-01-03 10:04:10&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-01-08 07:59:48&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-01-11 13:08:47&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-01-16 08:13:22&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-01-20 13:51:36&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-01-24 03:23:30&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-01-28 01:26:04&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-01-31 06:28:41&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-02-03 10:56:46&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-02-10 05:25:16&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-02-13 14:40:22&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-02-16 17:27:49&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-02-20 11:10:49&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-02-26 10:59:31&quot;,&quot;http_code&quot;:404},{&quot;date&quot;:&quot;2026-03-02 23:12:45&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-03-07 09:23:37&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-03-16 15:08:09&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-03-20 11:51:02&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-03-26 05:27:11&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-04-01 15:53:39&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-04-05 04:38:58&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-04-10 05:37:32&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-04-14 10:47:54&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-04-17 11:57:53&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-04-21 02:42:11&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-04-24 09:17:36&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-04-28 02:46:05&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-05-01 07:17:08&quot;,&quot;http_code&quot;:429},{&quot;date&quot;:&quot;2026-05-05 18:21:06&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-05-11 11:12:51&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-05-14 16:04:50&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-05-17 16:56:01&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-05-21 17:58:16&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-05-25 08:21:54&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-05-30 04:19:24&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-06-02 22:21:06&quot;,&quot;http_code&quot;:404},{&quot;date&quot;:&quot;2026-06-06 18:08:05&quot;,&quot;http_code&quot;:200},{&quot;date&quot;:&quot;2026-06-11 08:17:02&quot;,&quot;http_code&quot;:200}],&quot;broken&quot;:false,&quot;last_checked&quot;:{&quot;date&quot;:&quot;2026-06-11 08:17:02&quot;,&quot;http_code&quot;:200},&quot;process&quot;:&quot;done&quot;}]'><\/div>\n<p>Any text like <em>\u201cJavaScript\u201d, \u201cHello DataFlair!\u201d or \u201cHow was your day?\u201d<\/em> represents a string. We\u2019ve been using strings for a long time in our programs now, without even knowing it. Today in this JavaScript tutorial we are going to cover an important concept i.e. JavaScript Strings that will help you with every other programming language you wish to study.<\/p>\n<p>After going through our previous blog on <a href=\"https:\/\/data-flair.training\/blogs\/javascript-event-types\/\"><em><strong>JavaScript Event Types<\/strong><\/em><\/a>, we hope you have cleared all your concepts related to events. If you haven\u2019t done so, I highly recommend you go through them before continuing with this topic.<\/p>\n<p><a href=\"https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/08\/Methods-of-JavaScript-Strings.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-66890\" src=\"https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/08\/Methods-of-JavaScript-Strings.jpg\" alt=\"Methods of JavaScript Strings\" width=\"802\" height=\"420\" srcset=\"https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/08\/Methods-of-JavaScript-Strings.jpg 802w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/08\/Methods-of-JavaScript-Strings-150x79.jpg 150w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/08\/Methods-of-JavaScript-Strings-300x157.jpg 300w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/08\/Methods-of-JavaScript-Strings-768x402.jpg 768w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/08\/Methods-of-JavaScript-Strings-520x272.jpg 520w\" sizes=\"auto, (max-width: 802px) 100vw, 802px\" \/><\/a><\/p>\n<p>&nbsp;<\/p>\n<p>After knowing what Event types are, let&#8217;s start with our best tutorial on JavaScript Strings.<\/p>\n<h2>What are JavaScript Strings?<\/h2>\n<p>A string is a set of characters, including<em> letters, numbers, spaces, etc.<\/em> In JavaScript, a String is a global object, a constructor for strings or a sequence of characters. It stores all the textual data in JavaScript; there is no separate datatype for a single character.<\/p>\n<h3>Syntax of JavaScript String<\/h3>\n<p>The syntax of defining a <strong>String literal<\/strong> is as follows:<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"null\">var stringName = \"string \";\r\nvar stringName = \"string\";<\/pre>\n<p>The syntax to create a <strong>String global object<\/strong> looks like this, where data is any object that is convertible to a string:<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"null\">var stringName = new String(data);<\/pre>\n<p>With the introduction of <strong>ECMAScript 2015<\/strong>, string literals can be <strong>\u201cTemplate literals\u201d<\/strong>, enclosed by the <strong>back-ticks (` `)<\/strong>. These allow us to embed an expression into a string by wrapping it in<strong> ${&#8230;}<\/strong> (jQuery syntax). These are also helpful when you want the string to span multiple lines. Its syntax appears as follows:<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"null\">`string [${some expression}]`<\/pre>\n<p><em><strong>Do you know how to create different objects? If not, t<\/strong><\/em><em><strong>hen you must definitely go through our tutorial on<a href=\"https:\/\/data-flair.training\/blogs\/javascript-objects\/\"> JavaScript Objects<\/a><\/strong><\/em><\/p>\n<h4>Multi-line strings<\/h4>\n<p>We can insert a multi-line string with the help of the<strong> newline character (\\n)<\/strong> in a normal string or by using <strong>template literals<\/strong>. Try the codes given below in your console.<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"null\">console.log(\"string line1 \\nstring line2\") \/\/string<\/pre>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"null\">console.log(`string line1\r\nstring line2`) \/\/template literal<\/pre>\n<p>You will get the same result for both the statements that looks as follows:<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"null\">string line1\r\nstring line2<\/pre>\n<h4>Escape notations<\/h4>\n<p style=\"text-align: left\">Escape notations or escape characters in JavaScript help inserting special characters in the webpage without breaking the code. We use the<strong> backslash (\\)<\/strong> character to specify a special character. The following table lists the various escape notations you can use in your JavaScript program:<\/p>\n<table dir=\"ltr\">\n<colgroup>\n<col width=\"158\" \/>\n<col width=\"204\" \/><\/colgroup>\n<tbody>\n<tr>\n<td style=\"text-align: center\"><strong>Notation<\/strong><\/td>\n<td style=\"text-align: center\"><strong>Meaning<\/strong><\/td>\n<\/tr>\n<tr>\n<td style=\"text-align: center\">\\\u2019<\/td>\n<td style=\"text-align: center\">It adds a single quote in the page.<\/td>\n<\/tr>\n<tr>\n<td style=\"text-align: center\">\\\u201d<\/td>\n<td style=\"text-align: center\">It adds a double quote in the page.<\/td>\n<\/tr>\n<tr>\n<td style=\"text-align: center\">\\\\<\/td>\n<td style=\"text-align: center\">It adds a backslash in the page.<\/td>\n<\/tr>\n<tr>\n<td style=\"text-align: center\">\\n (Newline)<\/td>\n<td style=\"text-align: center\">\n<div>\n<div>It takes control to the next line on the page.<\/div>\n<\/div>\n<\/td>\n<\/tr>\n<tr>\n<td style=\"text-align: center\">\\r (Carriage Return)<\/td>\n<td>\n<div>\n<div style=\"text-align: center\">It returns the program control to the beginning without advancing to the next line.<\/div>\n<\/div>\n<\/td>\n<\/tr>\n<tr>\n<td style=\"text-align: center\">\\v (Vertical Tab)<\/td>\n<td style=\"text-align: center\">\n<div>\n<div>It inserts a vertical tab (usually 6 newlines) in the page.<\/div>\n<\/div>\n<\/td>\n<\/tr>\n<tr>\n<td style=\"text-align: center\">\\t (Tab)<\/td>\n<td>\n<div>\n<div style=\"text-align: center\">It inserts a tab (usually 8 spaces) in the page.<\/div>\n<\/div>\n<\/td>\n<\/tr>\n<tr>\n<td style=\"text-align: center\">\\b (Backspace)<\/td>\n<td style=\"text-align: center\">\n<div>\n<div>It moves the program control backwards, to the previous character.<\/div>\n<\/div>\n<\/td>\n<\/tr>\n<tr>\n<td style=\"text-align: center\">\\f (Form Feed)<\/td>\n<td>\n<div>\n<div style=\"text-align: center\">It takes control to the start of the next page i.e. advances one full page automatically.<\/div>\n<\/div>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<h4 style=\"text-align: left\">Long literal strings<\/h4>\n<p style=\"text-align: left\">There is another special use of the backslash character in JavaScript. If you have a long string literal, instead of storing it all in a long -drawn single line, you can test the following two approaches in your console:<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"null\">\"string line1 \" +\r\n\"string line2 \"+\r\n\"string line3 \" \/\/appends multiple strings with the concatenation operator<\/pre>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"null\">\"string line1 \\\r\nstring line2 \\\r\nstring line3 \" \/\/backslash indicating that the string continues on the next line<\/pre>\n<p>Make sure there is no space after the backslash character in your program. Both of these produce the same output, shown below:<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"null\">string line1 string line2 string line3<\/pre>\n<p>Try these codes in your console window, explore and experiment with these and see what happens when you alter the code and how the output changes. You can never practice enough, so keep repeating to master these characters.<\/p>\n<h3>Strings are immutable<\/h3>\n<p>In JavaScript, strings are immutable i.e. they cannot be changed. It is impossible to change the current string or alter a character. The script creates a new string object when you redefine a string value, but it doesn&#8217;t affect the existing string object.<\/p>\n<h3>The length property<\/h3>\n<p>The length property of a JavaScript String returns the length of the string. You can access this property in the same way as you do with all the properties of any object: with a dot operator. Add the following statements in your console to determine the length of the strings, declared with both literal and constructor methods.<\/p>\n<p>Following are the statements you need to execute in the console:<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"null\">var str = \"DataFlair's JavaScript Tutorial\"\r\nvar string = new String(\"DataFlair's JavaScript Tutorial\")\r\nstr \/\/ \"DataFlair's JavaScript Tutorial\"\r\nstr.length \/\/31\r\nstring \/\/ String {\"DataFlair's JavaScript Tutorial\"}\r\nstring.length \/\/ 31<\/pre>\n<p><a href=\"https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-length.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-65507 size-full\" src=\"https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-length.jpg\" alt=\"JavaScript Strings - string length\" width=\"1299\" height=\"741\" srcset=\"https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-length.jpg 1299w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-length-150x86.jpg 150w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-length-300x171.jpg 300w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-length-768x438.jpg 768w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-length-1024x584.jpg 1024w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-length-520x297.jpg 520w\" sizes=\"auto, (max-width: 1299px) 100vw, 1299px\" \/><\/a><\/p>\n<h3>JavaScript Strings Methods<\/h3>\n<p>Now, we are going to look at some of the most common methods JavaScript provides. These will help you in accessing and manipulating the string. But while using them, do remember that strings are immutable in <a href=\"https:\/\/en.wikipedia.org\/wiki\/JavaScript\">JavaScript<\/a>.<\/p>\n<h3>1. Accessing characters<\/h3>\n<p>We will be using the same String object in all the methods we learn about. Thus, it is better if you store the string value in a file rather than repeating it in the console. Use the following string for this section:<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"null\">var string = new String(\"DataFlair's JavaScript Tutorial\");<\/pre>\n<h4>a. charAt()<\/h4>\n<p>This String method returns the character at the specified position.<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"null\">string.charAt(1) \/\/ \u201ca\"<\/pre>\n<p>You can also access a character at a particular position using the <strong>bracket notation.<\/strong><\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"null\">string[1] \/\/ \u201ca\u201d<\/pre>\n<h4>b. charCodeAt()<\/h4>\n<p>It returns a number indicating the Unicode value of the character at the specified position.<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"null\">string.charCodeAt(1) \/\/97<\/pre>\n<p>The methods above return an <strong>empty string<\/strong> if you search for a character at an index that exceeds the length of the string.<\/p>\n<h4>c. indexOf()<\/h4>\n<p>It returns the index of the first occurrence of the specified character in the given string.<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"null\">string.indexOf(\u201ca\u201d) \/\/ 1<\/pre>\n<h4>d. lastIndexOf()<\/h4>\n<p>It returns the index of the last occurrence of the specified character in the given string.<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"null\">string.lastIndexOf(\u201ca\u201d) \/\/29<\/pre>\n<p>The last two methods return<strong> -1<\/strong> if the character you are searching the index for is not present in the string.<\/p>\n<p><a href=\"https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/access-char.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-65508\" src=\"https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/access-char.jpg\" alt=\"access character\" width=\"1299\" height=\"741\" srcset=\"https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/access-char.jpg 1299w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/access-char-150x86.jpg 150w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/access-char-300x171.jpg 300w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/access-char-768x438.jpg 768w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/access-char-1024x584.jpg 1024w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/access-char-520x297.jpg 520w\" sizes=\"auto, (max-width: 1299px) 100vw, 1299px\" \/><\/a><\/p>\n<h3>2. Comparing strings<\/h3>\n<p>Strings are always compared character-by-character in alphabetical order. While comparing, if the first letter is the same for both the strings, only then does it move to the next characters in the strings. But there are some problems with the Unicodes of the characters. A lowercase character always stays greater than an uppercase character. This means that the statement <strong>\u201chello DataFlair\u201d &gt; \u201cJavaScript\u201d<\/strong> returns<strong> true,<\/strong> even though \u2018J\u2019 comes after \u2018h\u2019 in the English dictionary. The reason is that the code for<strong> \u2018J\u2019<\/strong> and<strong> \u2018h\u2019<\/strong> are <strong>74<\/strong> and <strong>104<\/strong> respectively. You can achieve this task with the help of JavaScript methods too.<\/p>\n<h4>a. localeCompare()<\/h4>\n<p>This JavaScript method, inherited by all the String instances returns three values based on the comparison of strings. The value returned by this method is decided as per the following conditions:<\/p>\n<table dir=\"ltr\">\n<colgroup>\n<col width=\"158\" \/>\n<col width=\"204\" \/><\/colgroup>\n<tbody>\n<tr>\n<td style=\"text-align: center\">string1 &gt; string2 i.e string1 occurs before string2<\/td>\n<td style=\"text-align: center\">1<\/td>\n<\/tr>\n<tr>\n<td style=\"text-align: center\">string1 &lt; string2 i.e string1 occurs after string2<\/td>\n<td style=\"text-align: center\">-1<\/td>\n<\/tr>\n<tr>\n<td style=\"text-align: center\">string1 == string2 i.e. they are equivalent<\/td>\n<td style=\"text-align: center\">0<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<p>The following are the statements you need to use to compare two strings directly in the console:<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"null\">var string1 = \u201chello DataFlair\u201d\r\nvar string2 = \u201cJavaScript\u201d\r\nstring1 &gt; string2 \/\/ true\r\nstring1 &lt; string2 \/\/ false\r\nstring1.localeCompare(string2); \/\/ -1\r\nstring2.localeCompare(string1); \/\/ 1\r\nstring2.localeCompare(\u201cJavaScript\u201d); \/\/ 0\r\n\r\n<\/pre>\n<p><a href=\"https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-comp.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-65509\" src=\"https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-comp.jpg\" alt=\"string comparing\" width=\"1299\" height=\"741\" srcset=\"https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-comp.jpg 1299w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-comp-150x86.jpg 150w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-comp-300x171.jpg 300w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-comp-768x438.jpg 768w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-comp-1024x584.jpg 1024w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-comp-520x297.jpg 520w\" sizes=\"auto, (max-width: 1299px) 100vw, 1299px\" \/><\/a><\/p>\n<h3>3. Changing the case<\/h3>\n<p>There may be some instances where we may need to change the case of the strings before proceeding further. This is especially required when we want to avoid the problem with the cases that we discussed above. I want to compare the strings, but with their alphabetical order regardless of their cases. JavaScript provides me with the facility to change the case of the string.<\/p>\n<h4>a. toLowerCase()<\/h4>\n<p>This method converts the given string into a lowercase string.<\/p>\n<h4>b. toUpperCase()<\/h4>\n<p>It converts the string provided into an uppercase string.<\/p>\n<p>The above code returns the expected value after changing case before comparison. You should always use these two methods before comparing strings. Execute the following statements in your browser console to test these methods:<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"null\">str1 = string1.toLowerCase() \/\/ \u201chello datatflair\u201d\r\nstr2 = string2.toLowerCase() \/\/ \u201cjavascript\u201d\r\nstring1 &lt; string2 \/\/ false\r\nstr1 &lt; str2 \/\/ true<\/pre>\n<p><a href=\"https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-case.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-65510\" src=\"https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-case.jpg\" alt=\"string case\" width=\"1299\" height=\"741\" srcset=\"https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-case.jpg 1299w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-case-150x86.jpg 150w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-case-300x171.jpg 300w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-case-768x438.jpg 768w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-case-1024x584.jpg 1024w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-case-520x297.jpg 520w\" sizes=\"auto, (max-width: 1299px) 100vw, 1299px\" \/><\/a><\/p>\n<h3>4. Altering strings<\/h3>\n<p>These methods manipulate the strings in the script. Since Strings are immutable in JavaScript, we cannot alter the original string, but these methods allow us to create new strings.<\/p>\n<h4>a. concat()<\/h4>\n<p>The concat() method in JavaScript concatenates (joins) two or more strings and returns the new string.<\/p>\n<h4>b. toString()<\/h4>\n<p>This method converts the argument passed (object, numbers, etc) to a String object representing the particular data type.<\/p>\n<h4>c. trim()<\/h4>\n<p>It trims i.e. removes all the whitespaces in the string, except for those between the non-empty characters.<\/p>\n<h4>d. valueOf()<\/h4>\n<p>It returns the primitive value equivalent to the specified object. The code below implements the methods above to perform string operations:<\/p>\n<p><strong>Note &#8211;<\/strong> The value of string1 is \u201cHello\u201d, string2 is \u201c DataFlair \u201d and the value of num is 54.<\/p>\n<p><em><strong>Wait! You can&#8217;t move ahead before exploring our most trending blog on<\/strong> <strong><a href=\"https:\/\/data-flair.training\/blogs\/javascript-data-types\/\">JavaScript Data Types<\/a>.<\/strong><\/em><\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"null\">string1.concat(\" DataFlair!\") \/\/ \"Hello DataFlair!\"\r\nnum.toString() \/\/ \"54\"\r\nstring2.trim() \/\/ \"DataFlair\"\r\nstring1.valueOf() \/\/ \"Hello\"<\/pre>\n<p><a href=\"https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-alter.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-65511\" src=\"https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-alter.jpg\" alt=\"string alter\" width=\"1299\" height=\"741\" srcset=\"https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-alter.jpg 1299w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-alter-150x86.jpg 150w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-alter-300x171.jpg 300w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-alter-768x438.jpg 768w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-alter-1024x584.jpg 1024w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/str-alter-520x297.jpg 520w\" sizes=\"auto, (max-width: 1299px) 100vw, 1299px\" \/><\/a><\/p>\n<h3>5. Playing with substrings<\/h3>\n<p>A<strong> substring<\/strong> is a set of characters, combined in a way that they are a part of the string. There are various methods in JavaScript, some of them listed below, to obtain a substring.<\/p>\n<h4>a. substring()<\/h4>\n<p>It extracts the desired section of the string, between the two indexes provided, and returns a new string.<\/p>\n<h4>b. substr()<\/h4>\n<p>This method returns the characters as a string starting from the specified index through the specified number of characters.<\/p>\n<h4>c. split()<\/h4>\n<p>This splits a String object into an array of strings, separated as substrings.<\/p>\n<h4>d. replace()<\/h4>\n<p>This method finds a substring in the regular expression or string and replaces it with a new substring.<\/p>\n<p>Use the following code in your console:<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"null\">string.substring(0, 9) \/\/ \"DataFlair\"\r\nstring.substr(12, 10) \/\/ \"JavaScript\"\r\nstring.split() \/\/ [\"DataFlair's JavaScript Tutorial\"]\r\nstring.replace(\"JavaScript\", \"String\") \/\/ \"DataFlair's String Tutorial\"<\/pre>\n<h2><a href=\"https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/substr.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-65513\" src=\"https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/substr.jpg\" alt=\"substring\" width=\"1299\" height=\"741\" srcset=\"https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/substr.jpg 1299w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/substr-150x86.jpg 150w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/substr-300x171.jpg 300w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/substr-768x438.jpg 768w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/substr-1024x584.jpg 1024w, https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/07\/substr-520x297.jpg 520w\" sizes=\"auto, (max-width: 1299px) 100vw, 1299px\" \/><\/a><\/h2>\n<h2>Summary<\/h2>\n<p>Here we conclude our tutorial on JavaScript Strings. In this article, we took a brief look at what JavaScript Strings are. Also, we discussed the syntax of creating a string, along with the different methods of String objects. Make sure you further practice all the methods and codes in your console too.<\/p>\n<p><strong><em>Next, you must go through our article on <a href=\"https:\/\/data-flair.training\/blogs\/javascript-boolean\/\">JavaScript Boolean<\/a><\/em><\/strong><\/p>\n<p>If you have any queries related to JavaScript Strings, do share with us through the comments.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Any text like \u201cJavaScript\u201d, \u201cHello DataFlair!\u201d or \u201cHow was your day?\u201d represents a string. We\u2019ve been using strings for a long time in our programs now, without even knowing it. Today in this JavaScript&#46;&#46;&#46;<\/p>\n","protected":false},"author":7,"featured_media":66890,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[18979],"tags":[19096,20696,20694,20695],"class_list":["post-65150","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-javascript","tag-javascript-objects","tag-javascript-string-methods","tag-javascript-strings","tag-multi-line-strings"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.4 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>JavaScript Strings - Find Out Different Methods of String Objects! - DataFlair<\/title>\n<meta name=\"description\" content=\"Make yourself aware with different methods of JavaScript Strings. Also you will get to know about how to create strings in JavaScript.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/data-flair.training\/blogs\/javascript-strings\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"JavaScript Strings - Find Out Different Methods of String Objects! - DataFlair\" \/>\n<meta property=\"og:description\" content=\"Make yourself aware with different methods of JavaScript Strings. Also you will get to know about how to create strings in JavaScript.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/data-flair.training\/blogs\/javascript-strings\/\" \/>\n<meta property=\"og:site_name\" content=\"DataFlair\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/DataFlairWS\/\" \/>\n<meta property=\"article:published_time\" content=\"2019-08-01T12:49:35+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-02-17T16:02:29+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/08\/JavaScript-Strings.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"802\" \/>\n\t<meta property=\"og:image:height\" content=\"419\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"DataFlair Team\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@DataFlairWS\" \/>\n<meta name=\"twitter:site\" content=\"@DataFlairWS\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"DataFlair Team\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"9 minutes\" \/>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"JavaScript Strings - Find Out Different Methods of String Objects! - DataFlair","description":"Make yourself aware with different methods of JavaScript Strings. Also you will get to know about how to create strings in JavaScript.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/data-flair.training\/blogs\/javascript-strings\/","og_locale":"en_US","og_type":"article","og_title":"JavaScript Strings - Find Out Different Methods of String Objects! - DataFlair","og_description":"Make yourself aware with different methods of JavaScript Strings. Also you will get to know about how to create strings in JavaScript.","og_url":"https:\/\/data-flair.training\/blogs\/javascript-strings\/","og_site_name":"DataFlair","article_publisher":"https:\/\/www.facebook.com\/DataFlairWS\/","article_published_time":"2019-08-01T12:49:35+00:00","article_modified_time":"2021-02-17T16:02:29+00:00","og_image":[{"width":802,"height":419,"url":"https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/08\/JavaScript-Strings.jpg","type":"image\/jpeg"}],"author":"DataFlair Team","twitter_card":"summary_large_image","twitter_creator":"@DataFlairWS","twitter_site":"@DataFlairWS","twitter_misc":{"Written by":"DataFlair Team","Est. reading time":"9 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/data-flair.training\/blogs\/javascript-strings\/#article","isPartOf":{"@id":"https:\/\/data-flair.training\/blogs\/javascript-strings\/"},"author":{"name":"DataFlair Team","@id":"https:\/\/data-flair.training\/blogs\/#\/schema\/person\/beb0cab24b7aa54423a3b50e669a9dcd"},"headline":"JavaScript Strings &#8211; Find Out Different Methods of String Objects!","datePublished":"2019-08-01T12:49:35+00:00","dateModified":"2021-02-17T16:02:29+00:00","mainEntityOfPage":{"@id":"https:\/\/data-flair.training\/blogs\/javascript-strings\/"},"wordCount":1561,"commentCount":0,"publisher":{"@id":"https:\/\/data-flair.training\/blogs\/#organization"},"image":{"@id":"https:\/\/data-flair.training\/blogs\/javascript-strings\/#primaryimage"},"thumbnailUrl":"https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/08\/Methods-of-JavaScript-Strings.jpg","keywords":["JavaScript Objects","JavaScript String Methods","JavaScript Strings","Multi-line Strings"],"articleSection":["JavaScript Tutorial"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/data-flair.training\/blogs\/javascript-strings\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/data-flair.training\/blogs\/javascript-strings\/","url":"https:\/\/data-flair.training\/blogs\/javascript-strings\/","name":"JavaScript Strings - Find Out Different Methods of String Objects! - DataFlair","isPartOf":{"@id":"https:\/\/data-flair.training\/blogs\/#website"},"primaryImageOfPage":{"@id":"https:\/\/data-flair.training\/blogs\/javascript-strings\/#primaryimage"},"image":{"@id":"https:\/\/data-flair.training\/blogs\/javascript-strings\/#primaryimage"},"thumbnailUrl":"https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/08\/Methods-of-JavaScript-Strings.jpg","datePublished":"2019-08-01T12:49:35+00:00","dateModified":"2021-02-17T16:02:29+00:00","description":"Make yourself aware with different methods of JavaScript Strings. Also you will get to know about how to create strings in JavaScript.","breadcrumb":{"@id":"https:\/\/data-flair.training\/blogs\/javascript-strings\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/data-flair.training\/blogs\/javascript-strings\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/data-flair.training\/blogs\/javascript-strings\/#primaryimage","url":"https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/08\/Methods-of-JavaScript-Strings.jpg","contentUrl":"https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2019\/08\/Methods-of-JavaScript-Strings.jpg","width":802,"height":420,"caption":"Methods of JavaScript Strings"},{"@type":"BreadcrumbList","@id":"https:\/\/data-flair.training\/blogs\/javascript-strings\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Blog Home","item":"https:\/\/data-flair.training\/blogs\/"},{"@type":"ListItem","position":2,"name":"JavaScript Tutorial","item":"https:\/\/data-flair.training\/blogs\/category\/javascript\/"},{"@type":"ListItem","position":3,"name":"JavaScript Strings &#8211; Find Out Different Methods of String Objects!"}]},{"@type":"WebSite","@id":"https:\/\/data-flair.training\/blogs\/#website","url":"https:\/\/data-flair.training\/blogs\/","name":"DataFlair","description":"Learn Today. Lead Tomorrow.","publisher":{"@id":"https:\/\/data-flair.training\/blogs\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/data-flair.training\/blogs\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/data-flair.training\/blogs\/#organization","name":"DataFlair","url":"https:\/\/data-flair.training\/blogs\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/data-flair.training\/blogs\/#\/schema\/logo\/image\/","url":"https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2016\/07\/Data-Flair.png","contentUrl":"https:\/\/data-flair.training\/blogs\/wp-content\/uploads\/sites\/2\/2016\/07\/Data-Flair.png","width":106,"height":48,"caption":"DataFlair"},"image":{"@id":"https:\/\/data-flair.training\/blogs\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/DataFlairWS\/","https:\/\/x.com\/DataFlairWS","https:\/\/www.linkedin.com\/company\/dataflair-web-services-pvt-ltd\/","https:\/\/www.youtube.com\/user\/DataFlairWS"]},{"@type":"Person","@id":"https:\/\/data-flair.training\/blogs\/#\/schema\/person\/beb0cab24b7aa54423a3b50e669a9dcd","name":"DataFlair Team","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/c322416204232f4dd97ef3901b0a499a5d34d7ba7fe333f4bfe53a907873d293?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/c322416204232f4dd97ef3901b0a499a5d34d7ba7fe333f4bfe53a907873d293?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/c322416204232f4dd97ef3901b0a499a5d34d7ba7fe333f4bfe53a907873d293?s=96&d=mm&r=g","caption":"DataFlair Team"},"description":"DataFlair Team specializes in creating clear, actionable content on programming, Java, Python, C++, DSA, AI, ML, data Science, Android, Flutter, MERN, Web Development, and technology. Backed by industry expertise, we make learning easy and career-oriented for beginners and pros alike.","url":"https:\/\/data-flair.training\/blogs\/author\/dfteam3\/"}]}},"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/data-flair.training\/blogs\/wp-json\/wp\/v2\/posts\/65150","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/data-flair.training\/blogs\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/data-flair.training\/blogs\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/data-flair.training\/blogs\/wp-json\/wp\/v2\/users\/7"}],"replies":[{"embeddable":true,"href":"https:\/\/data-flair.training\/blogs\/wp-json\/wp\/v2\/comments?post=65150"}],"version-history":[{"count":13,"href":"https:\/\/data-flair.training\/blogs\/wp-json\/wp\/v2\/posts\/65150\/revisions"}],"predecessor-version":[{"id":66891,"href":"https:\/\/data-flair.training\/blogs\/wp-json\/wp\/v2\/posts\/65150\/revisions\/66891"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/data-flair.training\/blogs\/wp-json\/wp\/v2\/media\/66890"}],"wp:attachment":[{"href":"https:\/\/data-flair.training\/blogs\/wp-json\/wp\/v2\/media?parent=65150"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/data-flair.training\/blogs\/wp-json\/wp\/v2\/categories?post=65150"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/data-flair.training\/blogs\/wp-json\/wp\/v2\/tags?post=65150"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}