Mastering JavaScript String Methods: Enhance Text Manipulation Skills

Mastering JavaScript String Methods: Enhance Text Manipulation Skills

Strings are one of the most fundamental data types in JavaScript, and working with text is an essential part of any JavaScript project.

Let’s explore these methods and simplify our code!

  • Length of string

let name='sameer'
console.log(name.length) // return the length of string        

  • charAt()

let name='sameer'
console.log(name.charAt(2))  
//reutrn the character        

  • indexOf()

let name='sameer'
console.log(name.indexOf('m'))   
// return the position/index of character  
// return the position/index of character and if not found return -1        
let name='sameer'
console.log(name.indexOf('e',4)) 
// it contains two arguments: searchString(1) and fromIndex (2) is optional 
// fromIndex is optional parameter which suggest to search the index from the 4th Position .and this return the first occurance of searching        

  • concat()

let name='sameer'
console.log(name.concat(' ',"bhatta")) 
// -> combining a two string        

  • endsWidth()

let name='sameer'
console.log(name.endsWith('m',3))

// it contains two arguments: searchString(1) and length(2) 

// it will return true 

// we can give length or not because the second argument is optional.

// it count start from 1,2,... and when the searchString should be the end    value of given length to get the result/output true , otherwise it give    false .        

  • includes()

let name='sameer'
console.log(name.includes('e',4)) 

//  it contains two arguments: searchString(1) and position(2) is (optional)

//  if start search from 0 index as default and if found return true

// postion is optional , if we provide the position it start searching from that position and if not found then return false        

  • padEnd()

let s1="hari"
console.log(s1.padEnd(8,'k')) 

//  it contains two arguments: targetLenth(1) and extraCharacter(2)

//  if target length which is 8 here is smaller thean original string         therefore it add the extra characters to the end of string to reach the target lenght (8), otherwise it return the whole string without modify it. 

//key points.

//  if we give target length less than or equal to string length, it will return whole string whatever the string length.        

  • padEnd()

let s1="hari"
console.log(s1.padStart(6,'k')) 
// if targetlength (6) is smaller thean original string then it add the extra characters to the start of string to reach the target length, otherwise it return the whole string without modify it.        

  • replace()

let s2='hari is from kathmandu'
console.log(s2.replace('hari','SAMEER')) 

// it takes two arguments: searchValue(1) and replaceValue(2)
// it replace if the searchValue with replace value if search value found otherwise it return whole string.

//key points:
// it does not modify the original string , it return the new string
// we can use /g flag at the end of searchValue to replace all the occurance of the search value
// by default it replace the first match unless a global regex (/g) is used         

  • slice()

let s3='sammerbhatta'
console.log(s3.slice(1,3))

// it takes two arguments: startIndex (1) and endIndex(2) which is optional 
// extract the portion of string without modifying it        
let s3='sammerbhatta'
console.log(s3.slice(3,1)) 
// -> this will return empty string because the start index is greater than end  index and slice can not reverse its direction and no reason to use slice.        

  • slice() : for negative index

let s3='sammerbhatta'
console.log(s3.slice(-3,11)) 

// negative count start with -1 from the end of the string . in this example  s3 contain 12 characters count start from 0, if we start from -3 then it   will include first 't' from the end and exclude the end index and taking   between including -3 from the last and 11 from starting.

//key points
// start index is required but end index is optional and if end index is not provided then it extract the string from start index to the end of the string.
// start index is included and end index is excluded.         

  • split()

let s4='sameer bhatta'
console.log(s4.split("b",4))

// split contains two arguments one is separator and another one is limit.

// separator is used to recognized the trigger point when to split the        string into array and limit tells to split string at most part not much    than that

//key points:-
// if we write b as a separator then it will generate the array containg  before b and after b 
// if 0 given as a limit then it will return empty string
//  if limit is greater than number of spilt possible all substring will returned         

  • toLowerCase() and toUpperCase()

let s5="kathmanDu"
console.log(s5.toLowerCase()) 

//converts the string to lowecase

console.log(s5.toUpperCase()) 

//converts the string to uppercase
        

  • trim()

let s6=" hello "
console.log(s6.trim()) 

// remove the whitespace from the both end         

  • using the multiple methods together

let s7=" kathmandu is beautiful "
console.log(s7.trim().toUpperCase().replace('KATHMANDU','pokhara'))        


To view or add a comment, sign in

More articles by Sameer Bhatta

  • React JS One Way Data Binding?

    React JS is one way data binding, means the flow of data from parent to children is possible not from children to…

  • React.js

    React.js is a popular JavaScript library used for building user interfaces, particularly for single-page applications…

Explore content categories