String Common Methods
+ Explanation: All string methods do not change the original string
Table of contents
Especially boring methods inside strings
String common method 1
charAt()
=> Syntax: string.charAt(index)
=> return value: the character at the index position
-> If there is the index position, it is the index position character
-> If there is no index position, it is an empty
// 1. charAt()
var str = 'hello world'
var res = str.charAt(1)
console.log(res) // e
var res2 = str.charAt(100)
console.log(res2) // 空charCodeAt()
=> Syntax: string.charCodeAt(index)
=> Return value: the character encoding of the index position (UTF-8 encoding)
// 2. charCodeAt()
var str = '你hello world'
var res = str.charCodeAt(0)
console.log(res) //20320substr()
=> Syntax: string.substr(start index, how many)
=> Function: intercept the string
=> return value: the intercepted string
// 3. substr()
var str = 'hello world'
// 从索引 [2] 开始, 向后截取八个字符
var res = str.substr(2, 8)
console.log(res) // llo worlsubstring()
=> Syntax: string.substring(start index, end index) - wrap before but not after
=> Function: intercept the string
=> return value: the intercepted string
// 4. substring
var str = 'hello world'
// 从 [2] 开始 截取到 [8], 不包含 [8]
var res = str.substring(2, 8)
console.log(res) // llo wotoLowerCase()
=> Syntax: String.toLowerCase()
=> Function: Convert the uppercase letters in the string to lowercase letters
=> Return value: converted string
// 5. toLowerCase()
var str = 'HELLO worLD'
var res = str.toLowerCase()
console.log(res) // hello worldtoUpperCase()
=> Syntax: String.toUpperCase()
=> Function: Convert the lowercase letters in the string to uppercase letters
=> Return value: converted string
// 6. toUpperCase()
var str = 'HELlo World'
var res = str.toUpperCase()
console.log(res) // HELLO WORLDreplace()
=> Syntax: String.replace('Character to be replaced', 'Character to be replaced')
=> Function: replace some characters in the string
-> can only replace the first one found
=> return value: replaced string
// 7. replace()
var str = '你好 世界 H H abc abc HH 你好'
var res = str.replace('HH', '**')
console.log(res) // 你好 世界 H H abc abc ** 你好
var res2 = str.replace('你好', '$')
console.log(res2) // $ 世界 H H abc abc HH 你好concat()
=> Syntax: string.concat(string)
=> Function: splicing strings
=> return value: concatenated string
// 8. concat()
var str = 'hello'
var res = str.concat('world')
console.log(res) // helloworldslice()
=> Syntax: string.slice(start index, end index) - wrap before but not after
The difference between -> and substring is that negative integers can be written
-> When you write a negative integer, it means length + negative integer
=> Function: intercept the string
=> return value: intercepted string
// 9. slice()
var str = 'hello world'
var res = str.slice(2, 8)
console.log(res) // llo wo
var res = str.slice(2, -3)
console.log(res) // llo wosplit()
=> Syntax: string.split('cutting symbol', how many)
-> cutting symbol, cut the string according to the symbol you wrote
If not written, then just cut a complete
If you write an empty string (''), cut it bit by bit
-> How many, optional, the default is all, indicating how many you keep after cutting
=> Return value: save each piece of content in the form of an array
-> No matter what cut is made, the return value must be an array
// 10. split()
var str = '2020-12-12'
var res = str.split('-')
console.log(res) // ['2020', '12', '12']
var res1 = str.split('-', 2)
console.log(res1) // ['2020', '12']
var res2 = str.split()
console.log(res2) // ['2020-12-12']
var res3 = str.split('')
console.log(res3) // ['2', '0', '2', '0', '-', '1', '2', '-', '1', '2']String common method 2
indexOf()
=> Syntax:
string.indexOf(string fragment)
string.indexOf(string fragment, start index)
=> Function: Find the specified string fragment in the string
=> return value:
-> If the query is found, it is the specified index
-> If not, it is -1
// 11. indexOf()
var str = 'abcaabbcc'
var res = str.indexOf('a')
console.log(res) // 0
var res = str.indexOf('a', 2)
console.log(res) // 3
// 去到 str 里面完全匹配 'aa'
// 找到匹配的片段以后, 返回开始索引
var res = str.indexOf('aa')
console.log(res) // 3lastIndexOf()
=> Syntax:
string.lastIndexOf(string fragment)
string.lastIndexOf(string fragment, start index)
=> Function: Find the corresponding string fragment from the back to the front
=> return value
-> If the query is found, it is the specified index
-> If not, it is -1
// 12. lastIndexOf()
var str = 'abcaabbcccccc'
var res = str.lastIndexOf('a')
console.log(res) // 4
var res = str.lastIndexOf('a', 2) //相当于在索引2之前找到第一个a
console.log(res) // 0
var res = str.lastIndexOf('aa')
console.log(res) // 3
var res = str.lastIndexOf('z')
console.log(res) // -1includes()
=> Syntax: string.includes('string fragment')
=> Function: Whether the string contains the string fragment
=> return value: Boolean
-> Yes is true
-> None is false
// 13. includes()
var str = 'hello world'
var res = str.includes('a')
console.log(res)// false
var res = str.includes('l')
console.log(res)// truesearch()
=> Syntax: string.search('string fragment')
=> Function: Find whether there is a matching string fragment in the string
=> return value:
-> If there is, it is the specified index
-> If not, it is -1
The difference from indexOf: no second parameter
The search parameter can write regular
// 14. search()
var str = 'hello world'
var res = str.search('l')
console.log(res)//2
var res = str.search('z')
console.log(res)//-1match()
=> Syntax: string.match('string fragment')
=> Function: Find the string fragment in the string
=> return value: is an array
-> Inside is the found string fragment
=> Practical application:
-> not passing a string
-> pass regex
// 15. match()
var str = 'hello world'
var res = str.match('o')
console.log(res)
// ['o', index: 4, input: 'hello world', groups: undefined]
// 0: "o"
// groups: undefined
// index: 4
// input: "hello world"
// length: 1trim()
=> Syntax: string.trim()
=> Function: Remove leading and trailing spaces
=> return value: the string after removing spaces
// 16. trim()
var str = ' 你好 世界 '
var res = str.trim()
console.log(res) // 你好 世界
console.log(str) // 你好 世界 原始字符串不变trimStart()
=> Syntax: string.trimStart()
=> Function: Remove the leading spaces
=> Return value: String after removing spaces
=> alias: trimLeft()
trimEnd()
=> Syntax: string.trimEnd()
=> Function: Remove trailing spaces
=> return value: the string after removing spaces
=> Alias: trimRight()
pathStart()
=> Syntax: string.padStart(target length, 'pad string')
-> Target length: How long do you want to add the string to
If the length you write is less than the length of the string itself, then this function has no meaning
After the length is exceeded, fill it with a padding string
-> Filling string: can be one character, or multiple
When multiple
=> Function: Complete from the previous string
=> return value: the completed string
// 19. padStart()
var str = '1234'
var res = str.padStart(3, 'a')
console.log(res) // 1234
// 前面六位全部是 a
var res = str.padStart(10, 'a')
console.log(res) // aaaaaa1234
// 根据补位剩余的空间, 来使用指定字符串补位
var res = str.padStart(6, 'abcd')
console.log(res) // ab1234atEnd()
=> Syntax: string.padEnd(target length, 'pad string')
-> Target length: How long do you want to add the string to
If the length you write is less than the length of the string itself, then this function has no meaning
After the length is exceeded, fill it with a padding string
-> Filling string: can be one character, or multiple
When multiple
=> Function: Complete the string from the back
=> return value: the completed string
// 20. padEnd()
var str = '1234'
var res = str.padEnd(3, 'a')
console.log(res) // 1234
var res = str.padEnd(10, 'a')
console.log(res) // 1234aaaaaa
var res = str.padEnd(5, 'abc')
console.log(res) // 1234astartsWith()
=> Syntax: string.startsWith('string fragment')
=> Function: Determine whether the string starts with this string fragment
=> return value: a boolean value
-> If yes, it is true
-> If not, it is false
// 21. startsWith()
var str = 'hello world 你好 世界'
var res = str.startsWith('hello')
console.log(res) // true
var res = str.startsWith('world')
console.log(res) // falseendsWith()
=> Syntax: string.endsWith('string fragment')
=> Function: Determine whether the string ends with this string segment
=> return value: a boolean value
-> If yes, it is true
-> If not, it is false
// 22. endsWith()
var str = 'hello world 你好 世界'
var res = str.endsWith('hello')
console.log(res) // false
var res = str.endsWith('世界')
console.log(res) // trueEspecially boring methods inside strings
tasteless method
small()
=> Syntax: string.small()
=> Function: Turn the contents of the string into small text
Return value: <small>string</small>
big()
=> Syntax: string.big()
=> Function: Turn the contents of the string into large text
=> return value: <big>string</big>
bold()
=> Syntax: string.blod()
=> Function: display the string in bold
=> return value: <b>string</b>
fontsize()
=> Syntax: string.fontsize(size)
=> Function: Specify the string size
=> return value: <font>string</font>
fontcolor()
=> Syntax: string.fontcolor(color)
=> Function: Specify the string color
=> return value: with a color style
var str = 'hello world'
// 1. small()
var res1 = str.small()
console.log(res1)
// 2. big()
var res2 = str.big()
// 3. blod()
var res3 = str.bold().big()
// 4. fontSize()
var res4 = str.fontsize('30px')
// 5. fontcolor()
var res5 = str.fontcolor('blue')
document.write(res1)
document.write('<br>')
document.write(str)
document.write('<br>')
document.write(res2)
document.write('<br>')
document.write(res3)
document.write('<br>')
document.write(res4)
document.write('<br>')
document.write(res5) // 蓝色的 hello world