JavaScript 数组与字符串的相互转换

一、数组转字符串

1、array.join(separator)

可以通过自定义分隔符（如空格等）来分隔数组编变成字符串，默认以逗号分隔

// 数组转换为字符串
var arr3 = [1, 2, 3, 4]
// array.join(separator)
// separator 可选。指定要使用的分隔符。如果省略该参数，则使用逗号作为分隔符。
// join()	把数组的所有元素放入一个字符串 join()可选择分隔符
console.log(arr3.join()) // 1,2,3,4


var arr4 = ['string', 'number', 'symbol', 'boolean', 'null', 'underfind', 'object']
// join()可选择分隔符 逗号分隔 arr4.join() 等价于 arr4.join(',')
console.log(arr4.join()) // string,number,symbol,boolean,null,underfind,object
console.log(arr4.join(',')) // string,number,symbol,boolean,null,underfind,object
// 空格分隔
console.log(arr4.join(' ')) // string number symbol boolean null underfind object
// and 分隔
console.log(arr4.join(' and ')) // string and number and symbol and boolean and null and underfind and object

2、array.toString()

默认以逗号分隔

// 数组转换为字符串
var arr3 = [1, 2, 3, 4]
// array.toString()
// toString()	把数组转换为字符串，并返回结果。（数组的所有值用逗号隔开）
console.log(arr3.toString()) // 1,2,3,4


var arr4 = ['string', 'number', 'symbol', 'boolean', 'null', 'underfind', 'object']
console.log(arr4.toString()) // string,number,symbol,boolean,null,underfind,object

3、String()

JavaScript 全局函数 String() 把对象的值转换为字符串（String() 函数返回与字符串对象的toString()方法值一样）

 // 数组转换为字符串
var arr3 = [1, 2, 3, 4]
var arr4 = ['string', 'number', 'symbol', 'boolean', 'null', 'underfind', 'object']
// String() 函数把对象的值转换为字符串
// String(object)
// object	必需，JavaScript 对象
// String() 函数返回与字符串对象的toString()方法值一样
console.log(String(arr3)) // 1,2,3,4
console.log(String(arr4)) // string,number,symbol,boolean,null,underfind,object

二、字符串转数组

1、string.split(separator,limit)

split() 方法用于把一个字符串分割成字符串数组

// 字符串转换为数组
// string.split(separator,limit)
// separator 可选，字符串或正则表达式，从该参数指定的地方分割 string Object
// limit 可选，该参数可指定返回的数组的最大长度。如果设置了该参数，返回的子串不会多于这个参数指定的数组。如果没有设置该参数，整个字符串都会被分割，不考虑它的长度
var str1 = 'hello world'
console.log(str1.split()) // ['hello world']
console.log(str1.split('')) //  ['h', 'e', 'l', 'l', 'o', ' ', 'w', 'o', 'r', 'l', 'd']
// 以空格分隔
console.log(str1.split(' ')) // ['hello', 'world']
// 以空格分隔，且返回数组长度为 1
console.log(str1.split(' ', 1)) // ['hello']
// 以 l 分隔
console.log(str1.split('l')) // ['he', '', 'o wor', 'd']

2、Array.from(object, mapFunction, thisValue)

from() 方法用于通过拥有 length 属性的对象或可迭代的对象来返回一个数组（字符串、数组的对象属性）

// 字符串转换为数组
var str1 = 'hello the new world'
// Array.from(object, mapFunction, thisValue)
// object	必需，要转换为数组的对象
// mapFunction	可选，数组中每个元素要调用的函数
// thisValue	可选，映射函数(mapFunction)中的 this 对象
console.log(str1.length) // 19
console.log(Array.from(str1)) // ["h", "e", "l", "l", "o", " ", "t", "h", "e", " ", "n", "e", "w", " ", "w", "o", "r", "l", "d"]

3、展开运算符及解构赋值

// 字符串转换为数组
var str1 = 'hello the new world'
// 展开运算符允许在需要多个元素（如数组文字）的地方扩展诸如字符串之类的可迭代对象
console.log([...str1]) // ['h', 'e', 'l', 'l', 'o', ' ', 'w', 'o', 'r', 'l', 'd']
// 解构赋值
// 解构赋值语法可以将数组或可迭代对象中的值解包为不同的变量
var [...str2] = str1
console.log(str2) // ['h', 'e', 'l', 'l', 'o', ' ', 'w', 'o', 'r', 'l', 'd']