19 JavaScript String Methods
Published: 2020-06-02 03:53:45

<!-- wp:paragraph -->
<p>In this javascript tutorial, you will learn most useful and important string methods/functions in javascript. Javascript string methods help to manipulate strings in javascript.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>We will demonstrate javascript <a href="https://www.tutsmake.com/javascript-string/">string</a> methods like javascript string replace, javascript string contains, javascript string length, javascript string concatenation, javascript string substring, remove the character from string javascript, javascript string uppercase, javascript string lowercase, string trim, tostring method, a match in the string, split string in javascript,<br> javascript string substr, trim string,  <a href="https://www.tutsmake.com/javascript-arrays/">array</a> to comma-separated string, etc.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>You need to know some of the most important and useful javascript string methods/Functions. </p>
<!-- /wp:paragraph -->

<!-- wp:heading -->
<h2>JavaScript String Methods</h2>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>The following important and useful javascript string methods:</p>
<!-- /wp:paragraph -->

<!-- wp:list -->
<ul><li> Length Method</li><li> toLocaleLowerCase() Method</li><li> toLocaleLowerCase() Method</li><li> indexOf() Method</li><li> search() Method</li><li> slice() Method</li><li> substring() Method</li><li> substr() Method</li><li> replace() Method</li><li> includes() Method</li><li> concat() Method</li><li> charAt() Method</li><li> charCodeAt() Method</li><li> lastIndexOf() Method</li><li> trim() Method</li><li> match() Method</li><li> split() Method</li><li> toString() Method</li><li> valueOf() Method</li></ul>
<!-- /wp:list -->

<!-- wp:heading {"level":3} -->
<h3>1. length() Method</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>It is used to count the number of characters in a string javascript. </p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":4} -->
<h4>Example</h4>
<!-- /wp:heading -->

<!-- wp:syntaxhighlighter/code {"language":"jscript"} -->
<pre class="wp-block-syntaxhighlighter-code">var lng = "Hello Tutsmake";
var x = lng.length;</pre>
<!-- /wp:syntaxhighlighter/code -->

<!-- wp:preformatted -->
<pre class="wp-block-preformatted">Output <br><br>// return <br>14</pre>
<!-- /wp:preformatted -->

<!-- wp:heading {"level":3} -->
<h3> 2. toLocaleLowerCase() Method</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>The javascript  toLocaleLowerCase() is used to changed string into lower case. </p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":4} -->
<h4>Example</h4>
<!-- /wp:heading -->

<!-- wp:syntaxhighlighter/code {"language":"jscript"} -->
<pre class="wp-block-syntaxhighlighter-code">var str = "Hello Dev!";
var res = str.toLocaleLowerCase();</pre>
<!-- /wp:syntaxhighlighter/code -->

<!-- wp:preformatted -->
<pre class="wp-block-preformatted">Output<br>// return<br>hello dev!</pre>
<!-- /wp:preformatted -->

<!-- wp:heading {"level":3} -->
<h3>3. toLocaleUpperCase() Method</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>The javascript toLocaleUpperCase () is used to changed string into upper case. </p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":4} -->
<h4>Example</h4>
<!-- /wp:heading -->

<!-- wp:syntaxhighlighter/code {"language":"jscript"} -->
<pre class="wp-block-syntaxhighlighter-code">var str = "Hello Dev!";
var res = str.toLocaleUpperCase();</pre>
<!-- /wp:syntaxhighlighter/code -->

<!-- wp:preformatted -->
<pre class="wp-block-preformatted">Output<br>// return<br>HELLO DEV!</pre>
<!-- /wp:preformatted -->

<!-- wp:heading {"level":3} -->
<h3>4. indexof() Method</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>The indexof () method returns the first position of a specified value in a string.</p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":4} -->
<h4>Example </h4>
<!-- /wp:heading -->

<!-- wp:syntaxhighlighter/code {"language":"jscript"} -->
<pre class="wp-block-syntaxhighlighter-code"> var txt = "Lets find where 'pen' occurs!";
 var test = txt.indexOf("pen");</pre>
<!-- /wp:syntaxhighlighter/code -->

<!-- wp:preformatted -->
<pre class="wp-block-preformatted">Output<br><br>// return <br>17</pre>
<!-- /wp:preformatted -->

<!-- wp:html -->
<div class="gen-info-box">
<h4>Recommended Post</h4>
<a href="https://www.tutsmake.com/javascript-important-array-methods/">18 Javascript Array Methods You should know</a>
</div>
<!-- /wp:html -->

<!-- wp:heading {"level":3} -->
<h3>5. search() Method</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>The javascript search () method searches a string for the specified value, and returns the status of the match.</p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":4} -->
<h4>Example </h4>
<!-- /wp:heading -->

<!-- wp:syntaxhighlighter/code {"language":"jscript"} -->
<pre class="wp-block-syntaxhighlighter-code">var str = "hello dev!"; 
var n = str.search("dev");</pre>
<!-- /wp:syntaxhighlighter/code -->

