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之AJAX框架使用说明
Apr 24 Javascript
Javascript正则控制文本框只能输入整数或浮点数
Sep 02 Javascript
JS跨域问题详解
Nov 25 Javascript
JS的框架Polymer中的dom-if和is属性使用说明
Jul 29 Javascript
JavaScript动态检验密码强度的实现方法
Nov 09 Javascript
vue2.0实战之使用vue-cli搭建项目(2)
Mar 27 Javascript
不使用 JS 匿名函数理由
Nov 17 Javascript
vue实现商城上货组件简易版
Nov 27 Javascript
vue-router跳转时打开新页面的两种方法
Jul 29 Javascript
Vue项目打包部署到iis服务器的配置方法
Oct 14 Javascript
eslint+prettier统一代码风格的实现方法
Jul 22 Javascript
JavaScript使用canvas绘制坐标和线
Apr 28 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
定制404错误页面,并发信给管理员的程序
2006/10/09 PHP
PHP常用数组函数介绍
2014/07/28 PHP
浅谈使用 PHP 进行手机 APP 开发(API 接口开发)
2014/08/11 PHP
javascript上下方向键控制表格行选中并高亮显示的方法
2015/02/13 Javascript
Javascript实现鼠标框选操作  不是点击选取
2016/04/14 Javascript
jQuery判断元素是否显示 是否隐藏的简单实现代码
2016/05/19 Javascript
Jquery中map函数的用法
2016/06/03 Javascript
jQuery实现左侧导航模块的显示与隐藏效果
2016/07/04 Javascript
Vue动态组件实例解析
2017/08/20 Javascript
js 公式编辑器 - 自定义匹配规则 - 带提示下拉框 - 动态获取光标像素坐标
2018/01/04 Javascript
Webpack devServer中的 proxy 实现跨域的解决
2018/06/15 Javascript
Vue+webpack+Element 兼容问题总结(小结)
2018/08/16 Javascript
vue使用rem实现 移动端屏幕适配
2018/09/26 Javascript
React和Vue中监听变量变化的方法
2018/11/14 Javascript
使用layer模态框给新页面传值的方法
2019/09/27 Javascript
使用Typescript和ES模块发布Node模块的方法
2020/05/25 Javascript
jQuery实现朋友圈查看图片
2020/09/11 jQuery
用Python实现一个简单的线程池
2015/04/07 Python
使用Python将Mysql的查询数据导出到文件的方法
2019/02/25 Python
python画图的函数用法以及技巧
2019/06/28 Python
Django如何实现网站注册用户邮箱验证功能
2019/08/14 Python
浅谈keras的深度模型训练过程及结果记录方式
2020/01/24 Python
pandas实现excel中的数据透视表和Vlookup函数功能代码
2020/02/14 Python
python和php学习哪个更有发展
2020/06/17 Python
全面介绍python中很常用的单元测试框架unitest
2020/12/14 Python
python excel和yaml文件的读取封装
2021/01/12 Python
Python实现邮件发送的详细设置方法(遇到问题)
2021/01/18 Python
阿里健康官方海外旗舰店:阿里健康国际自营
2017/11/24 全球购物
英国领先的鞋类零售商和顶级品牌的官方零售商:Wynsors
2020/02/17 全球购物
软件测试有哪些?什么是配置项?
2012/02/12 面试题
面试后感谢信怎么写
2014/02/01 职场文书
办公设备采购方案
2014/03/16 职场文书
副科竞争上岗演讲稿
2014/05/12 职场文书
银行职员工作失误检讨书
2014/10/14 职场文书
图文详解Nginx版本平滑升级方案
2021/09/15 Servers
Python面向对象编程之类的概念
2021/11/01 Python