JavaScript中join()、splice()、slice()和split()函数用法示例


Posted in Javascript onAugust 24, 2018

本文实例讲述了JavaScript中join()、splice()、slice()和split()函数用法。分享给大家供大家参考,具体如下:

join()

join() 方法用于把数组中的所有元素放入一个字符串。

元素是通过指定的分隔符进行分隔的。

<script type="text/javascript">
var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
document.write(
arr.join()
)
</script>

运行结果:

George,John,Thomas

<script type="text/javascript">
var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
document.write(
arr.join(".")
)
</script>

运行结果:

George.John.Thomas

split()

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

<script type="text/javascript">
var str="How are you doing today?"
document.write(str.split(" ") + "<br />")
document.write(str.split("") + "<br />")
document.write(str.split(" ",3))
</script>

运行结果:

How,are,you,doing,today?
H,o,w, ,a,r,e, ,y,o,u, ,d,o,i,n,g, ,t,o,d,a,y,?
How,are,you

"2:3:4:5".split(":") //将返回["2", "3", "4", "5"]
"|a|b|c".split("|") //将返回["", "a", "b", "c"]
"hello".split("") //可返回 ["h", "e", "l", "l", "o"]
"hello".split("", 3) //可返回 ["h", "e", "l"]

slice()

slice() 方法可从已有的数组中返回选定的元素。

<script type="text/javascript">
var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
document.write(arr + "<br />")
document.write(
arr.slice(1)
 + "<br />")
document.write(arr)
</script>

运行结果:

George,John,Thomas
John,Thomas
George,John,Thomas

<script type="text/javascript">
var arr = new Array(6)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
arr[3] = "James"
arr[4] = "Adrew"
arr[5] = "Martin"
document.write(arr + "<br />")
document.write(
arr.slice(2,4)
 + "<br />")
document.write(arr)
</script>

运行结果:

George,John,Thomas,James,Adrew,Martin
Thomas,James
George,John,Thomas,James,Adrew,Martin

splice()

splice() 方法向/从数组中添加/删除项目,然后返回被删除的项目。

注释:该方法会改变原始数组。

<script type="text/javascript">
var arr = new Array(6)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
arr[3] = "James"
arr[4] = "Adrew"
arr[5] = "Martin"
document.write(arr + "<br />")
arr.splice(2,0,"William")
document.write(arr + "<br />")
</script>

运行结果:

George,John,Thomas,James,Adrew,Martin
George,John,William,Thomas,James,Adrew,Martin

<script type="text/javascript">
var arr = new Array(6)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
arr[3] = "James"
arr[4] = "Adrew"
arr[5] = "Martin"
document.write(arr + "<br />")
arr.splice(2,1,"William")
document.write(arr)
</script>

运行结果:

George,John,Thomas,James,Adrew,Martin
George,John,William,James,Adrew,Martin

<script type="text/javascript">
var arr = new Array(6)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
arr[3] = "James"
arr[4] = "Adrew"
arr[5] = "Martin"
document.write(arr + "<br />")
arr.splice(2,3,"William")
document.write(arr)
</script>

运行结果:

George,John,Thomas,James,Adrew,Martin
George,John,William,Martin

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试运行一下文中所述代码。

