JS字符串转换为数组的4 个方法示例小结

JS字符串转换为数组的4 个方法

1、split() 方法

const text = "abc"; const chars = text.split(''); console.log(chars); //['a', 'b', 'c']

该split方法无法正确处理采用两个代码单元（如表情符号）的字符。下面是一个例子。

const text = "abc????"; const chars = text.split(''); console.log(chars); //(7) ['a', 'b', 'c', '?', '?', '?', '?']

2、展开运算符

展开运算符 ( …) 允许在需要多个元素（如数组文字）的地方扩展诸如字符串之类的可迭代对象。

这是将字符串扩展为字符数组的示例。正确处理采用两个代码单元的字符。

const text = "abc????"; const chars = [ ...text ]; console.log(chars); //(7) ['a', 'b', 'c', '?', '?', '?', '?']

3、解构赋值

const text = "abc????"; const [ ...chars ] = text; console.log(chars); //(7) ['a', 'b', 'c', '?', '?', '?', '?']

4、Array.from

Array.from辅助创建从阵列状或迭代的对象的新数组。字符串既可迭代又类似于数组，因此，可以成功地将其转换为字符数组。

const text = "abc????"; const chars = Array.from(text); console.log(chars); //(7) ['a', 'b', 'c', '?', '?', '?', '?']

重点说明

该split方法可能是将字符串转换为字符数组的常用方法，但它不处理采用两个代码单元的字符。

我们可以使用对象字面量中的扩展运算符、使用数组解构赋值语法中的剩余模式或Array.from实用程序将字符串正确转换为字符数组。

补充：

JS中字符串和数组的相互转换

一、字符串转数组的四种方法

一、字符串.split(' ')

在这里插入图片描述

二、es6的新方法：`Object.values(str);`

三.Array.from(str)

在这里插入图片描述

四.es6中的扩展运算符（...）

二、数组转成字符串

数组方法	说明
toString()	将数组转换成一个字符串
toLocaleString()	把数组转换成本地约定的字符串
join()	将数组元素连接起来以构建一个字符串

将数组元素连接起来以构建一个字符串

一、 tostring()方法

数组中 toString() 方法能够把每个元素转换为字符串，然后以逗号连接输出显示。

var a = [1,2,3,4,5,6,7,8,9,0]; //定义数组 var s = a.toString(); //把数组转换为字符串 console.log(s); //返回字符串“1,2,3,4,5,6,7,8,9,0” console.log(typeof s); //返回字符串string，说明是字符串类型

二 toLocaleString() 方法读取数组的值。

toLocaleString() 方法与 toString() 方法用法基本相同，主要区别在于 toLocalString() 方法能够使用用户所在地区特定的分隔符把生成的字符串连接起来，形成一个字符串。

var a = [1,2,3,4,5]; //定义数组 var s = a.toLocaleString(); //把数组转换为本地字符串 console.log(s); //返回字符串“1,2,3,4,5,6,7,8,9,0” //在上面示例中，toLocaleString() 方法根据中国的使用习惯， //先把数字转换为浮点数之后再执行字符串转换操作。

三、join()方法

下面使用 join() 方法可以把数组转换为字符串。

join() 方法可以把数组转换为字符串，不过它可以指定分隔符。在调用 join() 方法时，可以传递一个参数作为分隔符来连接每个元素。如果省略参数，默认使用逗号作为分隔符，这时与 toString() 方法转换操作效果相同。

var a = [1,2,3,4,5]; //定义数组 var s = a.join("=="); //指定分隔符 console.log(s); //返回字符串“1==2==3==4==5”

三、JSON对象/数组与JSON字符串之间的相互转换

一、JSON.stringify()

JSON.stringify({}); // '{}' JSON.stringify(true); // 'true' JSON.stringify("foo"); // '"foo"' JSON.stringify([1, "false", false]); // '[1,"false",false]' JSON.stringify({ x: 5 }); // '{"x":5}' JSON.stringify({x: 5, y: 6}); // "{"x":5,"y":6}"

二，JSON.parse()

JSON.parse('{}'); // {} JSON.parse('true'); // true JSON.parse('"foo"'); // "foo" JSON.parse('[1, 5, "false"]'); // [1, 5, "false"] JSON.parse('null'); // null

到此这篇关于JS字符串转换为数组的4 个方法的文章就介绍到这了,更多相关js字符串转换数组内容请搜索本网站以前的文章或继续浏览下面的相关文章希望大家以后多多支持本网站！

您可能感兴趣的文章:

JavaScript将坐标字符串转为数组的项目实践
JS实现数组浅拷贝和深拷贝的方法
javascript实现数组扁平化六种技巧总结
JavaScript常考手写题之柯里化与数组扁平化的实现
JS中splice添加或删除数组元素
javascript中如何快速获取数组最后一个值

JS字符串转换为数组的4 个方法示例小结

目录