3个 JavaScript 字符串截取方法

news2024/11/25 6:08:29

在 JavaScript 中,可以使用 substr()slice() 和 substring() 方法截取字符串.

substring()

substring() 方法返回一个字符串在开始索引到结束索引之间的一个子集,或从开始索引直到字符串的末尾的一个子集。语法如下:

str.substring(indexStart[, indexEnd])

参数说明:

  • indexStart:需要截取的第一个字符的索引,该索引位置的字符作为返回的字符串的首字母。
  • indexEnd:可选。一个 0 到字符串长度之间的整数,以该数字为索引的字符不包含在截取的字符串内。

如果 startIndex 大于 endIndex,则会交换它们的位置。来看一段示例代码:

let str = "深耕WEB开发10+年,拥有一颗工匠的心";

console.log(str.substring(7)); // 10+年,拥有一颗工匠的心
console.log(str.substring(0, 5)); // 深耕WEB
console.log(str.substring(7, 5)); // 开发
console.log(str.substring(5, 5)); // 空

substr()

substr() 方法返回一个字符串中从指定位置开始到指定字符数的字符。语法如下:

str.substr(start[, length])

第一个参数是截取开始的位置,第二个参数是截取的长度。如下代码:

let str = "深耕WEB开发10+年,拥有一颗工匠的心";
let result = str.substr(1, 4);
console.log(result); // 耕WEB

上述代码的 1 表示从第二个字符开始截取,4 表示截取的长度为 4 个字符。

substr() 方法在截取字符串时是基于字符位置的,如果截取长度超过了字符串的长度,它会一直截取到字符串的末尾。如果第一个参数是负数,则从字符串的末尾开始计数。

如果可以的话,建议使用 substring() 来取代 substr()

slice()

slice() 方法提取某个字符串的一部分,并返回一个新的字符串,且不会改动原字符串,与 substring() 方法类似。语法如下:

str.slice(startIndex, endIndex)

其中,startIndex 表示要截取的子字符串的起始位置(包含该位置),endIndex 表示要截取的子字符串的结束位置(不包含该位置)。如果只传入 startIndex,则会从该位置一直截取到字符串末尾。如果 startIndex 大于 endIndex,则会返回空字符串。例如:

let str = "深耕WEB开发10+年,拥有一颗工匠的心";

console.log(str.slice(7)); // 10+年,拥有一颗工匠的心
console.log(str.slice(0, 5)); // 深耕WEB
console.log(str.slice(7, 5)); // ""
console.log(str.slice(5, 5)); // ""

substring() 和 substr() 的区别

substring() 和 substr() 都是截取字符串的方法,但它们有以下区别:

  1. 参数不同substring() 方法的第一个参数是起始位置,第二个参数是终止位置(不包括该位置的字符);substr() 方法的第一个参数是起始位置,第二个参数是截取的长度。
  2. 负数处理不同substring() 方法不接受负数参数,如果传入负数,会被自动转换为0substr() 方法可以接受负数参数,表示倒数计数。
  3. 返回值不同substring() 方法返回从起始位置到终止位置之间的字符;substr()方法返回从起始位置开始指定长度的字符。

ES6中新增了 slice() 方法,但它和 substring() 方法非常相似,也是接受起始位置和终止位置作为参数,不同之处是slice() 方法可以接受负数参数,表示从字符串末尾开始计数。substr() 虽然没有被完全遗弃,但还是建议使用 substring() 来取代 substr()

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1566517.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

GT收发器64B66B设计(1)IP核配置和example design

文章目录 前言一、IP核配置1.1、编码方式1.2、字节对齐和逗号码 二、example design 前言 在前面我们基于GT收发器进行了PHY层设计,其中采用的编码方式为8B10B,为进一步提高传输效率,从本文开始,将采用基于GT高速收发器采用64B66…

DC/DC选型:了解电感参数的基本含义

电感是一种相对简单的元件,它由缠绕在线圈中的绝缘线组成。但当单个元件组合在一起,用来创建具有适当尺寸、重量、温度、频率和电压的电感,同时又能满足目标应用时,复杂性就会增加。 选择电感时,了解电感数据手册中标…

京西商城——基于viewset视图集开发评论接口

在使用GenericAPIView和Mixins开发时,确实可以大大提高编码的速度以及减少代码量,但是在一个视图里并不能实现5个基础的请求方法,要用两个视图类来完成。所以我们可以使用viewset(视图集)来将两个视图类合并 如果要使…

Docker实战教程 第2章 Docker基础

3-1 Docker介绍 什么是Docker 虚拟化,容器 Docker 是一个开源的应用容器引擎,基于 Go 语言 并遵从Apache2.0协议开源。 Docker 可以让开发者打包他们的应用以及依赖包到一个轻量级、可移植的容器中,然后发布到任何流行的 Linux 机器上&…

职场聚餐:搭建沟通桥梁,促进团队凝聚力

在职场中,聚餐作为一种非正式的社交活动,不仅能够增进同事间的了解,还有助于提升团队凝聚力。本文将探讨职场聚餐的重要性以及如何组织一场成功的职场聚餐。 一、职场聚餐的重要性 1. 搭建沟通桥梁:职场聚餐为员工提供了一个轻松愉…

Java中线程详解

文章目录 相关概念多线程概念实现方式继承Thread类实现Runnable接口比较 常用方法线程安全产生的原因解决思想同步同步代码块同步方法Lock锁机制 死锁概念避免 状态线程间的通讯介绍方法 相关概念 并行:在同一时刻,有多个任务在多个CPU上同时执行并发&a…

