当前位置: 首页 > news >正文

javascript字符串截取有哪些

在 JavaScript 中,字符串截取主要通过以下方法实现,每种方法有不同的特性,适用于不同场景:


1. slice(startIndex, endIndex)

  • 功能:从 startIndexendIndex(不包含)截取子字符串。
  • 特性
    • 支持负数索引(从末尾倒数)。
    • 不修改原字符串。
  • 示例
    const str = "Hello World";
    
    // 正向索引
    str.slice(0, 5);      // "Hello"
    
    // 负索引
    str.slice(-5);        // "World"(从倒数第5位到末尾)
    str.slice(3, -2);     // "lo Wor"(第3位到倒数第2位前)
    
    // 省略 endIndex
    str.slice(6);         // "World"
    

2. substring(startIndex, endIndex)

  • 功能:类似 slice,但自动处理索引顺序。
  • 特性
    • 负数索引视为 0
    • startIndex > endIndex,自动交换参数。
  • 示例
    const str = "Hello World";
    
    str.substring(0, 5);    // "Hello"
    str.substring(6, 11);   // "World"
    
    // 自动交换参数
    str.substring(5, 0);    // "Hello"
    
    // 负数视为0
    str.substring(-3, 5);   // "Hello"
    

3. substr(startIndex, length)(已弃用)

  • 功能:从 startIndex 开始截取指定长度的子字符串。
  • 注意:非标准方法,未来可能被移除,建议改用 slice
  • 示例
    const str = "Hello World";
    str.substr(6, 5);      // "World"(从第6位开始,截5字符)
    str.substr(-5, 5);     // "World"(倒数第5位开始,截5字符)
    

4. 字符截取扩展方法

(1) 按分隔符截取:split()
// 分割字符串后取某一部分
const url = "https://example.com/path";
const domain = url.split("/")[2];  // "example.com"
(2) 正则表达式截取:match()
// 提取数字部分
const text = "ID: 12345";
const id = text.match(/\d+/)[0];   // "12345"
(3) 固定位置截取:charAt()[]
// 获取单个字符
const str = "Hello";
str.charAt(1);    // "e"
str[1];           // "e"(现代语法)

方法对比与选择建议

方法推荐场景注意点
slice需要负数索引、灵活截取时最常用,支持正向/反向索引
substring明确知道索引且需自动处理参数顺序时负数视为0,可能意外截取开头
split按固定分隔符提取某部分(如URL处理)分割数组后需索引访问
正则表达式复杂模式匹配(如提取邮箱、日期格式)需要熟悉正则语法

经典场景示例

1. 截取文件扩展名
const filename = "image.jpg";
const ext = filename.slice(filename.lastIndexOf(".") + 1); // "jpg"
2. 隐藏手机号中间四位
const phone = "13812345678";
const masked = phone.slice(0, 3) + "****" + phone.slice(-4); // "138****5678"
3. 提取URL路径
const url = "https://example.com/blog/post-1";
const path = url.split("/").slice(3).join("/"); // "blog/post-1"

注意事项

  1. 索引范围

    • 起始索引超过字符串长度 → 返回空字符串。
    • 结束索引超过字符串长度 → 截取到末尾。
  2. 不可变性

    • 所有方法返回新字符串,原字符串不变。
  3. Unicode 字符

    • 对包含 Emoji 或多字节字符的字符串,需注意索引位置:
      "👋🌍".slice(0, 2); // "👋"(正确)
      "👋🌍".substring(0, 2); // "�"(乱码,因每个 Emoji 占两个码位)
      

合理选择截取方法,可高效处理字符串操作。推荐优先使用 slice,慎用 substr

相关文章:

  • RabbitMQ知识点
  • 二叉树-验证二叉搜索树
  • 计算机网络开发(2)TCP\UDP区别、TCP通信框架、服务端客户端通信实例
  • RV1126采集VI视频数据流
  • 【QWEN】机器人控制器的控制周期越短精度越高吗
  • Kotlin D1
  • 模块15.常用API
  • Java接口(3)与图书管理系统
  • Android 多用户相关
  • tcp/ip协议详细介绍,tcpip协议详细介绍
  • DeepSeek 助力 Vue3 开发:打造丝滑的表格(Table)示例5: 搜索和过滤
  • DeepSeek精品课分享 清北
  • 《几何原本》命题I.15
  • YOLOv12改进之A2(区域注意力)
  • LeetCode热题100JS(44/100)第八天|二叉树的直径|二叉树的层序遍历|将有序数组转换为二叉搜索树|验证二叉树搜索树|二叉搜索树中第K小的元素
  • Kafka - 高吞吐量的七项核心设计解析
  • 全面复习回顾——C++语法篇2
  • Docker部署开源运维工具MyIP结合内网穿透远程在线网络诊断和监控
  • 【Unity Shader编程】之光照模型
  • 【1Panel】平替宝塔面板!1Panel面板香橙派部署结合内网穿透远程管理
  • 做app和做网站相同和区别/免费推广app平台有哪些
  • 泉州市建设工程交易网站/链接提交入口
  • 地方房地产网站seo实战案例分享/seo推广怎么学
  • 动态网页毕业设计/seo网上培训
  • dede wap网站模板下载/专业黑帽seo
  • 青岛建网站/一个新品牌如何推广