IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> JavaScript知识库 -> splice、slice、split、substr、substring、match、replace的区别 -> 正文阅读

[JavaScript知识库]splice、slice、split、substr、substring、match、replace的区别

1、splice()

splice() 方法用于添加删除数组中的元素。

注意:这种方法会改变原始数组。

语法:

array.splice(index,howmany,item1,.....,itemX)

参数解释:?

参数描述
index必需。数组元素的下标,规定从何处添加/删除元素
howmany可选。规定应该删除多少元素
item1, ..., itemX可选。要添加到数组的新元素

实例:

// 往数组里添加元素
let arr = ["a", "b", "c", "d"]
arr.splice(1, 0, "e", "f")
console.log(arr) // ['a', 'e', 'f', 'b', 'c', 'd']
// 删除数组元素并插入新元素
let arr1 = ["a", "b", "c", "d"]
arr1.splice(1, 2, "e", "f")
console.log(arr1) // ['a', 'e', 'f', 'd']
// 删除数组元素
let arr2 = ["a", "b", "c", "d"]
let delArr2 = arr2.splice(2, 1)
console.log('arr2:',arr2, 'delArr2:',delArr2) // arr2: ['a', 'b', 'd'] delArr2: ['c']

2、slice()

slice() 方法可截取数组/字符串中选定的元素。

注意: slice() 方法不会改变原始数组。

语法:

// 数组
array.slice(start, end)
// 字符串
string.slice(start,end)

参数解释:??

参数描述
start可选。规定从何处开始截取。如果是负数,则从数组/字符串尾部开始算起的位置(倒数)
end可选。规定从何处结束截取(不包含该下标元素)。如果是负数, 则从数组/字符串尾部开始算起的位置(倒数)

实例:

/********* 数组 **********/
let arr = ["a", "b", "c", "d"]
// 截取下标为1(包含)到3(不包含)的元素
let sliceArr = arr.slice(1, 3)
console.log("arr:", arr, "sliceArr:", sliceArr) // arr: ['a', 'b', 'c', 'd'] sliceArr: ['b', 'c']
// 截取下标为1及后面的元素
let sliceArr2 = arr.slice(1)
console.log(sliceArr2) // ['b', 'c', 'd']
// 截取最后3个元素
let sliceArr4 = arr.slice(-3)
console.log(sliceArr4) // ['b', 'c', 'd']
// 截取倒数第3(包含)到倒数第1(不包含)的元素
let sliceArr3 = arr.slice(-3, -1)
console.log(sliceArr3) // ['b', 'c']
// 截取倒数第3(包含)到顺数下标为3(不包含)的元素
let sliceArr5 = arr.slice(-3, 3)
console.log(sliceArr5) // ['b', 'c']

/********* 字符串 **********/
let str = "abcdefgh"
// 截取第2(包含)到第4(不包含)的元素
let sliceStr = str.slice(1, 4)
console.log("str:", str, "sliceStr:", sliceStr) // str: abcdefgh sliceStr: bcd
// 截取倒数第3及后面的元素
let sliceStr2 = str.slice(-3)
console.log(sliceStr2) // fgh

3、split()

split() 方法用于把一个字符串分割成字符串数组。

注意:?split() 方法不改变原始字符串。

语法:

string.split(separator,limit)

参数解释:

参数描述
separator可选。字符串或正则表达式,从该参数指定的地方分割 string Object。
limit可选。该参数可指定返回的数组的最大长度。

实例:

let str = "You are my sunshine!"
// 分割每个字符,包括空格
let splitStr = str.split("")
console.log(splitStr) // ['Y', 'o', 'u', ' ', 'a', 'r', 'e', ' ', 'm', 'y', ' ', 's', 'u', 'n', 's', 'h', 'i', 'n', 'e', '!']
// 以空格作为分割符
let splitStr2 = str.split(" ")
console.log(splitStr2) // ['You', 'are', 'my', 'sunshine!']
// 不填参数
let splitStr3 = str.split()
console.log(splitStr3) // ['You are my sunshine!']
// 以一个字符(u)作为分割符
let splitStr4 = str.split("u")
console.log(splitStr4) // ['Yo', ' are my s', 'nshine!']
// 以空格作为分割符,并使用limit参数指定返回的数组长度
let splitStr5 = str.split(" ", 2)
console.log(splitStr5) // ['You', 'are']

4、substr()

substr() 方法可在字符串中抽取从 开始 下标开始的指定数目的字符。

提示: substr() 的参数指定的是子串的开始位置和长度,因此它可以替代 substring() 和 slice() 来使用。

注意: substr() 方法不会改变源字符串。

语法:?

string.substr(start,length)

参数解释:?

参数描述
start必需。要抽取的子串的起始下标。如果是负数,则从字符串的尾部开始算起的位置
length可选。抽取的长度

实例:?

let str = "You are my sunshine!"
// 从字符串第6(下标为5)个位置开始提取
let substrVal = str.substr(5)
console.log(substrVal) // re my sunshine!
// 从字符串第5个位置开始提取8个字符
let substrVal2 = str.substr(4, 8)
console.log(substrVal2) // are my s

5、substring()

substring() 方法用于提取字符串中介于两个指定下标之间的字符。

substring() 方法返回的子串包括 开始 处的字符,但不包括 结束 处的字符。

语法:

string.substring(from, to)

参数解释:?

参数描述
from必需。一个非负的整数,规定要提取的子串的第一个字符在 string Object 中的位置
to可选。一个非负的整数,比要提取的子串的最后一个字符在 string Object 中的位置多 1

实例:

let str = "You are my sunshine!"
// 从第3(下标位2)位开始提取到最后
let substringVal = str.substring(2)
console.log(substringVal) // u are my sunshine!
// 提取下标为4(包含)到下标为10(不包含)的子串
let substringVal2 = str.substring(4, 10)
console.log(substringVal2) // are my

6、match()

match() 方法可在字符串内检索指定的值,或找到一个或多个正则表达式的匹配。

语法:

string.match(regexp)

参数解释:

参数描述
regexp必需。规定要匹配的模式的 RegExp 对象。

实例:??

let str = "You are my sunshine! You are my light!"
// 全局查找字符串 "my"
let matchStr = str.match(/my/g)
console.log(matchStr) // ['my', 'my']

7、replace()

replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串。

语法:

string.replace(searchvalue,newvalue)

参数解释:

参数描述
searchvalue必需。规定子字符串或要替换的模式的 RegExp 对象。
newvalue必需。用于替换的字符串值

实例:

let str = "You are my sunshine! You are my light!"
// 替换字符串中找到的第一个字符"my"为"her"
let replaceStr = str.replace("my", "her")
console.log(replaceStr) // You are her sunshine! You are my light!
// 全局替换"my"为"her"
let replaceStr2 = str.replace(/my/g, "her")
console.log(replaceStr2) // You are her sunshine! You are her light!

感谢您读完本文!如果本文对您有帮助,请点个赞呗,您的点赞是对我最大的支持和认可!

我的公众号:大前端教程,欢迎关注,会定期更新前端知识,希望能帮到您。

  JavaScript知识库 最新文章
ES6的相关知识点
react 函数式组件 & react其他一些总结
Vue基础超详细
前端JS也可以连点成线(Vue中运用 AntVG6)
Vue事件处理的基本使用
Vue后台项目的记录 (一)
前后端分离vue跨域,devServer配置proxy代理
TypeScript
初识vuex
vue项目安装包指令收集
上一篇文章      下一篇文章      查看所有文章
加:2021-10-22 10:51:58  更:2021-10-22 10:53:20 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年12日历 -2024/12/29 19:56:36-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码
数据统计