Common string methods and techniques in JavaScript

1. The return value is a string

1.1 the toString

// The syntax returns the string form of the specified object
srt.toString()
Copy the code

• Return string

  console.log([1.2.3].toString())// "1,2,3"
  ​
  let Num=123
  console.log(Num.toString()) / / "123"
  Copy the code

1.2 the valueOf

// Mandatory string Original value of the object
str.valueOf()
Copy the code

• Mandatory string The original value of the object

  var x = new String('Hello world');
  console.log(x.valueOf()); // Displays 'Hello world'
  Copy the code

2. Extract the string

2.1 SubString (Extraction)

BeginIndex begins a character and endIndex ends a character
str.substring(beginIndex,endIndex)
Copy the code

• Left closed right open (left included right excluded)

• Returns a new string extracted from the start to end position (the original string does not change _)

• Negative numbers are not supported

  var anyString = "Mozilla";
  / / output "lla"
  console.log(anyString.substring(4.7));
  console.log(anyString.substring(7.4));
  ​
  / / output ""
  console.log(anyString.substring(4.4));
  ​
  / / output Mozill ""
  console.log(anyString.substring(0.6));
  Copy the code

2.2 Slice (same as array method)(extract)

/ / grammar beginIndex extract the original starting position of the characters, endIndex end position Left closed right away [) | (including left right does not include)
str.slice(beginIndex,endIndex)
Copy the code

• Extract a portion of a string and return a new string (without changing the original string)

  var str1 = 'The morning is upon us.'.// The length of str1 is 23.
  ​
  str2 = str1.slice(1.8), // Output: he morn
  str5 = str1.slice(30);  // output: ""
  str.slice(-3);     / / return 'us.'
  str.slice(-3, -1); / / return 'us'
  Copy the code

2.3 Splice (same as array method)(interception)

This method is consistent with the use of splice for arrays

/ / grammar beginIndex extract the original starting position of the characters, endIndex end position Left closed right away [) | (including left right does not include)
str.slice(beginIndex,endIndex)
Copy the code

• Left closed right open (left included right excluded)

• Returns a new string that extracts the original string (changing the original string)

• Reverse order and negative numbers are not supported

  var str1 = 'The morning is upon us.'.// The length of str1 is 23.
      str2 = str1.slice(1.8),
      str3 = str1.slice(4, -2),  // Start from the fifth character to the penultimate character
      str4 = str1.slice(12),     // Extract the 13th character from the beginning to the end
      str5 = str1.slice(30);
      str6 = str1.slice(-3);     
    
     
  console.log(str2); // Output: he morn
  console.log(str3); // Output: morning is upon u
  console.log(str4); // Output: is upon us.
  console.log(str5); // output: ""
  str.slice(-3);     / / return 'us.'
  Copy the code

3. Convert strings to arrays

3.1 the split

// separator delimits the number of partitions
str.split(separator,separator)
Copy the code

• Splits a string into substring arrays using the specified delimiter

  • The sample

  const myString = 'this|is|a|Test';
  const splits = myString.split(['|']);
  ​
  console.log(splits); //["this", "is", "a", "Test"]
  Copy the code

  • Limits the number of split elements in the return value

  var myString = "Hello World. How are you doing?";
  var spl = myString.split("".3); // Separate with Spaces
  ​
  console.log(splits); // ["Hello", "World.", "How"]
  ​
  var str="1234"
  var spl=str.split("")// Separate with an empty string
  console.log()/ / / "1", "2", "3", "4"]
  Copy the code

  • Use split() to reverse the string order

  const str = 'asdfghjkl';
  let strReverse=str.split("").reverse().join("")
  ​
  concole.log(strReverse) // 'lkjhgfdsa'
  Copy the code

4. Concatenate strings

4.1 Join (same as array)

// syntax separator: separator
 str.join("separator")
Copy the code

