JS中字符串切割为数组/数组拼接为字符串的代码例子

 更新时间:2023年09月17日 08:36:49   作者:Light rattle  
这篇文章主要给大家介绍了关于JS中字符串切割为数组/数组拼接为字符串的相关资料,数组是JavaScript中最强大的数据结构,我们常常通过将字符串转换为数组来解决许多算法,需要的朋友可以参考下

一、字符串切割为数组

所使用的函数方法:split()

(1)语法格式:

let 数组变量 = 字符串.split(所选分隔符);

其中所选分隔符使用双引号(“”)或者单引号(‘’)括起来;

所生成的数组会存放于前面定义的数组变量中。

(2)样例:

JS代码:

var string = "元素一 元素二 元素三 元素四";
var array = string.split(" ")//使用空格作为分隔符
console.log(array);//打印生成的数组变量

运行结果:

[ '元素一', '元素二', '元素三', '元素四' ]

(3)其他用法:

①当所选分隔符为空时,返回的数组即将每个字符分割出来:

JS代码:

var string = "元素一 元素二 元素三 元素四";
var array = string.split("")//使用空分隔符
console.log(array);//打印生成的数组变量

运行结果:

[
  '元', '素', '一', ' ',
  '元', '素', '二', ' ',
  '元', '素', '三', ' ',
  '元', '素', '四'
]

②分隔符为空,字符串为空,返回空数组:

JS代码:

var string = "";
var array = string.split("")//使用空分隔符
console.log(array);//打印生成的数组变量

运行结果:

[]

③不带分隔符,将返回一个长度为1,内容为字符串自己的数组:

JS代码:

var string = "元素一 元素二 元素三 元素四";
var array = string.split()//不带分隔符
console.log(array);//打印生成的数组变量

运行结果:

[ '元素一 元素二 元素三 元素四' ]

④添加可选参数limit限定切割的长度

string.split(splitter, limit);

使用:

JS代码:

var string = "元素一 元素二 元素三 元素四";
var array = string.split(" ", 3);//带分隔符、限定长度值
console.log(array);//打印生成的数组变量

运行结果:

[ '元素一', '元素二', '元素三' ]

⑤使用正则表达式作为分隔符

使用:

JS代码:

var string = "元素一?元素二!元素三.元素四";
var array = string.split(/[?,!,.]/);//正则分隔符
console.log(array);//打印生成的数组变量

运行结果:

[ '元素一', '元素二', '元素三', '元素四' ]

二、数组拼接为字符串

所使用的函数方法:join()

(1)语法格式:

let 数组变量 = 字符串.join(所选分隔符);

和split语法一样,它会将数组加上所选分隔符后拼接起来

(2)样例:

JS代码:

var array = [ '元素一', '元素二', '元素三', '元素四' ];
var string = array .join(",")//使用空格作为分隔符
console.log(string);//打印生成的字符串

运行结果:

元素一,元素二,元素三,元素四

三、附言

实际上,数组拼接为字符串也有其他办法,但对于我的工作、学习操作并没有更好的帮助,故此处只简单写一点:

1.可以使用for循环遍历并使用加号(+)加起来;

2.使用函数方法toString(),可以将数组连接为字符串,并用逗号(,)连接数组中的各元素;

3.函数方法toLocalString() 方法能够使用用户所在地区特定的分隔符把生成的字符串连接起来,形成一个字符串。

字符串转换为数组也其他办法:

由于字符串可以直接根据索引进行访问,所以可以根据这个原则使用for循环进行遍历切割:

string[num]

总结 

到此这篇关于JS中字符串切割为数组/数组拼接为字符串的文章就介绍到这了,更多相关JS字符串切割为数组内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • 微信小程序后台持续定位功能使用详解

    微信小程序后台持续定位功能使用详解

    这篇文章主要介绍了微信小程序后台持续定位功能使用详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2019-08-08
  • 微信小程序实现渐入渐出动画效果

    微信小程序实现渐入渐出动画效果

    这篇文章主要给大家介绍了关于微信小程序实现渐入渐出动画效果的相关资料,文中通过示例代码介绍的非常详细,对大家学习或者使用微信小程序具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧
    2019-06-06
  • webpack几种手动实现HMR的方式

    webpack几种手动实现HMR的方式

    众所周知,在webpack中使用模块热替换(HMR),能够使得应用在运行时,本文就介绍一下如何实现HMR,感兴趣的可以了解一下
    2021-07-07
  • JavaScript中的"??"和"||" 的实现示例

    JavaScript中的"??"和"||" 的实现示例

    本文主要介绍了JavaScript中的"??"和"||" 的实现示例,??仅处理null/undefined,而||处理所有假值,文中通过示例代码介绍的非常详细,需要的朋友们下面随着小编来一起学习学习吧
    2025-09-09
  • 在DWR中实现直接获取一个JAVA类的返回值的两种方法

    在DWR中实现直接获取一个JAVA类的返回值的两种方法

    本文主要介绍了在DWR中实现直接获取一个JAVA类的返回值的两种方法,具有一定的参考价值,下面跟着小编一起来看下吧
    2016-12-12
  • layui 监听select选择 获取当前select的ID名称方法

    layui 监听select选择 获取当前select的ID名称方法

    今天小编就为大家分享一篇layui 监听select选择 获取当前select的ID名称方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-09-09
  • 基于JavaScript中字符串的match与replace方法(详解)

    基于JavaScript中字符串的match与replace方法(详解)

    下面小编就为大家介绍一下JavaScript中的字符串的match与replace方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2017-12-12
  • 分享十三个最佳JavaScript数据网格库

    分享十三个最佳JavaScript数据网格库

    数据网格可以帮助解决在 HTML 表格上对带有过滤、分页、排序、搜索以及内联编辑这些功能特性的大量数据集的处理问题,需要的朋友可以参考下
    2017-04-04
  • 让浏览器DOM元素最后加载的js方法

    让浏览器DOM元素最后加载的js方法

    让浏览器DOM元素最后加载的方法有很多,本例为大家介绍下,通过js如何实现
    2014-07-07
  • JavaScript字符串执行方法总结

    JavaScript字符串执行方法总结

    这篇文章主要介绍了五种执行字符串中JavaScript代码的方法,并强调了每种方法的安全性和适用场景,推荐根据具体需求和安全性要求选择合适的方法,需要的朋友可以参考下
    2026-01-01

最新评论