JS---字符串常用方法

福西西za
119 阅读6分钟

一、严格模式(了解)

  • JS 是一个相对不是很严谨的语言, 在开发的时候一些代码也不是很严格, 严格模式就是对开发的时候写的代码做了一些要求

如何开启严格模式

  • 要开启严格模式, 直接在代码最开始的位置写上字符串 'use strict'

严格模式的规则

  1. 声明变量必须有 var 关键字
  2. 函数的形参不可以重复

二、字符串

创建字符串(了解)

  • 字面量
  • 构造函数创建
var str1 = "hello";
var str2 = new String("hello");

ASCII 字符集(了解)

  • 计算机只能存储二进制数据 0101010
  • 我们的 大写字母; 小写字母; 符号 之类的内容也是由二进制数字组成的
  • 或者说 我们的字母符号这些东西写都有一个对应的编号, 然后计算机存储的时候是存储的这些编号,不过我们看到的时候, 是通过这些编号解析成我们看到的内容
  • 所以我们计算机存储的字母符号之类的并不是存储了这个字母, 而是存储了这个字母对应的编号, 然后给我们看到的时候是通过这个编号找到了对应的字母给我们看

unicode 编码

  • ASCII 只有 128 个字符的编码结构, 这是因为他出现的比较早, 而且是美国发明的, 所以在早期这些内容完全足够
  • 但是这个世界要存储的东西就不够, 比如我们的汉字, 所以就出现了 unicode 编码, 也叫(万国码, 统一码)
  • unicode 和 ASCII 一样的对照表, 只不过存的东西特别多, 基本包含了世界上大部分国家的文字, 所以我们的文字在存储的时候 都是按照 unicode 编码转换成了数字进行存储
  • 我们的 UTF-8 就是一种 8 位的 unicode 字符集

操作字符串的常用方法

1. charAt

  • 语法: 变量/字符串.charAt(下标)
  • 作用: 根据下标去字符串中寻找对应的值
  • 返回值: 如果字符串中有对应的下标那么返回对应的值，如果没有返回一个空字符串
        var str = 'QF123'
        var res = str.charAt(40)
        console.log(res)
        console.log(str[0]) // Q

2. charCodeAt

  • 语法: 变量/字符串.charCodeAt(下标)
  • 作用: 根据下标去字符串中寻找对应的值, 然后找到这个值对应的 unicode 编码
  • 返回值: 如果找到返回 unicode 编码，没有返回 NaN
        var str = 'QF123'
        var res = str.charCodeAt(40)
        var res1 = str.charCodeAt(0)
        console.log(res) // NaN
        console.log(res1) //81

3. toLowerCase

  • 语法: 变量/字符串.toLowerCase()
  • 作用: 将字符串中所有的字母转换为小写
  • 返回值: 转小写后的字符串

4. toUpperCase

  • 语法: 变量/字符串.toUpperCase()
  • 作用: 将字符串中所有的字母转换为大写
  • 返回值: 转大写后的字符串
        var str = 'abcQWE'
        console.log('原字符串: ', str)    // abcQWE
        console.log('toLowerCase: ', str.toLowerCase())    // abcqwe
        console.log('toUpperCase: ', str.toUpperCase())    // ABCQWE
        console.log('原字符串: ', str)    // abcQWE

5. substr

  • 语法: 变量/字符串.substr(开始索引, 截取多少个)
  • 作用: 截取字符串
  • 返回值: 截取出来的字符串

6. substring

  • 语法: 变量/字符串.substr(开始索引, 结束索引)
  • 作用: 截取字符串
  • 返回值: 截取出来的字符串
  • 注意: 参数包前不包后，可省略不写
        var str = 'qwertyuiop'
        console.log(str.substr(2, 3))       //  从[2]开始, 截取 3 个:  ert
        console.log(str.substring(2, 3))    // 从[2]开始, 到 [3] 结束:  e
        // console.log(str.substring(6, -1))    // 参数中不推荐写 负数
        console.log(str.substring(6))    // 从[6]开始, 到字符串末尾结束
        console.log(str.substring())    // 复制整个字符串

7. slice

  • 语法: 变量/字符串.slice(开始索引, 结束索引)
  • 作用: 截取字符串
  • 返回值: 截取出来的字符串
  • 注意: 参数包前不包后，可省略不写，可以有负数
        var str = 'qwertyuiop'
        console.log(str.slice(2, 3))        // e
        console.log(str.slice(2))           // ertyuiop
        console.log(str.slice())            // qwertyuiop
        console.log(str.slice(5, -1))        // yuio

8. concat

  • 语法: 变量/字符串.concat(字符串1, 字符串2,......)
  • 作用: 合并数据到执行的字符串中
  • 返回值: 合并后的一个新字符串
        var str = 'QWE123Q'
        console.log(str.concat('!@#', 'asd', '+-*/')) //QWE123Q!@#asd+-*/
        console.log('方法使用完毕后的源字符串: ', str) //方法使用完毕后的源字符串:  QWE123Q