• What delimiter is used to concatenate the string and return the string

  const elements = "FireAirWater"
  ​
  console.log(elements.join(,));//"Fire,Air,Water"
  ​
  console.log(elements.join(The '-'));//"Fire-Air-Water"
  Copy the code

4.2 Concat (same as array)

// The syntax strN is the string to concatenate
str.concat(str2, [, ...strN])
Copy the code

• Joins one or more strings with the original string concatenation to form a new string and returns

  let str = 'Hello, '
  console.log(str.concat('Kevin'.'. Have a nice day.'))
  // Hello, Kevin. Have a nice day.
  ​
  let greetList = ['Hello'.' '.'Venkat'.'! ']
  "".concat(... greetList)// "Hello Venkat!"
  Copy the code

5. Search for characters or indexes

5.1 charAt

// index Accesses the index of the string
str.charAt(index)
Copy the code

• Returns the specified character from a string

  var str="Brave new world"
   str.charAt(0)  //"B"
   str.charAt(1)  //"r"
  Copy the code

5.2 indexOf (same as array)

// syntax searchValue: the string value to be searched fromIndex: the position to start the search from left to right
str.indexOf(searchValue,fromIndex)
Copy the code

• Returns the index of the first occurrence of the specified value, or -1 if not found

  //indexOf is case sensitive
  var myString    = "brie, pepper jack, cheddar";
  var myCapString = "Brie, Pepper Jack, Cheddar";
  ​
  console.log(myString.indexOf("cheddar"));//  19
  ​
  console.log(myCapString.indexOf("cheddar"));// -1
  ​
  Copy the code

5.3 lastIndexOf(same as array method)

// syntax searchValue: the string value to be searched fromIndex: the position where the search starts is searched from right to left (the index is still counted from left to right starting with 0)
str.lastIndexOf(searchValue,fromIndex)
Copy the code

• Returns the index of the first occurrence of the value (which is still looked up from right to left), or -1 if not found

  // Case sensitive
  var str = 1.2.3.4;
  var last = str.lastIndexOf(2); // index is 3
  ​
  index = str.lastIndexOf(7); // index is -1
  Copy the code

5.4 Includes (same as array method)

FromIndex: Searches from the fromIndex index
 str.includes(valueToFind,fromIndex )
Copy the code

• Used to determine whether the string contains a specified value, returning true if it does, false otherwise

  Note that using includes() to compare strings and characters is case sensitive.

  'Blue Whale'.includes('blue'); // returns false
  ​
  'Blue Whale'.includes('Blue'); // returns false
  Copy the code

5.5 the startsWith

// Syntax searchString The substring to search for Position The beginning of the search
str.startsWith(searchString,position)
Copy the code

• Returns true if the beginning of a specified character in a string; false otherwise

• Case sensitive

  var str = "To be, or not to be, that is the question.";
  ​
  alert(str.startsWith("To be"));         // true
  alert(str.startsWith("not to be"));     // false
  alert(str.startsWith("not to be".10)); // true
  Copy the code

5.6 the endsWith

// Syntax searchString The substring to search for. Length Indicates the length to be searched
str.endsWith(searchString,length)
Copy the code

• The specified substring is at the end of the string. Returns true otherwise returns false

• This method is case sensitive,

  var str = "To be, or not to be, that is the question.";
  ​
  alert( str.endsWith("question."));// true
  alert( str.endsWith("to be"));// false
  alert( str.endsWith("to be".19));// true
  Copy the code

6. String pattern matching

6.1 the match

// syntax regexp a regular expression object
// If a non-regular expression object regexp is passed in, it is implicitly converted to a regular expression object using new regexp (regEXP).
str.match(regexp)
Copy the code

• Finding a match for one or more regular expressions returns the result of the match (array)

  Note that this method returns matching values stored in an array, depending on whether regexp has the global flag G

  var str = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz';
  var regexp = /[A-E]/gi;
  var matches_array = str.match(regexp);
  ​
  console.log(matches_array);
  // ['A', 'B', 'C', 'D', 'E', 'a', 'b', 'c', 'd', 'e']
  Copy the code

