js中常遇到 切割截取字符串的几种方法

news2025/1/24 1:39:13

切割截取字符串的几种方法
1、 split() 方法用于把一个 字符串 分割成 字符串数组 ;

 stringObject.split(str,length)
var str = "123,456,789"; 
console.log(str.split(''));  // ["1", "2", "3", ",", "4", "5", "6", ",", "7", "8", "9"]
console.log(str.split(',')); // ["123", "456", "789"] 
参数描述
str必需。字符串或正则表达式,从该参数指定的地方分割 stringObject
length可选。如果没有设置该参数,整个字符串都会被分割,不考虑它的长度

注意:如果把空字符串 ("") 用作 str,那么 stringObject 中的每个字符之间都会被分割。

2、 slice() 可提取字符串的某个部分,并以新的字符串返回被提取的部分;

第一个参数必填,第二个参数选填;
注意:如果该参数为负数, 则它表示在原数组中的倒数第几个元素结束抽取

在这里插入图片描述
如图所示:[1,2,3,4].slice(0, 3) 0代表开始选取的位置 start,3代表结束位置

var str = "123,456,789"; 
console.log(str.slice(2,6));	 // 3,45
console.log(str.slice(-6,-2));   // 56,7
console.log(str.slice(2)); 		 // 3,456,789
console.log(str.slice(-6)); 	 // 56,789 

3、substring() 提取字符串中介于两个指定下标之间的字符
语法:string.substring(from, to);from必选而且非负的整数,to可选非负的整数 但是to的值必须比from大位置多1个;

var str = "123,456,789"; 
console.log(str.substring(2,6)); 	// 3,45
console.log(str.substring(2)); 		// 3,456,789
console.log(str.substring(6,2)); 	// 3,45
console.log(str.substring(-6,-2));  //  
console.log(str.substring(6,6)); 	//  

4、join() 把数组中的所有元素转换一个字符串

var str = [123,456,789]; 
console.log(str.join('')); // 123456789
console.log(str.join(',')); // 123,456,789

5、 charAt() 返回指定位置的字符

string.charAt(index)

index:必需。表示字符串中某个位置的数字,即字符在字符串中的位置。
在这里插入图片描述

***:自己开发中常遇到,就当一个笔记,记不住打开看看例子就明白;

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

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

相关文章

【PC端聊天功能模板】vue-elementul简单实现电脑端客服聊天功能,pc端聊天系统静态页面布局,配套websocket方案和心跳重连机制【详细注释,拿来即用】

前言 这里是给大家写了一个简单的模板来使用,可以直接复制了调调就能用。因为这个聊天也是很容易出现的功能,所以我写一个模板静态页面放在这,以后需要这个功能的时候可以不用布局了,直接复制改改。 我的代码里面有详细的注释&…

小马带你认识前端开发神器WebStorm(WebStorm及Git的相关配置与使用)

