如何将字符串拆分为字符数组?

178
var s = "overpopulation";
var ar = [];
ar = s.split();
alert(ar);
我想把一个单词拆分成字符数组。
上面的代码似乎不起作用——它将“overpopulation”作为对象返回。
如果原始字符串不包含逗号和空格,如何将其拆分为字符数组?

1
ar是一个数组变量,但alert()需要字符串变量。 :) - user979431
这里有一个简单的可能解决方案:JavaScript函数读取字符串中的每个字符 - ARJUN
8个回答

281

你可以使用空字符串进行拆分:

var chars = "overpopulation".split('');
如果您只想以类似数组的方式访问字符串,可以在不使用 split 的情况下实现:
var s = "overpopulation";
for (var i = 0; i < s.length; i++) {
    console.log(s.charAt(i));
}
你也可以使用普通数组语法通过索引访问每个字符。但请注意,字符串是不可变的,这意味着你不能使用此方法来设置字符的值,并且IE7不支持该方法(如果对你仍然有影响的话)。
var s = "overpopulation";

console.log(s[3]); // logs 'r'

3
你也可以像访问数组一样访问字符串中的字符,例如: mystr = "apples"; mystr[0]; // a - Brian FitzGerald
9
这并不适用于表情符号。 "".length #=> 1 "".chars #=> [""] - Murhaf Sousli
4
不考虑宽字符。 - user3751385
这将无法处理像这样的字符串:"⬆️⬆️⬇️⬇️⬅️➡️⬅️➡️️️"。但是,"[..."⬆️⬆️⬇️⬇️⬅️➡️⬅️➡️️️"]"和 "Array.from("⬆️⬆️⬇️⬇️⬅️➡️⬅️➡️️️")" 也无法正确地处理此字符串。要正确处理此字符串,您需要使用像这个库一样的库:https://www.npmjs.com/package/grapheme-splitter。 - Jonathan Leitschuh

182

虽然这个问题已经老了,但我还是要警告一下:

不要使用.split('')

对于非BMP字符集(非基本多文种平面)的结果可能会很奇怪。

原因是像.split().charCodeAt()这样的方法只识别代码点低于65536的字符,因为高代码点由一对(较低值的)"替代字符"伪字符表示。

''.length     // —> 6
''.split('')  // —> ["�", "�", "�", "�", "�", "�"]

''.length      // —> 2
''.split('')   // —> ["�", "�"]

尽可能使用ES2015(ES6)功能:

使用扩展运算符

let arr = [...str];

或者 Array.from

let arr = Array.from(str);

或者使用带有新的u RegExp标志的split

let arr = str.split(/(?!$)/u);

例子:

[...'']        // —> ["", "", ""]
[...'']     // —> ["", "", ""]

对于ES5,选项有限:

我想出了这个函数,它在内部使用MDN示例来获取每个字符的正确代码点。

function stringToArray() {
  var i = 0,
    arr = [],
    codePoint;
  while (!isNaN(codePoint = knownCharCodeAt(str, i))) {
    arr.push(String.fromCodePoint(codePoint));
    i++;
  }
  return arr;
}

这需要使用knownCharCodeAt()函数,且对于某些浏览器,需要使用String.fromCodePoint()的填充。

if (!String.fromCodePoint) {
// ES6 Unicode Shims 0.1 , © 2012 Steven Levithan , MIT License
    String.fromCodePoint = function fromCodePoint () {
        var chars = [], point, offset, units, i;
        for (i = 0; i < arguments.length; ++i) {
            point = arguments[i];
            offset = point - 0x10000;
            units = point > 0xFFFF ? [0xD800 + (offset >> 10), 0xDC00 + (offset & 0x3FF)] : [point];
            chars.push(String.fromCharCode.apply(null, units));
        }
        return chars.join("");
    }
}

示例:

stringToArray('')     // —> ["", "", ""]
stringToArray('')  // —> ["", "", ""]

注意:在ES5中,str[index]str.charAt(index)也会在使用非BMP字符集时返回奇怪的结果。例如:'' . charAt(0)将返回"�"

更新:阅读这篇关于JS和Unicode的好文章


1
感谢您教我如何使我的正则表达式支持表情符号,直到现在我都不知道我需要这个功能。 - woojoo666
1
这应该是被接受的答案。 - joshden
如果您想使用ES6但要在' '处拆分单词,而不是每个字符怎么办? - Alfa Bravo
@AlfaBravo 一样。 - NEOJPK
1
请注意,此解决方案会拆分一些表情符号(如️‍),并将组合变音符号与字符分开。 - Jigar

26

.split('') 可以将表情符号一分为二。

Onur的解决方案 适用于某些表情符号,但无法处理更复杂的语言或组合表情符号。

考虑这个表情被破坏了:

[..."️‍"] // returns ["", "️", "‍", ""]  instead of ["️‍"]

还要考虑这个印地文本अनुच्छेद,它被分成了这样:

[..."अनुच्छेद"]  // returns   ["अ", "न", "ु", "च", "्", "छ", "े", "द"]

但实际上应该像这样拆分:

["अ","नु","च्","छे","द"]

这是因为一些字符是组合符号(类似于欧洲语言中的变音符号/重音符号)。

您可以使用grapheme-splitter库来解决这个问题:

它可以在所有数百种奇特的边缘情况下进行正确的基于标准的字母拆分-是的,有那么多种情况。


["अ", "न", "ु", "च", "्", "छ", "े", "द"]在印地语中的意思正确吗?它是正确的分割。 - rajkanani

20

这就像是:

s.split("");
分隔符是一个空字符串,因此它会在每个单个字符之间进行分割。

2
仅返回翻译的文本:不考虑宽字符。 - user3751385

11

在JavaScript中,split()方法接受两个参数:分隔符和限制。分隔符指定用于分割字符串的字符。如果您没有指定分隔符,则返回整个字符串,未分隔。但是,如果将空字符串指定为分隔符,则字符串在每个字符之间拆分。

因此:

s.split('')

这将产生你所寻求的效果。

更多信息请 查看此处


7

Javascript中的字符串已经是一个字符数组。

您可以像访问其他数组一样轻松访问数组中的任何字符。

var s = "overpopulation";
alert(s[0]) // alerts o.

更新

如下面的评论所指出,上述访问字符串中字符的方法是 ECMAScript 5 的一部分,某些浏览器可能不符合该标准。

您可以使用另一种方法 charAt(index)

var s = "overpopulation";
    alert(s.charAt(0)) // alerts o.

2
这在所有浏览器中都不起作用(某些版本的IE除外:https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String#section_5)。 - Felix Kling
谢谢Felix。我已经更新了我的答案,包括在ECMAScript 5之前定义的charAt。 - Jamie Dixon

6
为支持表情符号,请使用以下代码:

</ p>

('Dragon ').split(/(?!$)/u);

=> ['D', 'r', 'a', 'g', 'o', 'n', ' ', '']


它会在 'Flag ️‍'.split(/(?!$)/u) 处中断 => ['F', 'l', 'a', 'g', ' ', '', '️', '‍', ''] - Shiva

5
你可以使用正则表达式/(?!$)/
"overpopulation".split(/(?!$)/)

负向前瞻断言(?!$)将匹配在每个字符的前面。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接