6.2 the search

// syntax regexp a regular expression object
str.search(regexp)
Copy the code

• Returns the index of the first match in the string that was successfully matched, or -1 if not

  var str = "hey JudE";
  var re = /[A-Z]/g;
  var re2 = /[.]/g;
  console.log(str.search(re)); //  4
  console.log(str.search(re2)); / / 1
  Copy the code

6.3 the replace

/ / grammar regexp | substr regular or string. What the re matches is replaced by the second argument
/ / newSubStr | function is used to replace the first argument string or function return value
str.replace(regexp|substr, newSubStr|function)
Copy the code

• Returns a new string partially or completely replaced by a match replacement (without changing the original string)

  var str = 'Twas the night before Xmas... ';
  var newstr = str.replace(/xmas/i.'Christmas');
  console.log(newstr);  // Twas the night before Christmas...
  Copy the code

7. String case conversion

7.1 toLowerCase

(Cast if the value calling the method is not a string)

// syntax (cast if the value calling the method is not a string).
​
str.toLowerCase()
Copy the code

• Calling this method to convert a string to lowercase does not affect the original string

  console.log('Chinese simplified useful - CN | | useful - Hans'.toLowerCase());
  / / of simplified useful - cn | | useful - Hans
  ​
  •console.log( "ALPHABET".toLowerCase() );// "alphabet"
  ​
  Copy the code

7.2 toUpperCase

(Cast if the value calling the method is not a string)

/ / grammar
str.toUpperCase()
Copy the code

• Calling this method to convert a string to uppercase returns a new string. Does not affect the original string

  console.log('alphabet'.toUpperCase()); // 'ALPHABET'
  Copy the code

8. Remove end-of-string whitespace

8.1 the trim

This method does not work with the null undefined Number type

/ / grammar
str.trim()
Copy the code

• Returns a string with whitespace removed at both ends, without affecting the string itself

  var orig = ' foo ';
  console.log(orig.trim()); // 'foo'
  ​
  // Another.trim() example, removed from one side only
  ​
  var orig = 'foo ';
  console.log(orig.trim()); // 'foo'
  Copy the code

9. Repeat a string

9.1 repeat

// Syntax count number of repetitions
 str.repeat(count)
Copy the code

• Returns a new copy of the string for the specified number of times

  var orig = 'foo';
  console.log(orig.repeat(2)); // 'foofoo'
  Copy the code

10. Convert the string to a number

10.1 parseInt

// Syntax string String to parse radinx Optional. Represents the radix of the number to be parsed. The value is between 2 and 36
 parseInt(string,radinx)
Copy the code

• Parse an integer from the given string

• Note that parseInt converts BigInt to Number and loses precision in the process.

  parseInt("10");       // Output: 10
  ​
  // If this parameter is less than 2 or greater than 36, parseInt() returns NaN:
  parseInt("50".1)      // Output result: NaN
  ​
  // Only the first digit in the string is returned, until the first non-digit character is encountered:
  parseInt("40 4years")   // Output: 40
  ​
  // If the first character of the string cannot be converted to a number, NaN is returned:
  parseInt("new100")     // Output result: NaN
  Copy the code

10.2 parseFloat

// The syntax string needs to be parsed into a floating point value
parseFloat(string)
Copy the code

• The given value is parsed to a floating point number. NaN is returned if the given value cannot be converted to a numeric value.

• parseFloatparsingBigInt 为 Numbers, loss of accuracy

  parseFloat("10.00")      // Output: 10.00
  parseFloat("10.01")      // The output is 10.01
  parseFloat("10.01")     // The output is -10.01
  parseFloat("40.5 years") // Output: 40.5.
  Copy the code

• If the first character of the argument string cannot be parsed into a number, parseFloat returns NaN.

  parseFloat("new40.5")    // Output result: NaN
  Copy the code