【JAVASE】学习类与对象的创建和实例化

✅作者简介:大家好,我是橘橙黄又青,一个想要与大家共同进步的男人😉😉 🍎个人主页:再无B~U~G-CSDN博客 目标: 1. 掌握类的定义方式以及对象的实例化 2. …

QML嵌套页面的实现学习记录

StackView是一个QML组件,用于管理和显示多个页面。它提供了向前和向后导航的功能,可以在堆栈中推入新页面,并在不需要时将页面弹出。 ApplicationWindow {id:rootvisible: truewidth: 340height: 480title: qsTr("Stack")// 抽屉:…

语义分割交互式智能标注工具 | 澳鹏数据标注平台

随着人工智能应用的大规模落地,数据标注市场在高速增长的同时,也面临着标注成本的挑战。据IDC报告显示:数据标注在AI应用开发过程中所耗费的时间占到了25%,部分医学类应用一条数据的标注成本甚至高达20元。数据精度的高要求、强人…

【Django学习笔记(五)】JQuery介绍

JQuery介绍 前言正文1、JQuery 快速上手1.1 下载 JQuery1.2 应用 JQuery 2、寻找标签(直接)2.1 ID选择器2.2 样式选择器2.3 标签选择器2.4 层级选择器2.5 多选择器2.5 属性选择器 3、寻找标签(间接)3.1 找到上一个兄弟3.2 找父子 …

浪潮分布式存储AS13000G6-M36改扩配后管理界面不能识别和标记硬盘的处理方法

AS13000G6 改配出问题的场景 浪潮分布式存储AS13000G6-M36渠道备货的分布式存储通常是流量机型,实际出货可能会涉及改配 集群部署完以后建议在系统视图下查看一下盘是否能识别 这个是正常的情况,可以正确管理到盘,硬盘侧边有绿色的指示灯。 如图是管理…

【Linux】进程控制详解

目录 前言 进程创建 认识fork 写时拷贝 再谈fork 进程终止 进程退出码 用代码来终止进程 常见的进程终止的方式 exit _exit 进程等待 进程等待的必要性 进程等待的方式 wait waitpid 详解status参数 详解option参数 前言 本文适合有一点基础的人看的&#…

计算机笔记(3)续20个

41.WWW浏览器和Web服务器都遵循http协议 42.NTSC制式30帧/s 44.三种制式电视:NTSC,PAL,SECAM 45.IP,子网掩码白话文简述: A类地址:取值范围0-127(四段数字(127.0.0.0&#xff09…

Oil Deposits (DFS BFS)

//新生训练 #include <iostream> #include <algorithm> #include <cstring> #include <queue> using namespace std; using PII pair<int, int>; const int N 205; int n, m; int dis[N][N]; int dx[] {0, 0, -1, 1, -1, 1, -1, 1}; int dy[]…

JAVAEE之Spring, Spring Boot 和Spring MVC的关系以及区别

1.Spring, Spring Boot 和Spring MVC的关系以及区别 Spring: 简单来说, Spring 是⼀个开发应⽤框架&#xff0c;什么样的框架呢&#xff0c;有这么⼏个标签&#xff1a;轻量级、⼀ 站式、模块化&#xff0c;其⽬的是⽤于简化企业级应⽤程序开发 Spring的主要功能: 管理对象&am…

《pytorch深度学习实战》学习笔记第1章

第1章 深度学习和pytorch库简介 1.1 深度学习革命 机器学习依赖特征工程。而深度学习是从原始数据中自动找出这样的特征。 1.2 pytorhc深度学习 pytorch是一个python程序库。pytorch为深度学习提供了入门指南。pytorch的核心数据结构——张量&#xff0c;为一个多维数组&…

slowhttp攻击漏洞原理解析和防御,以及LiqunKit 综合漏洞利用工具详细使用

slowhttp攻击漏洞原理解析和防御,以及LiqunKit 综合漏洞利用工具详细使用。 Slowhttp攻击是一种拒绝服务(DoS)攻击,它利用了HTTP协议的一些特性来耗尽服务器资源,导致服务器对正常请求的响应变慢或无法响应。这种攻击的特点是长时间占用服务器的连接,而不是发送大量流量…

网工内推 | 国企运维,IA认证,大专以上即可,最高22K

01 深圳建广数字科技有限公司青岛分公司 招聘岗位&#xff1a;桌面运维工程师 职责描述&#xff1a; 1.根据运维服务请求完成关于操作系统、应用软件、办公设备、网络等方面的安装、管理与维护&#xff1b; 2.各种PC软硬件故障诊断、排查及升级&#xff1b; 3.桌面设备&…

爬虫 红网时刻 获取当月指定关键词新闻 并存储到CSV文件

目标网站&#xff1a;红网 爬取目的&#xff1a;为了获取某一地区更全面的在红网已发布的宣传新闻稿&#xff0c;同时也让自己的工作更便捷 环境&#xff1a;Pycharm2021&#xff0c;Python3.10&#xff0c; 安装的包&#xff1a;requests&#xff0c;csv&#xff0c;bs4&…

锂电池充电电压4.2V,那么充电器升压到9V、12V意义何在?

锂电池充电电压4.2V&#xff0c;那么充电器升压到9V、12V意义何在&#xff1f;PD、QC等快充又是如何工作&#xff1f;带着这些问题&#xff0c;笔者阅读了一些大佬的分析&#xff0c;在此整理下来&#xff0c;并略抒愚见。 手机快充协议简介&#xff0c;PD&#xff0c;PE&#…