举例讲解JavaScript中将数组元素转换为字符串的方法


Posted in Javascript onOctober 25, 2015

首先来看一下从一个数组中选择元素的方法slice():
源代码:

<!DOCTYPE html>
<html>
<body>
​
<p id="demo">Click the button to extract the second and the third elements from the array.</p>
​
<button onclick="myFunction()">Try it</button>
​
<script>
function myFunction()
{
var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(1,3);
var x=document.getElementById("demo");
x.innerHTML=citrus;
}
</script>
​
</body>
</html>

测试结果:

Orange,Lemon

我们可以用数组的元素组成字符串,相关的join()方法使用例子:

源代码:

<!DOCTYPE html>
<html>
<body>
​
<p id="demo">Click the button to join the array elements into a string.</p>
​
<button onclick="myFunction()">Try it</button>
​
<script>
function myFunction()
{
var fruits = ["Banana", "Orange", "Apple", "Mango"];
var x=document.getElementById("demo");
x.innerHTML=fruits.join();
}
</script>
​
</body>
</html>

测试结果:

Banana,Orange,Apple,Mango

直接转换数组到字符串则可以用toString()方法:
源代码:

<!DOCTYPE html>
<html>
<body>
​
<p id="demo">点击按钮将数组转为字符串并返回。</p>
​
<button onclick="myFunction()">点我</button>
​
<script>
function myFunction()
{
 var fruits = ["Banana", "Orange", "Apple", "Mango"];
 var str = fruits.toString();
 var x=document.getElementById("demo");
 x.innerHTML= str;
}
</script>
​
</body>
</html>

测试结果:

Banana,Orange,Apple,Mango
Javascript 相关文章推荐
音乐播放用的的几个函数
Sep 07 Javascript
javascript基本语法分析说明
Jun 15 Javascript
轻量级 JS ToolTip提示效果
Jul 20 Javascript
Node.js:Windows7下搭建的Node.js服务(来玩玩服务器端的javascript吧,这可不是前端js插件)
Jun 27 Javascript
JS格式化数字金额用逗号隔开保留两位小数
Oct 18 Javascript
js判断undefined类型,undefined,null, 的区别详细解析
Dec 16 Javascript
js校验表单后提交表单的三种方法总结
Feb 28 Javascript
js数值和和字符串进行转换时可以对不同进制进行操作
Mar 05 Javascript
jquery获取tagName再进行判断
May 29 Javascript
AngularJS基础 ng-href 指令用法
Aug 01 Javascript
Vue底层实现原理总结
Feb 17 Javascript
JQuery省市联动效果实现过程详解
May 08 jQuery
javascript学习笔记整理(概述、变量、数据类型简介)
Oct 25 #Javascript
js实现跨域的几种方法汇总(图片ping、JSONP和CORS)
Oct 25 #Javascript
详解JavaScript编程中的数组结构
Oct 24 #Javascript
向JavaScript的数组中添加元素的方法小结
Oct 24 #Javascript
jQuery实现鼠标经过事件的延时处理效果
Aug 20 #Javascript
使用jquery动态加载Js文件和Css文件
Oct 24 #Javascript
JavaScript中数组的合并以及排序实现示例
Oct 24 #Javascript
You might like
PHP微信开发之根据用户回复关键词\位置返回附近信息
2016/06/24 PHP
[原创]PHP实现字节数Byte转换为KB、MB、GB、TB的方法
2017/08/31 PHP
Laravel框架使用monolog_mysql实现将系统日志信息保存到mysql数据库的方法
2018/08/16 PHP
关于IE7 IE8弹出窗口顶上
2008/12/22 Javascript
Windows系统下Node.js的简单入门教程
2015/06/23 Javascript
javascript精确统计网站访问量实例代码
2015/12/19 Javascript
H5移动端图片压缩上传开发流程
2016/11/09 Javascript
js代码实现下拉菜单【推荐】
2016/12/15 Javascript
Angular.js 4.x中表单Template-Driven Forms详解
2017/04/25 Javascript
AngularJS实现动态添加Option的方法
2017/05/17 Javascript
JS常用的几种数组遍历方式以及性能分析对比实例详解
2018/04/11 Javascript
Angular Excel 导入与导出的实现代码
2019/04/17 Javascript
Vue运用transition实现过渡动画
2019/05/06 Javascript
node-red File读取好保存实例讲解
2019/09/11 Javascript
Node 代理访问的实现
2019/09/19 Javascript
JavaScript检测浏览器是否支持CSS变量代码实例
2020/04/03 Javascript
Vue中函数防抖节流的理解及应用实现
2020/04/24 Javascript
Vue axios 跨域请求无法带上cookie的解决
2020/09/08 Javascript
在Django的form中使用CSS进行设计的方法
2015/07/18 Python
Python 实现简单的shell sed替换功能(实例讲解)
2017/09/29 Python
浅析Python3爬虫登录模拟
2018/02/07 Python
解决Python中pandas读取*.csv文件出现编码问题
2019/07/12 Python
OpenCV+Python--RGB转HSI的实现
2019/11/27 Python
在python中修改.properties文件的操作
2020/04/08 Python
pandas DataFrame 数据选取,修改,切片的实现
2020/04/24 Python
eVitamins日本:在线购买折扣维生素、补品和草药
2019/04/04 全球购物
输入一行文字,找出其中大写字母、小写字母、空格、数字、及其他字符各有多少
2016/04/15 面试题
explicit和implicit的含义
2012/11/15 面试题
应届生保险求职信
2013/11/11 职场文书
家长评语和期望
2014/02/10 职场文书
仓管员岗位责任制
2014/02/19 职场文书
节能环保演讲稿
2014/08/28 职场文书
无房证明范本
2014/09/17 职场文书
2014年纪检工作总结
2014/11/12 职场文书
Python pyecharts绘制条形图详解
2022/04/02 Python
Redis唯一ID生成器的实现
2022/07/07 Redis