Summary of JS common string API in javaScript tutorial

Some notes on js string and js array:

  1. String and array have some similarities. They can get the size through length attribute, can be accessed through subscript, and can traverse each character / element with for loop
  2. The difference between strings and arrays is that arrays can be modified at will. Strings are read-only arrays of characters. Once created, they cannot be modified

1. String splicing concat(), +, template string

concat() function: concatenate multiple strings into a new string and return the new concatenated string
Syntax: VAR newstr= str.concat (string1,string2,… ,stringx)

var str = "dream-";
var str1 = "starts";
var str2 = "-with-lighting-matches";
var newStr1 = str.concat();//No parameter function equivalent to copy string
var newStr2 = str.concat(str1);//Splicing str and str1 back
var newStr3 = str.concat(str1,str2); //Splicing str with str1 and str2

console.log(newStr1)//dream-
console.log(newStr2);//dream-starts
console.log(newStr3);//dream-starts-with-lighting-matches

Concatenate strings with
Usage: var newStr = str + string1 + string2 + +stringx

var str = "dream-";
var str1 = "starts";
var str2 = "-with-lighting-matches";
var newStr1 = str + str1;//Splicing str with str1
var newStr2 = str + str1 + str2; //Splicing str with str1 and str2

console.log(newStr1);//dream-starts
console.log(newStr2);//dream-starts-with-lighting-matches

Splicing string ES6 through template string NEW
Usage: var newStr = ${string1}${string2}...${stringx}

//Usage: var newStr = `${string1}${string2}...${stringx}`
var str = "dream";
var str1 = "starts";
var str2 = "with-lighting-matches";
var newStr1 = `${str}-${str1}`;//Splicing str with str1
var newStr2 = `${str}-${str1}-${str2}`; //Splicing str with str1 and str2

console.log(newStr1);//dream-starts
console.log(newStr2);//dream-starts-with-lighting-matches

2. Select substring(), substr(), slice()

substring() function: select a string between two specified indexes. The two parameters follow the principle of including the head but not the tail, and return the newly selected string
Syntax: VAR newstr= str.substring ([starti [,endi]])
Note: substring will start with a smaller parameter and end with a larger parameter

var str = "dream-starts-with-lighting-matches";
var newStr1 = str.substring();//No parameter to select all characters
var newStr2 = str.substring(5);//A parameter represents the start position. Select the start to end character from index 5
var newStr3 = str.substring(5,10); //Select the characters between index 5 and index 10, excluding index 10
//Take the smaller parameter as the starting position and the larger parameter as the ending position
var newStr4 = str.substring(10,5); //Select the characters between index 5 and index 10, excluding index 10
console.log(newStr1)//dream-starts-with-lighting-matches
console.log(newStr2);//-starts-with-lighting-matches
console.log(newStr3);//-star
console.log(newStr4);//-star

substr() function: selects a string of a specified length from a specified location, and returns the newly selected string
Syntax: VAR newstr= str.substr ([starti [,length]])

var str = "dream-starts-with-lighting-matches";
var newStr1 = str.substr();//No parameter to select all characters
var newStr2 = str.substr(5);//A parameter represents the start position. Select the character from index position 5 to the end
var newStr3 = str.substr(5,8);//Select 8 characters from index position 5
console.log(newStr1)//dream-starts-with-lighting-matches
console.log(newStr2);//-starts-with-lighting-matches
console.log(newStr3);//-starts-

slice() function: select the string between two specified indexes. The two parameters follow the principle of including the head and not the tail, and return the newly selected string
Syntax: VAR newstr= str.slice ([starti [,endi]])

var str = "dream-starts-with-lighting-matches";
var newStr1 = str.slice();//No parameter to select all characters
var newStr2 = str.slice(5);//A parameter represents the start position. Select the start to end character from index 5
var newStr3 = str.slice(5,10); //Select the characters between index 5 and index 10, excluding index 10
console.log(newStr1)//dream-starts-with-lighting-matches
console.log(newStr2);//-starts-with-lighting-matches
console.log(newStr3);//-star

3. String search indexOf(), lastIndexOf(), search(), match(), exec()

indexOf() function: search the specified value from the beginning to the end, return the first index of the specified value, and return - 1 if not found
Syntax: VAR index= str.indexOf (searchvalue [,fromindex])

var str = "Good good good study, day day day up";
var  index1 = str.indexOf('good');
console.log(index1);//5
var  index2 = str.indexOf('good',6);
console.log(index2);//10
var  index3 = str.indexOf('No');
console.log(index3);//-1

lastIndexOf() function: search for the specified value from the end of the string, return the first index of the specified value, and return - 1 if not found
Syntax: VAR index= str.lastIndexOf (searchvalue [,fromindex])

var str = "Good good good study, day day day up";
var  index1 = str.lastIndexOf('good');
console.log(index1);//10
var  index2 = str.lastIndexOf('good',6);
console.log(index2);//5
var  index3 = str.lastIndexOf('good',3);
console.log(index3);//-1

search() function: find the position of the specified value / regular matching value in the string, return the first index found, and return - 1 if not found
Syntax: VAR index= str.search (regexp/searchvalue )

var str = "Good good good study, Day day day up";
var  index1 = str.search('good');
console.log(index1);//5
var  index2 = str.search('No');
console.log(index2);//-1

var  index3 = str.search(/good/);
console.log(index3);//5
var  index3 = str.search(/good/i);//Case insensitive based on regular lookup
console.log(index3);//0

