字符串转换为数组的方法

1、 使用 .split(' ')

split() 是一种字符串方法,可将字符串拆分为具有模式的有序列表的数组。这是一种 ES6 方法,是完成工作的最干净的方法。

const myFavShow = 'The Office';

const myFavShowArray = myFavShow.split('');

console.log(myFavShowArray) 
//['T', 'h', 'e', ' ', 'O', 'f', 'f', 'i', 'c', 'e']

它也适用于正则表达式,你可以在此处找到 split() 的完整文档。

这种方式完美地将字符串元素分离到一个数组中,但它有其局限性。

注意:此方法不适用于不常见的 Unicode 字符。此方法返回字符的 Unicode 而不是实际字符,这可能会使我们的工作变得更复杂,但 MDN 文档已更新,因此,如果我们仅包含 u 标志,我们就可以使其与 Unicode 一起使用。

"".split(/(?:)/); // [ "\ud83d", "\ude04", "\ud83d", "\ude04" ]
"".split(/(?:)/u); // [ "", "" ]

2、使用扩展语法 ([…str])

这是 ES2015 的特性,它使转换变得非常容易。

const myFavShow = 'The Office'

const myFavShowArray = [...myFavShow]

console.log(myFavShowArray) 
// ['T', 'h', 'e', ' ', 'O', 'f', 'f', 'i', 'c', 'e']

在这里消除了我们在 split() 中的限制也有帮助,考虑下面的例子,我们可以使用这种方法轻松拆分任何字符。

const animal = ''
const animalArr = [...animal]
console.log(animalArr) // ['', '']

3、使用 Array.from(str)

阵列,from() 方法从可迭代或类似数组的对象创建一个新的、浅拷贝的 Array 实例。

这种方法在处理不常见的字符时不会引起任何问题。

const myFavShow = 'The Office'

const myFavShowArray = Array.from(myFavShow);

console.log(myFavShowArray) 
// ['T', 'h', 'e', ' ', 'O', 'f', 'f', 'i', 'c', 'e']


// 不常见的字符
const str = ''
const arr = Array.from(str)
console.log(arr)

// ['', '']

4、使用 Object.assign([ ] ,  str)

assign() 方法将一个或多个源对象的所有属性复制到目标对象。不过,关于这种方法有两点需要记住。一个是那个对象,二是assign() 复制称为深拷贝的属性值,在使用此方法之前,必须牢记这一点。

const myFavShow = 'The Office'

const myFavShowArray = Object.assign([], myFavShow);

console.log(myFavShowArray) 
// ['T', 'h', 'e', ' ', 'O', 'f', 'f', 'i', 'c', 'e']

另一个是我们和 split() 方法有同样的麻烦:它不能分隔不常见的字符(我们看到的是 Unicode 而不是实际的字符)。

const s = ''
const a = Array.from(s)
console.log(a) // ['', '']

5、使用老式方法( for loop 和 array.push( ) )

虽然我们有很多选择可以玩,但我不得不提到这种老式的方法,我们使用 for 循环和数组方法 push() 来推送字符串的元素。

这不是最干净的方式,但绝对值得一提的是想要远离 JavaScript 不断变化的复杂性(尽管我更喜欢其他方式)。

const s = 'the office';
const a = [];
for (const s2 of s) {
   a.push(s2);
}
console.log(a); // ['t', 'h', 'e', ' ', 'o', 'f', 'f', 'i', 'c', 'e']

此外,它对不常见 (Unicode) 字符也能很好地工作。看下面的例子。

const s = '';
const a = [];
for (const s2 of s) {
   a.push(s2);
}
console.log(a); //['', '', '', '', '', '']

6、使用 Array.prototype.slice.call( 'string' )

const favShow = Array.prototype.slice.call("The Office!");
console.log(favShow); 
//['T', 'h', 'e', ' ', 'O', 'f', 'f', 'i', 'c', 'e', '!']

此方法也有与 split() 方法相同的问题,因此在使用时要注意。


const favShow = Array.prototype.slice.call("The Office!");
console.log(favShow); //['\uD83D', '\uDE04', '\uD83D', '\uDE04']

你可能感兴趣的:(js进阶,js基础代码,javascript,开发语言,前端)