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 相关文章推荐
永不消失的title提示代码
Feb 15 Javascript
Jquery Ajax学习实例4 向WebService发出请求,返回实体对象的异步调用
Mar 16 Javascript
JavaScript中遍历对象的property的3种方法介绍
Dec 30 Javascript
使用js画图之圆、弧、扇形
Jan 12 Javascript
jQuery插件windowScroll实现单屏滚动特效
Jul 14 Javascript
angularJS 指令封装回到顶部示例详解
Jan 22 Javascript
javascript实现table单元格点击展开隐藏效果(实例代码)
Apr 10 Javascript
Bootstrap组件之下拉菜单,多级菜单及按钮布局方法实例
May 25 Javascript
vue获取当前点击的元素并传值的实例
Mar 09 Javascript
JS遍历DOM文档树的方法实例详解
Apr 03 Javascript
深入浅析vue中cross-env的使用
Sep 12 Javascript
Element el-button 按钮组件的使用详解
Feb 01 Javascript
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
《PHP边学边教》(04.编写简易的通讯录――视频教程1)
2006/12/13 PHP
PHP XML操作的各种方法解析(比较详细)
2010/06/17 PHP
解析php 版获取重定向后的地址(代码)
2013/06/26 PHP
php cURL和Rolling cURL并发方式比较
2013/10/30 PHP
thinkPHP实现递归循环栏目并按照树形结构无限极输出的方法
2016/05/19 PHP
用Javascript 获取页面元素的位置的代码
2009/09/25 Javascript
修复ie8&amp;chrome下window的resize事件多次执行
2011/10/20 Javascript
用JQUERY增删元素的代码
2012/02/14 Javascript
jQuery实现div浮动层跟随页面滚动效果
2014/02/11 Javascript
DOM节点的替换或修改函数replaceChild()用法实例
2015/01/12 Javascript
JavaScript中String.match()方法的使用详解
2015/06/06 Javascript
详解JavaScript函数对象
2015/11/15 Javascript
JavaScript 正则表达式中global模式的特性
2016/02/25 Javascript
jqueryMobile 动态添加元素,展示刷新视图的实现方法
2016/05/28 Javascript
实例讲解javascript实现异步图片上传方法
2017/12/05 Javascript
vue-cli+webpack项目 修改项目名称的方法
2018/02/28 Javascript
Vue 中使用vue2-highcharts实现top功能的示例
2018/03/05 Javascript
微信小程序内拖动图片实现移动、放大、旋转的方法
2018/09/04 Javascript
vue中keep-alive组件的入门使用教程
2019/06/06 Javascript
ElementUI 修改默认样式的几种办法(小结)
2020/07/29 Javascript
JS+Canvas实现五子棋游戏
2020/08/26 Javascript
Python中文件遍历的两种方法
2014/06/16 Python
python UNIX_TIMESTAMP时间处理方法分析
2016/04/18 Python
Python数据分析之如何利用pandas查询数据示例代码
2017/09/01 Python
用Python实现筛选文件脚本的方法
2018/10/27 Python
python Gunicorn服务器使用方法详解
2019/07/22 Python
python SVD压缩图像的实现代码
2019/11/05 Python
Python基于requests实现模拟上传文件
2020/04/21 Python
Python:__eq__和__str__函数的使用示例
2020/09/26 Python
python中uuid模块实例浅析
2020/12/29 Python
Python解析m3u8拼接下载mp4视频文件的示例代码
2021/03/03 Python
英国屋顶用品和材料超市:Roofing Supplies UK
2019/08/24 全球购物
报纸媒体创意广告词
2014/03/17 职场文书
乡镇消防安全责任书
2014/07/23 职场文书
总经理助理岗位职责范本
2015/03/31 职场文书
VUE中的v-if与v-show区别介绍
2022/03/13 Vue.js