<!-- wp:preformatted -->
<pre class="wp-block-preformatted">Output<br>//Return<br>6</pre>
<!-- /wp:preformatted -->

<!-- wp:heading {"level":3} -->
<h3>6. slice() Method</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>The slice () method removes the parts of a string and returns the extracted parts to a new string.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>Use the Start and End Ultimate to specify the part of the string that you want to remove.</p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":4} -->
<h4>Example</h4>
<!-- /wp:heading -->

<!-- wp:syntaxhighlighter/code {"language":"jscript"} -->
<pre class="wp-block-syntaxhighlighter-code">var str = "Developers world!"; 
var res = str.slice(0, 10);</pre>
<!-- /wp:syntaxhighlighter/code -->

<!-- wp:preformatted -->
<pre class="wp-block-preformatted">Output<br>// return<br>Developers</pre>
<!-- /wp:preformatted -->

<!-- wp:heading {"level":3} -->
<h3>7. substring() Method</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>The Javascript substring() method is used to removes the characters from one string, between two specified indices, and returns the new substring.</p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":4} -->
<h4>Example</h4>
<!-- /wp:heading -->

<!-- wp:syntaxhighlighter/code {"language":"jscript"} -->
<pre class="wp-block-syntaxhighlighter-code">  var str = "Hello dev!";
  var res = str.substring(1, 4);</pre>
<!-- /wp:syntaxhighlighter/code -->

<!-- wp:preformatted -->
<pre class="wp-block-preformatted">Output<br>//return<br>ell</pre>
<!-- /wp:preformatted -->

<!-- wp:heading {"level":3} -->
<h3>8. substr() Method</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>A string substr() method begins on the character in the specified position, and returns the specified number of characters.</p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":4} -->
<h4>Example</h4>
<!-- /wp:heading -->

<!-- wp:syntaxhighlighter/code {"language":"jscript"} -->
<pre class="wp-block-syntaxhighlighter-code"> var str = "Hello dev!";
 var res = str.substring(1, 4);</pre>
<!-- /wp:syntaxhighlighter/code -->

<!-- wp:preformatted -->
<pre class="wp-block-preformatted">Output<br>//return<br>ello</pre>
<!-- /wp:preformatted -->

<!-- wp:heading {"level":3} -->
<h3>9. replace() Method</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>The Javascript replace() changes the defined value to an another value:</p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":4} -->
<h4>Example</h4>
<!-- /wp:heading -->

<!-- wp:syntaxhighlighter/code {"language":"jscript"} -->
<pre class="wp-block-syntaxhighlighter-code">var str = "Hello Dev!";
var res = str.replace("Dev", "World");</pre>
<!-- /wp:syntaxhighlighter/code -->

<!-- wp:preformatted -->
<pre class="wp-block-preformatted">Output<br>// return<br>Hello World</pre>
<!-- /wp:preformatted -->

<!-- wp:heading {"level":3} -->
<h3>10. <a href="https://www.tutsmake.com/string-contains-javascript-string-includes-method">includes() Method</a></h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>The includes() method is used to determine whether a string contains the characters of a specified string or not. If is exist return true or not return false.</p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":4} -->
<h4>Example</h4>
<!-- /wp:heading -->

<!-- wp:syntaxhighlighter/code {"language":"jscript"} -->
<pre class="wp-block-syntaxhighlighter-code">var str = "Hello world, my name is tutsmake.";
var n = str.includes("name");</pre>
<!-- /wp:syntaxhighlighter/code -->

<!-- wp:preformatted -->
<pre class="wp-block-preformatted">Output<br>// return <br>True</pre>
<!-- /wp:preformatted -->

<!-- wp:paragraph -->
<p><a href="https://www.tutsmake.com/string-contains-javascript-string-includes-method"> More Examples of javascript Include() function </a></p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":3} -->
<h3>11. concat() Method</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>The concat() method is used for join two or more strings.</p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":4} -->
<h4>Example</h4>
<!-- /wp:heading -->

<!-- wp:syntaxhighlighter/code {"language":"jscript"} -->
<pre class="wp-block-syntaxhighlighter-code">var str1 = "Hello ";
var str2 = "keny!";
var res = str1.concat(str2);</pre>
<!-- /wp:syntaxhighlighter/code -->

<!-- wp:preformatted -->
<pre class="wp-block-preformatted">Output<br>// return<br>Hello Keny</pre>
<!-- /wp:preformatted -->

<!-- wp:heading {"level":3} -->
<h3>12. charAt() Method</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>The Javascript charAt() is used to take a character to a described index location:</p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":4} -->
<h4>Example</h4>
<!-- /wp:heading -->

<!-- wp:syntaxhighlighter/code {"language":"jscript"} -->
<pre class="wp-block-syntaxhighlighter-code">var txt = "Hello Keny";
txt.charAt(0);</pre>
<!-- /wp:syntaxhighlighter/code -->

<!-- wp:preformatted -->
<pre class="wp-block-preformatted">Output<br>// return<br>H</pre>
<!-- /wp:preformatted -->

