字符串常用方法
+ 说明: 所有字符串方法都不会改变原始字符串
目录
字符串常用方法1
charAt()
=> 语法: 字符串.charAt(索引)
=> 返回值: 该索引位置的字符
-> 如果有该索引位置, 就是索引位置字符
-> 如果没有该索引位置, 是一个空
// 1. charAt()
var str = 'hello world'
var res = str.charAt(1)
console.log(res) // e
var res2 = str.charAt(100)
console.log(res2) // 空
charCodeAt()
=> 语法: 字符串.charCodeAt(索引)
=> 返回值: 该索引位置的字符编码(UTF-8编码)
// 2. charCodeAt()
var str = '你hello world'
var res = str.charCodeAt(0)
console.log(res) //20320
substr()
=> 语法: 字符串.substr(开始索引, 多少个)
=> 作用: 截取字符串
=> 返回值: 截取出来的字符串
// 3. substr()
var str = 'hello world'
// 从索引 [2] 开始, 向后截取八个字符
var res = str.substr(2, 8)
console.log(res) // llo worl
substring()
=> 语法: 字符串.substring(开始索引, 结束索引) - 包前不包后
=> 作用: 截取字符串
=> 返回值: 截取出来的字符串
// 4. substring
var str = 'hello world'
// 从 [2] 开始 截取到 [8], 不包含 [8]
var res = str.substring(2, 8)
console.log(res) // llo wo
toLowerCase()
=> 语法: 字符串.toLowerCase()
=> 作用: 把字符串里面的大写字母转成小写字母
=> 返回值: 转换好以后的字符串
// 5. toLowerCase()
var str = 'HELLO worLD'
var res = str.toLowerCase()
console.log(res) // hello world
toUpperCase()
=> 语法: 字符串.toUpperCase()
=> 作用: 把字符串里面的小写字母转换成大写字母
=> 返回值: 转换好以后的字符串
// 6. toUpperCase()
var str = 'HELlo World'
var res = str.toUpperCase()
console.log(res) // HELLO WORLD
replace()
=> 语法: 字符串.replace('要被替换的字符', '替换成的字符')
=> 作用: 替换字符串内的某些字符
-> 只能替换查找到的第一个
=> 返回值: 替换好的字符串
// 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()
=> 语法: 字符串.concat(字符串)
=> 作用: 拼接字符串
=> 返回值: 拼接好的字符串
// 8. concat()
var str = 'hello'
var res = str.concat('world')
console.log(res) // helloworld
slice()
=> 语法: 字符串.slice(开始索引, 结束索引) - 包前不包后
-> 和 substring 的区别就是可以写 负整数
-> 当你写负整数的时候, 表示 length + 负整数
=> 作用: 截取字符串
=> 返回值: 截取好的字符串
// 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 wo
split()
=> 语法: 字符串.split('切割符号', 多少个)
-> 切割符号, 按照你写的符号把字符串切割开
如果不写, 那么就直接切割一个完整的
如果写一个空字符串(''), 按照一位一位的切割
-> 多少个, 选填, 默认是全部, 表示你切割完以后保留多少个
=> 返回值: 一个数组的形式保存每一段内容
-> 不管按照什么切割, 返回值一定是一个数组
// 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']
字符串常用方法2
indexOf()
=> 语法:
字符串.indexOf(字符串片段)
字符串.indexOf(字符串片段, 开始索引)
=> 作用: 在字符串里面查找指定字符串片段
=> 返回值:
-> 如果查询到了, 就是指定索引
-> 如果没有, 就是 -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) // 3
lastIndexOf()
=> 语法:
字符串.lastIndexOf(字符串片段)
字符串.lastIndexOf(字符串片段, 开始索引)
=> 作用: 从后向前查找对应的字符串片段
=> 返回值
-> 如果查询到了, 就是指定索引
-> 如果没有, 就是 -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) // -1
includes()
=> 语法: 字符串.includes('字符串片段')
=> 作用: 字符串里面是否包含该字符串片段
=> 返回值: 布尔值
-> 有就是 true
-> 没有就是 false
// 13. includes()
var str = 'hello world'
var res = str.includes('a')
console.log(res)// false
var res = str.includes('l')
console.log(res)// true
search()
=> 语法: 字符串.search('字符串片段')
=> 作用: 查找字符串里面有没有匹配的字符串片段
=> 返回值:
-> 如果有, 就是指定索引
-> 如果没有, 就是 -1
和 indexOf 的区别 : 没有第二个参数
search 参数可以写正则
// 14. search()
var str = 'hello world'
var res = str.search('l')
console.log(res)//2
var res = str.search('z')
console.log(res)//-1
match()
=> 语法: 字符串.match('字符串片段')
=> 作用: 找到字符串里面的字符串片段
=> 返回值: 是一个数组
-> 里面是找到的字符串片段
=> 实际应用:
-> 不是传递字符串
-> 传递正则
// 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: 1
trim()
=> 语法: 字符串.trim()
=> 作用: 去除首尾空格
=> 返回值: 去除空格以后的字符串
// 16. trim()
var str = ' 你好 世界 '
var res = str.trim()
console.log(res) // 你好 世界
console.log(str) // 你好 世界 原始字符串不变
trimStart()
=> 语法: 字符串.trimStart()
=> 作用: 去除开始的空格
=> 返回值: 去除空格以后的字符串
=> 别名: trimLeft()
trimEnd()
=> 语法: 字符串.trimEnd()
=> 作用: 去除尾部空格
=> 返回值: 去除空格以后的字符串
=> 别名: trimRight()
padStart()
=> 语法: 字符串.padStart(目标长度, '填充字符串')
-> 目标长度: 你想把字符串补充到多长
如果你写的长度小于字符串本身长度, 那么这个函数没有意义
超过长度以后, 用填充字符串补齐
-> 填充字符串: 可以是一个字符, 也可以是多个
多个的时候, 如果超长后面的就不要了
=> 作用: 从前面字符串补齐
=> 返回值: 补齐以后的字符串
// 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) // ab1234
padEnd()
=> 语法: 字符串.padEnd(目标长度, '填充字符串')
-> 目标长度: 你想把字符串补充到多长
如果你写的长度小于字符串本身长度, 那么这个函数没有意义
超过长度以后, 用填充字符串补齐
-> 填充字符串: 可以是一个字符, 也可以是多个
多个的时候, 如果超长后面的就不要了
=> 作用: 从后面字符串补齐
=> 返回值: 补齐以后的字符串
// 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) // 1234a
startsWith()
=> 语法: 字符串.startsWith('字符串片段')
=> 作用: 判断该字符串是不是以这个字符串片段开始
=> 返回值: 一个布尔值
-> 如果是, 就是 true
-> 如果不是, 就是 false
// 21. startsWith()
var str = 'hello world 你好 世界'
var res = str.startsWith('hello')
console.log(res) // true
var res = str.startsWith('world')
console.log(res) // false
endsWith()
=> 语法: 字符串.endsWith('字符串片段')
=> 作用: 判断该字符串是不是以这个字符串片段结尾
=> 返回值: 一个布尔值
-> 如果是, 就是 true
-> 如果不是, 就是 false
// 22. endsWith()
var str = 'hello world 你好 世界'
var res = str.endsWith('hello')
console.log(res) // false
var res = str.endsWith('世界')
console.log(res) // true
字符串里面特别无聊的方法
鸡肋一样的方法
small()
=> 语法: 字符串.small()
=> 作用: 把字符串里面的内容变成小号文字
返回值: <small>字符串</small>
big()
=> 语法: 字符串.big()
=> 作用: 把字符串里面的内容变成大号文字
=> 返回值: <big>字符串</big>
bold()
=> 语法: 字符串.blod()
=> 作用: 把字符串加粗显示
=> 返回值: <b>字符串</b>
fontsize()
=> 语法: 字符串.fontsize(尺寸)
=> 作用: 指定字符串大小
=> 返回值: <font>字符串</font>
fontcolor()
=> 语法: 字符串.fontcolor(颜色)
=> 作用: 指定字符串颜色
=> 返回值: 带一个颜色样式
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