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 相关文章推荐
幻宇的层模拟窗口效果-提供演示和下载
Jan 20 Javascript
javascript计时器事件使用详解
Jan 07 Javascript
javascript匿名函数实例分析
Nov 18 Javascript
json实现前后台的相互传值详解
Jan 05 Javascript
jQuery插件之Tocify动态节点目录菜单生成器附源码下载
Jan 08 Javascript
JavaScript中匿名函数的用法及优缺点详解
Jun 01 Javascript
Jquery组件easyUi实现表单验证示例
Aug 23 Javascript
vue2.0+koa2+mongodb实现注册登录
Apr 10 Javascript
Phaser.js实现简单的跑酷游戏附源码下载
Oct 26 Javascript
React父子组件间的传值的方法
Nov 13 Javascript
JS实现transform实现扇子效果
Jan 17 Javascript
Vue实现菜单切换功能
Nov 08 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+ajax实现无刷新动态加载数据技术
2015/04/28 PHP
PHP生成plist数据的方法
2015/06/16 PHP
PHP图形计数器程序显示网站用户浏览量
2016/07/20 PHP
详解PHP的抽象类和抽象方法以及接口总结
2019/03/15 PHP
ajaxControlToolkit AutoCompleteExtender的用法
2008/10/30 Javascript
javascript+iframe 实现无刷新载入整页的代码
2010/03/17 Javascript
javascript中的=等号个数问题两个跟三个有什么区别
2013/10/23 Javascript
javascript与jquery中跳出循环的区别总结
2013/11/04 Javascript
js中浮点型运算BUG的解决方法说明
2014/01/06 Javascript
Javascript基础教程之函数对象和属性
2015/01/18 Javascript
JSON中key动态设置及JSON.parse和JSON.stringify()的区别
2016/12/29 Javascript
Canvas 绘制粒子动画背景
2017/02/15 Javascript
jQuery 实现双击编辑表格功能
2017/06/19 jQuery
老生常谈javascript的面向对象思想
2017/08/22 Javascript
使用socket.io制做简易WEB聊天室
2018/01/02 Javascript
ES6知识点整理之Proxy的应用实例详解
2019/04/16 Javascript
浅析微信小程序modal弹窗关闭默认会执行cancel问题
2019/10/14 Javascript
JavaScript提升机制Hoisting详解
2019/10/23 Javascript
详解搭建一个vue-cli的移动端H5开发模板
2020/01/17 Javascript
JS中箭头函数与this的写法和理解
2021/01/14 Javascript
[03:55]TI9战队采访——TNC Predator
2019/08/22 DOTA
Flask SQLAlchemy一对一,一对多的使用方法实践
2013/02/10 Python
Python3多线程操作简单示例
2018/05/22 Python
python实现UDP协议下的文件传输
2020/03/20 Python
Python-opencv实现红绿两色识别操作
2020/06/04 Python
深入了解Python装饰器的高级用法
2020/08/13 Python
KIKO MILANO荷兰网上商店:意大利专业化妆品品牌
2017/05/12 全球购物
美国网上眼镜供应商:LEOTONY(眼镜、RX太阳镜和太阳镜)
2017/10/31 全球购物
goodhealth官方海外旗舰店:新西兰国民营养师
2017/12/15 全球购物
歌唱比赛获奖感言
2014/01/21 职场文书
仓管员岗位责任制
2014/02/19 职场文书
小学生元旦感言
2014/02/26 职场文书
三好学生事迹材料
2014/12/24 职场文书
2015年度公共机构节能工作总结
2015/05/26 职场文书
SQL 窗口函数实现高效分页查询的案例分析
2021/05/21 SQL Server
如何利用python创作字符画
2022/06/25 Python