<!-- wp:heading {"level":3} -->
<h3>13. charCodeAt() Method</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>The&nbsp;<code>charCodeAt()</code>&nbsp;method returns the Unicode of the character at a specified index in a string:</p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":4} -->
<h4>Example</h4>
<!-- /wp:heading -->

<!-- wp:syntaxhighlighter/code {"language":"jscript"} -->
<pre class="wp-block-syntaxhighlighter-code">var str = "TEST";
str.charCodeAt(0); </pre>
<!-- /wp:syntaxhighlighter/code -->

<!-- wp:preformatted -->
<pre class="wp-block-preformatted">Output
// return
84</pre>
<!-- /wp:preformatted -->

<!-- wp:heading {"level":3} -->
<h3>14. lastIndexOf () Method</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>The&nbsp;<code>lastIndexOf()</code>&nbsp;the method returns the index of the&nbsp;<strong>last</strong>&nbsp;occurrence of a specified text in a string:</p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":3} -->
<h3>Example</h3>
<!-- /wp:heading -->

<!-- wp:syntaxhighlighter/code {"language":"jscript"} -->
<pre class="wp-block-syntaxhighlighter-code">var str = "Your are talented dev";
var pos = str.lastIndexOf("dev");</pre>
<!-- /wp:syntaxhighlighter/code -->

<!-- wp:preformatted -->
<pre class="wp-block-preformatted">Output
// return
18</pre>
<!-- /wp:preformatted -->

<!-- wp:heading {"level":3} -->
<h3>15. trim() Method</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>The javascript trim() method removes whitespace from both sides of a given string:</p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":4} -->
<h4>Example</h4>
<!-- /wp:heading -->

<!-- wp:syntaxhighlighter/code {"language":"jscript"} -->
<pre class="wp-block-syntaxhighlighter-code">var str = "       Trim Both Side        ";
alert(str.trim());</pre>
<!-- /wp:syntaxhighlighter/code -->

<!-- wp:preformatted -->
<pre class="wp-block-preformatted">Output
// return
Trim Both Side</pre>
<!-- /wp:preformatted -->

<!-- wp:heading {"level":3} -->
<h3>16. match() Method</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>The match() method searches a string for a match against a regular expression, and returns the matches, as an Array <a href="https://www.tutsmake.com/javascript-objects/">object</a>.</p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":4} -->
<h4>Example</h4>
<!-- /wp:heading -->

<!-- wp:syntaxhighlighter/code {"language":"jscript"} -->
<pre class="wp-block-syntaxhighlighter-code">  var str = "lopersum lopersum lopersum lopersum."; 
  var res = str.match(/sum/g);</pre>
<!-- /wp:syntaxhighlighter/code -->

<!-- wp:preformatted -->
<pre class="wp-block-preformatted">Output
// return
 sum,sum,sum,sum</pre>
<!-- /wp:preformatted -->

<!-- wp:heading {"level":3} -->
<h3>17. split Method</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>The javascript split method, which is used to convert string to an array:</p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":4} -->
<h4>Example</h4>
<!-- /wp:heading -->

<!-- wp:syntaxhighlighter/code {"language":"jscript"} -->
<pre class="wp-block-syntaxhighlighter-code">var str = "1,2,3,4,5";
var arr = str.split(",");
document.write(arr[0]);
document.write("&lt;br>");
document.write(arr[1]);</pre>
<!-- /wp:syntaxhighlighter/code -->

<!-- wp:preformatted -->
<pre class="wp-block-preformatted">Output
// return
1
2</pre>
<!-- /wp:preformatted -->

<!-- wp:heading {"level":3} -->
<h3>18. toString() Method</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>The javascript toString() method returns the value of a String object.</p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":4} -->
<h4>Example</h4>
<!-- /wp:heading -->

<!-- wp:syntaxhighlighter/code {"language":"jscript"} -->
<pre class="wp-block-syntaxhighlighter-code">var str = "javaScript World!";
var res = str.toString();</pre>
<!-- /wp:syntaxhighlighter/code -->

<!-- wp:preformatted -->
<pre class="wp-block-preformatted">Output
// return
javaScript World!</pre>
<!-- /wp:preformatted -->

<!-- wp:heading {"level":3} -->
<h3>19. valueOf() Method</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>The javascript valueOf() method, which is used to gets the primitive value of a String object.</p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":3} -->
<h3>Example</h3>
<!-- /wp:heading -->

<!-- wp:syntaxhighlighter/code {"language":"jscript"} -->
<pre class="wp-block-syntaxhighlighter-code">  var str = "javaScript World!";
  var res = str.valueOf();</pre>
<!-- /wp:syntaxhighlighter/code -->

<!-- wp:preformatted -->
<pre class="wp-block-preformatted">Output<br>// return<br>javaScript World!</pre>
<!-- /wp:preformatted -->

<!-- wp:html -->
<div class="gen-info-box">
<h4>Recommended Post</h4>
<a href="https://www.tutsmake.com/javascript-important-array-methods/">18 Javascript Array Methods You should know</a>
</div>
<!-- /wp:html -->