9. indexOf

  • 语法: 变量/字符串.indexOf(查找的字符, 开始索引)
  • 作用: 查找当前字符串中是否包含指定字符
  • 返回值: 找到返回第一次出现的首字母索引位置, 找不到就返回 -1
        var str = 'QWE123Q'
        console.log(str.indexOf('@'))   // -1
        console.log(str.indexOf('Q'))   // 0
        console.log(str.indexOf('Q', 3))   // 6

10. lastIndexOf

  • 语法: 变量/字符串.lastIndexOf(查找的字符, 开始索引)
  • 作用: 查找当前字符串中是否包含指定字符 (从后往前)
  • 返回值: 找到返回第一次出现的首字母索引位置, 找不到就返回 -1
        var str = 'QWE123Q'
        console.log(str.lastIndexOf('@'))   // -1
        console.log(str.lastIndexOf('Q'))   // 6
        console.log(str.lastIndexOf('Q', 3))   // 0

11. split

  • 语法: 变量/字符串.split('分隔符')
  • 作用: 把字符串按照分隔符分开为几段内容
  • 返回值: 拆分好的字符串, 组成的一个数组
  • 注意: 如果传递的分隔符是一个空字符串, 那么会将整个字符串按照每一个字符拆分开, 放在一个数组中
        var str = 'value=QF001=QF002=QF003'
        console.log(str.split('=')) // ['value', 'QF001', 'QF002', 'QF003']
        console.log(str.split('@')) // ['value=QF001=QF002=QF003']
        console.log(str.split())    // ['value=QF001=QF002=QF003']
        console.log(str.split(''))  //  ['v', 'a', 'l', 'u', 'e', '=', 'Q', 'F', '0', '0', '1', '=', 'Q', 'F', '0', '0', '2', '=', 'Q', 'F', '0', '0', '3']
        console.log(str.split(' '))    // ['value=QF001=QF002=QF003']

12. trim

  • 语法: 变量/字符串.trim()
  • 作用: 把字符串左右空格去除
  • 返回值: 去除空格后的字符串

13. trimStart/trimLeft

  • 语法: 变量/字符串.trimStart()
  • 语法: 变量/字符串.trimLeft()
  • 作用: 把字符串左边空格去除
  • 返回值: 去除左边空格后的字符串

14. trimEnd/trimRight

  • 语法: 变量/字符串.trimEnd()
  • 语法: 变量/字符串.trimRight()
  • 作用: 把字符串右边空格去除
  • 返回值: 去除右边空格后的字符串
        var str1 = ' 1 2 3 '
        var str2 = '123'
        console.log('源字符串' + str2)
        console.log('源字符串' + str1)

        console.log('trim' + str1.trim())   // 去掉了字符串两边的空格

        console.log('trimStart' + str1.trimStart()) // 去掉了字符串左边的空格
        console.log('trimLeft' + str1.trimLeft())   // 去掉了字符串左边的空格

        console.log('trimEnd' + str1.trimEnd())         // 去掉了字符串右边的空格
        console.log('trimRight' + str1.trimRight())     // 去掉了字符串右边的空格

15. includes

  • 语法: 变量/字符串.includes('要查询的一些字符')
  • 作用: 用于判断字符串中是否包含一段字符
  • 返回值: true/false

16. startsWith

  • 语法: 变量/字符串.startsWith('要查询的一些字符')
  • 作用: 用于判断字符串开头是否为指定的字符
  • 返回值: true/false

17. endsWith

  • 语法: 变量/字符串.endsWith('要查询的一些字符')
  • 作用: 用于判断字符串结尾是否为指定的字符
  • 返回值: true/false
        var str = 'qwe123!@#$%^&*()asd'
        console.log(str)
        console.log(str.includes('QF001')) // false
        console.log(str.includes('!@#$%^&*')) // true
        console.log(str.includes('qweasd')) // false
        console.log(str.includes('qwe123')) // true

        console.log(str.startsWith('q')) // true
        console.log(str.startsWith('qwe123')) // true
        console.log(str.startsWith('qweasd')) // flase

        console.log(str.endsWith('asd')) // true
        console.log(str.endsWith('asdtyuiop')) // false

18. repalce

  • 语法: 变量/字符串.repalce('查找的字符串', '要替换的内容')
  • 作用: 去字符串中找到一个指定的内容, 然后将新的内容替换过去
  • 返回值: 修改好的字符串
        var str = 'QF001QF001QF001'
        var res = str.replace('QF', '***')
        console.log(res) // '***001QF001QF001'
avatar
文章
阅读
粉丝