JS中字符串的方法

5 分钟
25 阅读
JS中字符串的方法

JavaScript 字符串方法完整整理

JavaScript 提供了丰富的字符串操作方法，以下是所有字符串方法的分类整理和详细说明。

一、基本操作方法

1. 访问字符方法

  • charAt(index) - 返回指定位置的字符
    javascript 复制代码 
    'hello'.charAt(1); // 'e'
  • charCodeAt(index) - 返回指定位置字符的Unicode编码
    javascript 复制代码 
    'hello'.charCodeAt(1); // 101
  • codePointAt(pos) - 返回指定位置字符的Unicode码点（支持代理对）
    javascript 复制代码 
    '𠮷'.codePointAt(0); // 134071
  • [] (方括号表示法) - ES6新增，类似charAt
    javascript 复制代码 
    'hello'[1]; // 'e'

2. 字符串查找方法

  • indexOf(searchValue, fromIndex) - 返回子字符串首次出现的位置
    javascript 复制代码 
    'hello'.indexOf('l'); // 2
  • lastIndexOf(searchValue, fromIndex) - 返回子字符串最后出现的位置
    javascript 复制代码 
    'hello'.lastIndexOf('l'); // 3
  • includes(searchString, position) - ES6新增，判断是否包含子字符串
    javascript 复制代码 
    'hello'.includes('ell'); // true
  • startsWith(searchString, position) - ES6新增，判断是否以某字符串开头
    javascript 复制代码 
    'hello'.startsWith('hel'); // true
  • endsWith(searchString, length) - ES6新增，判断是否以某字符串结尾
    javascript 复制代码 
    'hello'.endsWith('llo'); // true
  • match(regexp) - 使用正则表达式匹配字符串
    javascript 复制代码 
    'hello'.match(/l/g); // ['l', 'l']
  • search(regexp) - 搜索正则匹配的位置
    javascript 复制代码 
    'hello'.search(/l/); // 2

二、字符串修改方法

（注意：字符串不可变，以下方法都返回新字符串）

  • concat(str1, ..., strN) - 连接字符串
    javascript 复制代码 
    'hello'.concat(' ', 'world'); // 'hello world'
  • slice(start, end) - 提取子字符串
    javascript 复制代码 
    'hello'.slice(1, 3); // 'el'
  • substring(start, end) - 类似slice，但不接受负数
    javascript 复制代码 
    'hello'.substring(1, 3); // 'el'
  • substr(start, length) - 从指定位置提取指定长度的子串（已废弃）
    javascript 复制代码 
    'hello'.substr(1, 3); // 'ell'
  • replace(regexp|substr, newSubstr|function) - 替换子字符串
    javascript 复制代码 
    'hello'.replace('l', 'x'); // 'hexlo'
'hello'.replace(/l/g, 'x'); // 'hexxo'
  • replaceAll(searchValue, replaceValue) - ES2021新增，替换所有匹配项
    javascript 复制代码 
    'hello'.replaceAll('l', 'x'); // 'hexxo'
  • toLowerCase() - 转换为小写
    javascript 复制代码 
    'HELLO'.toLowerCase(); // 'hello'
  • toUpperCase() - 转换为大写
    javascript 复制代码 
    'hello'.toUpperCase(); // 'HELLO'
  • toLocaleLowerCase() - 根据本地环境转换为小写
  • toLocaleUpperCase() - 根据本地环境转换为大写
  • trim() - 去除两端空白
    javascript 复制代码 
    ' hello '.trim(); // 'hello'
  • trimStart()/trimLeft() - 去除开头空白
    javascript 复制代码 
    ' hello '.trimStart(); // 'hello '
  • trimEnd()/trimRight() - 去除结尾空白
    javascript 复制代码 
    ' hello '.trimEnd(); // ' hello'
  • padStart(targetLength, padString) - ES2017，开头填充
    javascript 复制代码 
    '5'.padStart(3, '0'); // '005'
  • padEnd(targetLength, padString) - ES2017，结尾填充
    javascript 复制代码 
    '5'.padEnd(3, '0'); // '500'

三、字符串转换与分割方法

  • split(separator, limit) - 分割字符串为数组
    javascript 复制代码 
    'hello'.split(''); // ['h','e','l','l','o']
'a,b,c'.split(','); // ['a','b','c']
  • repeat(count) - ES6，重复字符串
    javascript 复制代码 
    'ha'.repeat(3); // 'hahaha'
  • normalize(form) - ES6，Unicode标准化
    javascript 复制代码 
    '\u1E9B\u0323'.normalize(); // 'ẛ̣'

四、字符串迭代方法

  • String.raw() - ES6，获取模板字符串的原始形式
    javascript 复制代码 
    String.raw`Hi\n`; // 'Hi\\n'
  • Symbol.iterator - ES6，使字符串可迭代
    javascript 复制代码 
    for (const char of 'hello') { console.log(char); }
// 依次输出: h e l l o

五、HTML包装方法（已废弃，了解即可）

  • anchor(name)
  • big()
  • blink()
  • bold()
  • fixed()
  • fontcolor(color)
  • fontsize(size)
  • italics()
  • link(url)
  • small()
  • strike()
  • sub()
  • sup()

六、实用技巧

  1. 多行字符串（ES6模板字符串）

    javascript 复制代码 
    const str = `第一行
第二行
第三行`;

  2. 字符串插值（ES6模板字符串）

    javascript 复制代码 
    const name = 'Alice';
const greeting = `Hello, ${name}!`;

  3. 判断空字符串

    javascript 复制代码 
    function isEmpty(str) {
  return !str || str.trim() === '';
}

  4. 反转字符串

    javascript 复制代码 
    const reversed = 'hello'.split('').reverse().join(''); // 'olleh'

  5. 首字母大写

    javascript 复制代码 
    function capitalize(str) {
  return str.charAt(0).toUpperCase() + str.slice(1);
}

总结

JavaScript 字符串方法丰富，从基本的访问、查找、修改到ES6新增的现代方法，可以满足各种字符串操作需求。在实际开发中，建议优先使用ES6及以后的新方法，它们通常更简洁高效。

评论

评论

发表评论