match() function: find the element of the specified value / regular match. The return value is different according to whether the global match (whether there is a g identifier in the regular). null is not found, as follows:

  1. The parameter is non regular or regular but does not match globally. An array is returned. The array members are as follows:
    Element 0: match text
    index: the location of the first match to the substring
    input: original string
    groups: not currently supported

  2. Parameter is regular global match: returns an array of all matched values

Syntax: var arr= str.match(regexp/searchvalue )

var str = "Good good good study";
var  arr1 = str.match('good');
console.log(arr1);//["good", index: 5, input: "Good good good study", groups: undefined]
var  arr2= str.match('No');
console.log(arr2);//null

var  arr3= str.match(/good/);
console.log(arr3);//["good", index: 5, input: "Good good good study", groups: undefined]
var  arr4 = str.match(/good/g);//Global lookup, case sensitive
console.log(arr4);//["good", "good"]
var  arr5 = str.match(/good/ig);//Global lookup, case insensitive
console.log(arr5);// ["Good", "good", "good"]
var  arr6 = str.match(/No/ig);//Global lookup, case insensitive
console.log(arr6);// null

exec() function: find the regular matching element, return null if not found, and return the new array. The array members are as follows:

  • Element 0: match text
  • index: the location of the first match to the substring
  • input: original string
  • groups: not currently supported

The value of the lastIndex attribute in different regular objects in the call process of global matching (whether there is a g identifier) is used to control the start position of the check character. If it is a non global matching, the value is zero. If it is a global matching, the value is the next bit of the tail index of the last string found

Syntax: VAR arr= regexp.exec (str)

Appendix: two ways of regular definition

  1. var regexp = /pattern/modifiers;
  2. var regexp = new RegExp(pattern,modifiers);
  • Modifiers Description:
    i: Ignore case;
    g: Global matching;
    m: Multi line matching, when the string to be retrieved is a single line, it is meaningless to use M
var str = "Good good good study";
var regexp1 = /good/
var  arr1 = regexp1.exec(str);
console.log(arr1);//["good", index: 5, input: "Good good good study", groups: undefined]

//var regexp2 = /good/g
var regexp2 = new RegExp(/good/,"g")

do {
  console.log(arr2)
  console.log(regexp2.lastIndex)
} while ((arr2 = regexp2 .exec(str)) != null)  

//Do while will loop output three times, each time as follows
//for the first time
	//null
	//0
//The second time
	//["good", index: 5, input: "Good good good study", groups: undefined]
	//9
//third time
	//["good", index: 10, input: "Good good good study", groups: undefined]
	//14

4. Replace string ()

replace() function: replace the matching content in the string with the new content, and return the replaced string
Syntax: VAR newstr= str.replace (regexp/substr,replacement)

var str = "Good good good study, day day day up";
var newStr1 = str.replace('good','hard');//Normal replace only replaces the first matching position
var newStr2 = str.replace(/good/g,'hard');//Use regular global find replace, case sensitive
var newStr3 = str.replace(/good/ig,'hard');//Use regular global lookup to replace, case insensitive
var newStr4 = str.replace(/\s+/g,'');//Remove space

console.log(newStr1)//Good hard good study, day day day up
console.log(newStr2);//Good hard hard study, day day day up
console.log(newStr3);//hard hard hard study, day day day up
console.log(newStr4);//Goodgoodgoodstudy,daydaydayup

5. Split string into array split()

split() function: splits a string into arrays according to the specified separator, and returns the array generated by the split string
Syntax: VAR newarr= str.split (separator,howmany)

var str1 = "dream-starts-with-lighting-matches";
var newArr1 = str1.split('-');//Split string into arrays based on '-'
var newArr2 = str1.split('-', 3);//Split the string into arrays according to '-', only the first three

console.log(newArr1)//["dream", "starts", "with", "lighting", "matches"]
console.log(newArr2);//["dream", "starts", "with"]

//Expand. split is usually used with join
var str1 = "dream-starts-with-lighting-matches";
var newArr3 = str1.split('-');//Split string into arrays based on '-'
var str3 = newArr3.join('&')
console.log(newArr1)//["dream", "starts", "with", "lighting", "matches"]
console.log(str3)//dream&starts&with&lighting&matches

6. String case conversion to lowercase(), to uppercase()

toLowerCase() function: converts all characters in a string to lowercase, and returns the converted String
Syntax: VAR newstr= str.toLowerCase ()
toUpperCase() function: converts all characters in a string to uppercase, and returns the converted String
Syntax: VAR newstr= str.toUpperCase ()

var str = "Good good study, Day day up";
var newStr1 = str.toLowerCase();
var newStr2 = str.toUpperCase();

console.log(newStr1)//good good study, day day up
console.log(newStr2);//GOOD GOOD STUDY, DAY DAY UP

7. Get charAt() and charCodeAt() of the specified position

charAt() function: gets the character of the specified position / index in the string, and returns the obtained character
Syntax: VAR newchar= str.charAt (index)

charCodeAt() function: gets the character code of the specified position / index in the string, and returns the obtained character code
Syntax: VAR newcharcode= str.charCodeAt (index)

var str = "Good good study, Day day up";
var char1 = str.charAt(0);
var char2 = str.charAt(5);
var charCode1 = str.charCodeAt(0);
var charCode2 = str.charCodeAt(5);
console.log(char1)//G
console.log(char2);//g
console.log(charCode1);//ASCII code of 71 character G
console.log(charCode2);//ASCII code of 103 character g

Tags: Attribute ascii

Posted on Sun, 07 Jun 2020 06:44:22 -0400 by TouranMan