更多关于JavaScript相关内容可查看本站专题:《JavaScript常用函数技巧汇总》、《JavaScript字符与字符串操作技巧总结》、《javascript面向对象入门教程》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》及《JavaScript数组操作技巧总结》

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
javascript 跳转代码集合
Dec 03 Javascript
js正则表达式的使用详解
Jul 09 Javascript
浅谈Jquery核心函数
Jun 18 Javascript
想学习javascript JS和jQuery哪个重要 先学哪个
Dec 11 Javascript
jQuery EasyUI 为Combo,Combobox添加清除值功能的实例
Apr 13 jQuery
JavaScript调试之console.log调试的一个小技巧分享
Aug 07 Javascript
微信小程序录音与播放录音功能
Dec 25 Javascript
bmob js-sdk 在vue中的使用教程
Jan 21 Javascript
vue element-ui 绑定@keyup事件无效的解决方法
Mar 09 Javascript
vue里的data要用return返回的原因浅析
May 28 Javascript
微信小程序sessionid不一致问题解决
Aug 30 Javascript
详解Vue的mixin策略
Nov 19 Vue.js
vue 中引用gojs绘制E-R图的方法示例
Aug 24 #Javascript
解决webpack dev-server不能匹配post请求的问题
Aug 24 #Javascript
vue2中,根据list的id进入对应的详情页并修改title方法
Aug 24 #Javascript
Nuxt.js实现校验访问浏览器类型的中间件
Aug 24 #Javascript
vue中使用gojs/jointjs的示例代码
Aug 24 #Javascript
vue操作下拉选择器获取选择的数据的id方法
Aug 24 #Javascript
浅谈Vue组件及组件的注册方法
Aug 24 #Javascript
You might like
eWebEditor v3.8 商业完整版 (PHP)
2006/12/06 PHP
javascript 读取XML数据,在页面中展现、编辑、保存的实现
2009/10/27 Javascript
javascript eval和JSON之间的联系
2009/12/31 Javascript
如何确保JavaScript的执行顺序 之实战篇
2011/03/03 Javascript
javascript数组的使用
2013/03/28 Javascript
js取两个数组的交集|差集|并集|补集|去重示例代码
2013/08/07 Javascript
jquery选择器之内容过滤选择器详解
2014/01/27 Javascript
深入理解JavaScript系列(47):对象创建模式(上篇)
2015/03/04 Javascript
JS判断是否长按某一键的方法
2016/03/02 Javascript
JavaScript如何实现图片懒加载(lazyload) 提高用户体验(增强版)
2016/11/30 Javascript
纯原生js实现贪吃蛇游戏
2020/04/16 Javascript
JavaScript中offsetWidth的bug及解决方法
2017/05/17 Javascript
JavaScript+CSS相册特效实例代码
2017/09/07 Javascript
360提示[高危]使用存在漏洞的JQuery版本的解决方法
2017/10/27 jQuery
vue实现微信获取用户信息的方法
2019/03/21 Javascript
基于canvasJS在PHP中制作动态图表
2020/05/30 Javascript
详解三种方式在React中解决绑定this的作用域问题并传参
2020/08/18 Javascript
[01:23:24]DOTA2-DPC中国联赛 正赛 PSG.LGD vs Elephant BO3 第三场 2月7日
2021/03/11 DOTA
pyside写ui界面入门示例
2014/01/22 Python
学习Python3 Dlib19.7进行人脸面部识别
2018/01/24 Python
python爬虫URL重试机制的实现方法(python2.7以及python3.5)
2018/12/18 Python
Gauss-Seidel迭代算法的Python实现详解
2019/06/29 Python
flask框架jinja2模板与模板继承实例分析
2019/08/01 Python
使用Python将xmind脑图转成excel用例的实现代码(一)
2020/10/12 Python
css3 media 响应式布局的简单实例
2016/08/03 HTML / CSS
英语专业个人求职信范文
2014/02/01 职场文书
高三毕业寄语
2014/04/10 职场文书
团队队名口号大全
2014/06/06 职场文书
关于青春的演讲稿三分钟
2014/08/22 职场文书
十一国庆节“向国旗敬礼”主题班会活动方案
2014/09/27 职场文书
先进个人评语大全
2015/01/04 职场文书
给医院的感谢信
2015/01/21 职场文书
颐和园的导游词
2015/01/30 职场文书
2016教师节感恩话语
2015/12/09 职场文书
Sleuth+logback 设置traceid 及自定义信息方式
2021/07/26 Java/Android
Go并发4种方法简明讲解
2022/04/06 Golang