Must know JavaScript String native methods

There aren’t many native methods for strings in JavaScript, so string manipulation is something every front-end must learn, and it will be a big part of the interview process.

Creating a string

const str1 = 'Hello'
const str2 = `${str1} World`
const str3 = new String("welcome")
Copy the code

A static method

fromCharCode()

Converts Unicode encoding to characters

console.log(String.fromCharCode(72.101.108.108.111)); 
// Output: Hello
Copy the code

fromCodePoint()

Convert Unicode encodings to characters, which is new in ES6, because the fromCharCode() method only recognizes Unicode encodings from 0 to 65535. Using fromCharCode() beyond 65535 will cause an error.

console.log(String.fromCodePoint(72.101.108.108.111)); 
// Output: Hello
console.log(String.fromCharCode(134071));
// Output: ஷ
/ / error
console.log(String.fromCodePoint(134071));
// Output: "𠮷"
/ / right
Copy the code

raw()

New method in ES6 that returns the original value of a string.

const str = String.raw`Hello World \n`;
console.log(str);
// Output: Hello World \n
Copy the code

Instance attributes

length

Returns the length of the string

const str = 'Hello World'
console.log(str.length) 
// Output: 11
Copy the code

Instance methods

charAt()

Returns a character at a position in a string

const str = 'Hello World'
console.log(str.charAt(1))
// Output: e
console.log(str[1])
// Output: e
Copy the code

charCodeAt()

Returns the Unicode encoding of the character at a position in the string. The Unicode encoding of e is 101

const str = 'Hello World'
console.log(str.charCodeAt(1))
// Output: 101
Copy the code

codePointAt()

This is new in ES6 because the charCodeAt() method returns a range from 0 to 65535, and charCodeAt() will give an error if it is longer than 65535 characters.

const str1 = 'Hello World'
console.log(str1.codePointAt(1))
/ / 101

const str2 = '𠮷' 
console.log(str2.charCodeAt(0))
// Output: 55362
// Wrong answer: '𠮷' in Unicode beyond 65535 so wrong result returned
console.log(str2.codePointAt(0))
// Output: 134071
/ / right
Copy the code

concat()

Connection string

const str1 = 'Hello';
const str2 = 'World';

console.log(str1.concat(' ', str2)); 
// Output: Hello World
console.log(str1 + ' ' + str2); 
// Output: Hello World
Copy the code

includes()

Determines whether a string contains a string

const str = 'Hello World'
str.includes('World') 
// Output: true
Copy the code

indexOf()

Searches for locations that contain a string, returning -1 if none exists

const str = 'Hello World'
str.indexOf('o') 
// Output: 4
Copy the code

lastIndexOf()

Search for the last position that contains a string, returning -1 if none exists

const str = 'Hello World'
str.lastIndexOf('o') 
// Output: 7
Copy the code

localeCompare()

Compare two strings in a locally specific order, returning less than 0 if ‘Hello World’ is less than ‘Welcome’, and 0 if greater than 0 if equal. Generally used to sort

const str = 'Hello World'
str.localeCompare('Welcome')
// Output: -1

const arr = ['Hello World'.'China'.'Welcome']
console.log(arr.sort((a,b) = > a.localeCompare(b)))
// Output: ["China", "Hello World", "Welcome"]
Copy the code

match()

Matches the part contained in the string with the re

const str = 'Hello World'
const found = str.match(/[A-Z]/g)
console.log(found) 
// Output: ["H", "W"]
Copy the code

matchAll()

Matches a portion of the string with the re, returning an Iterator.

const str = 'Hello World'
const found = str.matchAll(/[A-Z]/g)
console.log([...found]) 
// Output: [["H"],["W"]]
Copy the code

padEnd()

Padding a string at the end of a string

const str = 'Hello World'
console.log(str.padEnd(str.length + 3.'. ')); 
// Output: Hello World...
Copy the code

padStart()

Populate a string at the beginning of a string

const str = 'Hello World'
console.log(str.padStart(str.length + 3.'. ')); 
// Output:... Hello World
Copy the code

repeat()

Repeated string

const str = 'Hello World '
console.log(str.repeat(3)) 
// Output: Hello World Hello World Hello World
Copy the code

replace()

Replaces the match part of the string, replacing only the first match

const str = 'Hello World'
console.log(str.replace('World'.'dog')) 
// Output: Hello dog
Copy the code

replaceAll()

Replaces all matches in the string

const str = 'Hello World'
console.log(str.replaceAll('l'.'L')) 
// Output: HeLLo WorLd
Copy the code

search()

Returns the matching position using the re search string, -1 if not found

const str = 'Hello World'
console.log(str.search(/W.+d/g)); 
// Output: 6
Copy the code

slice()

Starting at a position, returns the cut string

const str = 'Hello World'
console.log(str.slice(6)); 
// Output: World
Copy the code

split()

To split a string into an array in some format

const str = 'Hello World'
console.log(str.split(' ')); 
// Output: ["Hello", "World"]
Copy the code

startsWith()

Checks whether the string starts with the specified string

const str = 'Hello World'
console.log(str.startsWith('Hello')); 
// Output: true
Copy the code

endsWith()

Checks whether the string ends with the specified string

const str = 'Hello World'
str.endsWith('World') 
// Output: true
Copy the code

substring()

Intercepts a string, specifying the start and end positions

const str = 'Hello World'
console.log(str.substring(1.3)); 
// Output: el
Copy the code

toLocaleLowerCase()

Use the local way to lower a string. Only a few minority languages, such as Turkish, have a local way; others are the same as toLowerCase()

const str = 'Hello World'
console.log(str.toLocaleLowerCase()); 
// Output: hello world
Copy the code

toLocaleUpperCase()

Capitalizing strings in a native way is available only in a few minority languages such as Turkish, others are the same as toUpperCase()

const str = 'Hello World'
console.log(str.toLocaleUpperCase()); 
// Output: HELLO WORLD
Copy the code

toLowerCase()

String to lowercase

const str = 'Hello World'
console.log(str.toLowerCase()); 
// Output: hello world
Copy the code

toUpperCase()

Uppercase string

const str = 'Hello World'
console.log(str.toUpperCase()); 
// Output: HELLO WORLD
Copy the code

trim()

Removes Spaces at the beginning and end of strings

const str = ' Hello World '
console.log(str.trim()); 
// Output: Hello World
Copy the code

trimEnd()

Removes whitespace at the end of a string

const str = ' Hello World '
console.log(str.trimEnd()); 
// Output: 'Hello World'
Copy the code

trimStart()

Removes a space at the beginning of a string

const str = ' Hello World '
console.log(str.trimStart()); 
// Output: 'Hello World '
Copy the code

toString()

Gets the value of String

const strObj = new String('Hello World');

console.log(strObj); 
// Output: String {"Hello World"}
console.log(strObj.toString()); 
// Output: Hello World
Copy the code

valueOf()

Gets the original value of String

const strObj = new String('Hello World');

console.log(strObj); 
// Output: String {"Hello World"}
console.log(strObj.valueOf()); 
// Output: Hello World
Copy the code