先说一下个人感觉吧,小马之前也是一直在用 Visual Studio Code 来进行开发,但随着开发需求增加,VS 所需要的插件越来越多(用过 vs code 的同学都知道,它虽可以进行各种开发语言的编写,但是需要相应的插件支…

ECharts设置x轴刻度间隔的两种方法

ECharts设置x轴刻度文字间隔的两种方法 背景 最近在写一个echarts数据看板,要在一个页面中展示多张图表,所以留给每张图表的尺寸就很小。这也就使得图表x轴的刻度文字全部挤到一起了,废话不多说,直接上图看效果。 右边的图标就…

11.定时任务定时线程池详解

3.1 新增定时任务池 11.定时任务&定时线程池详解 ​ 当我们不用任务框架时,我们想自己写一个定时任务时,我们能想起那个工具类呢?Timer ?还有吗?不知道了,下面我们要讲下ScheduledThreadPoolExecutor…

Vue图片路径问题(动态引入:绝对路径、相对路径),require动态路径问题

Vue图片路径问题&#xff08;动/静态引入&#xff1a;绝对路径、相对路径&#xff09; DEMO实例&#xff08;可快速解决问题&#xff09;: 注意&#xff1a;绝对路径方式导入的图片需要存储在 publiic 文件夹下 静态导入相对路径&#xff1a; <img src"../../asset…

Mybatis+Servlet+Mysql 整合的一个小项目:对初学者非常友好,有助于初学者很快的上手Java Web

文章目录前言为何要写&#xff1f;目录结构1 依赖配置1.1 创建一个web项目1.2 依赖需求分析1.3 pom.xml2 配置Mybatis2.1 mybatis-config.xml2.2 UserMapper.xml2.3 UserMapper.interface3 配置Tomcat4 Servlet类4.1 loginServlet014.2 registerRequest015 静态页面代码5.1 Htm…

Vue开发实例(13)之axios和mockjs的安装与使用

作者简介 作者名&#xff1a;编程界明世隐 简介&#xff1a;CSDN博客专家&#xff0c;从事软件开发多年&#xff0c;精通Java、JavaScript&#xff0c;博主也是从零开始一步步把学习成长、深知学习和积累的重要性&#xff0c;喜欢跟广大ADC一起打野升级&#xff0c;欢迎您关注&…

Vue3中 内置组件 Teleport 详解

1. 基本概念 1.1 简单理解 不管是 Vue2 还是 Vue3 中都有内置组件的存在&#xff0c;如 component 内置组件、transition 内置组件等等。内置组件就是官方给我们封装的全局组件&#xff0c;我们直接拿来用就可以了。 在 Vue3 中新增了 Teleport 内置组件&#xff0c;先来看下…

【JavaScript-数组全家福】

目录 前言 数组 1.创建 new Array数组 2.检测是否为数组 1.使用instanceof检测是否为数组 2.使用Array.isArray()来检测 3.添加删除数组方法 4.筛选数组 5.数组排序 6.数组索引方法 7.数组去重 8.数组转字符串 写在最后 前言 博主是&#x1f466;一个帅气的boy&#…

前端案例:飞机大战( js+dom 操作,代码完整,附图片素材)

目录 一、案例效果 二、实现思路 三、完整代码详细注释 四、涉及要点 五、案例素材 一、案例效果 二、实现思路 创建游戏背景板&#xff1b;创建我方战机&#xff0c;鼠标进入游戏面板后其随鼠标轨迹运动&#xff1b; onmousemove创建子弹&#xff0c;让子弹周期性的在战…

Grafana alert预警+钉钉通知

1 Grafana alert预警 如下图所示&#xff0c;主要是前3步&#xff0c;设置alert rules、contact points 、notification policies。alert rules主要设置触发警告的规则&#xff1b;contact points设置通过什么发送预警&#xff0c;如钉钉&#xff1b;notification policies 将…

鼠标事件、键盘事件,你听过嘛?

&#x1f4dc;个人简介 ⭐️个人主页&#xff1a;微风洋洋&#x1f64b;‍♂️ &#x1f351;博客领域&#xff1a;编程基础,后端 &#x1f345;写作风格&#xff1a;干货,干货,还是tmd的干货 &#x1f338;精选专栏&#xff1a;【JavaScript】 &#x1f680;支持洋锅&#xff…

Chrome-谷歌浏览器多开教程

Chrome谷歌浏览器多开教程在我们的日常生活中&#xff0c;我们常常在某一时刻需要在进行多个账号的查看&#xff0c;例如在跨境电商时&#xff0c;我们常常需要开多各店铺页面&#xff0c;又或者&#xff0c;我们在玩游戏时&#xff0c;需要开多个账号同时进行运作&#xff0c;…

一文通透从输入URL到页面渲染的全过程----高频面试

一文通透从输入URL到页面渲染的全过程----高频面试 喜欢大海 喜欢夕阳 写下便是永恒 文章目录一文通透从输入URL到页面渲染的全过程----高频面试重温进程与线程什么是进程什么是线程进程和线程的区别多进程和多线程JS为什么是单线程浏览器相关浏览器是多进程的浏览器包含哪些进…

jeecg-boot首页加载速度优化全过程

优化结果 前端和后端部署在轻量服务器: 以下结果都是三次强刷得到的 优化前: 优化后: 优化方案 开启Nginx压缩 方案来自于:jeecg官方文档 作用:通过nginx内置的压缩策略来压缩静态资源&#xff0c;提升资源请求速度 在nginx.conf 的 http 中加入以下片断: # gzip …

【微信小程序 | 实战开发】常用的视图容器类组件介绍和使用(1)

个人名片: 🐼作者简介:一名大二在校生,喜欢编程🎋 🐻‍❄️个人主页🥇:小新爱学习. 🐼个人WeChat:hmmwx53 🕊️系列专栏:🖼️ 零基础学Java——小白入门必备重识C语言——复习回顾

component lists rendered with v-for should have explicit keys

component lists rendered with v-for should have explicit keys 发现问题 关键报错 (Emitted value instead of an instance of Error) : component lists rendered with v-for should have explicit keys. See https://vuejs.org/guide/list.html#key for more info. 具体…

VUE之Element-ui文件上传详解

引言 对于文件上传&#xff0c;在开发主要涉及到以下两个方面&#xff1a; 单个文件上传和表单一起实现上传&#xff08;这种情况一般都是文件上传之后&#xff0c;后端返回保存在服务器的文件名&#xff0c;最后和我们的表单一起上传&#xff09; 单文件上传 element-ui中…

Cesium加载离线地图和离线地形

文章目录 前言一、Cesium加载离线地图 1.1 下载数据2.2 数据处理2.3 地图发布2.4下载速度改进 二、Cesium加载离线地形 2.1 下载数据2.2 数据处理2.3 地形发布2.4 遇到的问题 前言 直接把地图数据切片&#xff0c;然后通过nginx以静态服务方式发布。 使用工具&#xff1a;…

this.$emit使用方法【前端技术】

this.$emit()主要用于子组件向父组件传值。 下面就给大家举一个实际开发中使用到的案例。 需求&#xff1a; 点击关联项目&#xff0c;弹出关联项目数据进行选择一条数据&#xff0c;点击确定&#xff0c;项目编号会回显到关联项目中。 1新增页面 2 新增页面中点击关联项目弹出…