如何处理每个文本字母（带基准）

Question

我想提醒一个字符串的每个字母，但我不确定如何做到这一点。

所以，如果我有：

var str = 'This is my string';

我希望能够分别提醒T，h，i，s等。这只是我正在研究的一个想法的开始，但我需要知道如何分别处理每个字母。

我想使用jQuery，并且在考虑字符串的长度后，我可能需要使用split函数。

想法？

Answer 1

如果警报的顺序很重要，请使用：

for (var i = 0; i < str.length; i++) {
  alert(str.charAt(i));
}

如果警报顺序无关紧要，请使用：

var i = str.length;
while (i--) {
  alert(str.charAt(i));
}

Answer 2

这可能不仅仅是解决了。只想为另一个简单的解决方案做出贡献：

var text = 'uololooo';

// With ES6
[...text].forEach(c => console.log(c))

// With the `of` operator
for (const c of text) {
    console.log(c)
}

// With ES5
for (var x = 0, c=''; c = text.charAt(x); x++) { 
    console.log(c); 
}

// ES5 without the for loop:
text.split('').forEach(function(c) {
    console.log(c);
});

Answer 3

纯javascript中的一种可能的解决方案：

for (var x = 0; x < str.length; x++)
{
    var c = str.charAt(x);
    alert(c);
}

Answer 4

如何处理每个文本字母（带基准）

https://jsperf.com/str-for-in-of-foreach-map-2

的

经典，到目前为止最佳效果。如果您计划在性能关键算法中使用它，或者它需要与浏览器版本的最大兼容性，那么您应该使用这个。

for (var i = 0; i < str.length; i++) {
  console.info(str[i]);
}

用于...的

for...of是迭代器的新 ES6 。大多数现代浏览器支持。它在视觉上更具吸引力，并且不太容易打字错误。如果你要在生产应用程序中使用这个，你应该使用像Babel这样的转换器。

let result = '';
for (let letter of str) {
  result += letter;
}

的forEach

功能性方法。 Airbnb approved。这样做的最大缺点是split()，它创建了一个新数组来存储字符串的每个字母。

为什么呢？这强制执行我们的不可变规则。处理纯粹的功能返回值比副作用更容易推理。

// ES6 version.
let result = '';
str.split('').forEach(letter => {
  result += letter;
});

或

var result = '';
str.split('').forEach(function(letter) {
  result += letter;
});

以下是我不喜欢的。

用于...在

与......相比，你得到的是字母索引而不是字母。它的表现非常糟糕。

var result = '';
for (var letterIndex in str) {
  result += str[letterIndex];
}

地图

功能方法，这很好。但是，地图并不意味着用于此。当需要更改数组内的值时应该使用它，但情况并非如此。

// ES6 version.
var result = '';
str.split('').map(letter => {
  result += letter;
});

或

let result = '';
str.split('').map(function(letter) {
  result += letter;
});

Answer 5

大多数（如果不是全部）答案都是错误的，因为只要字符串outside the Unicode BMP (Basic Multilingual Plane)中有字符，它们就会中断。这意味着所有表情符号都将被破坏。

JavaScript对所有字符串使用UTF- 16 Unicode。在UTF-16中，BMP之外的字符由两部分组成，称为＆＃34; Surrogate Pair＆＃34;这里的大多数答案将单独处理这些对的每个部分而不是单个字符。

至少2016年，现代JavaScript中的一种方法是使用新的String iterator。以下是MDN的例子（几乎）：

＆＃13;

var string = 'A\uD835\uDC68B\uD835\uDC69C\uD835\uDC6A';

for (var v of string) {
  alert(v);
}
// "A"
// "\uD835\uDC68"
// "B"
// "\uD835\uDC69"
// "C"
// "\uD835\uDC6A"

＆＃13;

Answer 6

你可以试试这个

var arrValues = 'This is my string'.split('');
// Loop over each value in the array.
$.each(arrValues, function (intIndex, objValue) {
    alert(objValue);
})

Answer 7

当我需要编写短代码或单行代码时，我使用这个“hack”：

'Hello World'.replace(/./g, function (char) {
    alert(char);
    return char; // this is optional 
});

这不会计算换行符，因此可能是好事还是坏事。如果要包含换行符，请将/./替换为/[\S\s]/。您可能会看到的其他单行可能使用.split()

的

library(stringr)
str_trim(str_sub(str_extract(x, ",[^:]*"), 2))
# [1] "Mr."  "Mrs." "Mr."

Answer 8

还有一个解决方案......

var strg= 'This is my string';
for(indx in strg){
  alert(strg[indx]);
}

Answer 9

如果字符串包含unicode字符，最好使用for ... of语句，因为字节大小不同。

for(var c of "tree 木") { console.log(c); }
//"A".length === 3

Answer 10

您现在可以在关键字中使用。

var s = 'Alien'; for (var c in s) alert(s[c]);

Answer 11

你可以得到一个像这样的单个字符的数组

var test = "test string",
    characters = test.split('');

然后使用常规Javascript循环，否则你可以使用jQuery迭代字符串的字符

var test = "test string";

$(test.split('')).each(function (index,character) {
    alert(character);
});

Answer 12

新JS允许：

const str = 'This is my string';
Array.from(str).forEach(alert);

Answer 13

如果你想对角色级别的文本进行转换，并在最后得到转换后的文本，你可以这样做：

var value = "alma";
var new_value = value.split("").map(function(x) { return x+"E" }).join("")

所以步骤：

将字符串拆分为字符数组（列表）
通过仿函数映射每个角色
将生成的字符数组加入到结果字符串

Answer 14

在ES6 / ES2015中，您可以使用iterators遍历字符串，如您所见

Symbol.iterator MDN

var str = 'Hello';
var it = str[Symbol.iterator]();

for (let v of it) {
  console.log(v)
 }
 
//  "H"
//  "e"
//  "l"
//  "l"
//  "o"

这是一种声明式。什么是优势？您不必担心如何访问字符串的每个元素。

Answer 15

简短答案：Array.from(string)将为您提供您可能想要的内容，然后您可以对其进行迭代或其他任何操作，因为它只是一个数组。

好，让我们尝试使用以下字符串：abc|⚫️\n⚪️|‍‍‍。

代码点是：

97
98
99
124
9899, 65039
10
9898, 65039
124
128104, 8205, 128105, 8205, 128103, 8205, 128103

所以有些字符有一个代码点（字节），有些字符有两个或更多，并添加了换行符以进行额外的测试。

所以测试后有两种方法：

每字节字节（每个代码点代码点）
字符组（而不是整个家庭的表情符号）

string = "abc|⚫️\n⚪️|‍‍‍"

console.log({ 'string': string }) // abc|⚫️\n⚪️|‍‍‍
console.log({ 'string.length': string.length }) // 21

for (let i = 0; i < string.length; i += 1) {
  console.log({ 'string[i]': string[i] }) // byte per byte
  console.log({ 'string.charAt(i)': string.charAt(i) }) // byte per byte
}

for (let char of string) {
  console.log({ 'for char of string': char }) // character groups
}

for (let char in string) {
  console.log({ 'for char in string': char }) // index of byte per byte
}

string.replace(/./g, (char) => {
  console.log({ 'string.replace(/./g, ...)': char }) // byte per byte
});

string.replace(/[\S\s]/g, (char) => {
  console.log({ 'string.replace(/[\S\s]/g, ...)': char }) // byte per byte
});

[...string].forEach((char) => {
  console.log({ "[...string].forEach": char }) // character groups
})

string.split('').forEach((char) => {
  console.log({ "string.split('').forEach": char }) // byte per byte
})

Array.from(string).forEach((char) => {
  console.log({ "Array.from(string).forEach": char }) // character groups
})

Array.prototype.map.call(string, (char) => {
  console.log({ "Array.prototype.map.call(string, ...)": char }) // byte per byte
})

var regexp = /(?:[\0-\uD7FF\uE000-\uFFFF]|[\uD800-\uDBFF][\uDC00-\uDFFF]|[\uD800-\uDBFF](?![\uDC00-\uDFFF])|(?:[^\uD800-\uDBFF]|^)[\uDC00-\uDFFF])/g

string.replace(regexp, (char) => {
  console.log({ 'str.replace(regexp, ...)': char }) // character groups
});

Answer 16

您可以像在数组中那样简单地对其进行迭代：

for(var i in txt){
    console.log(txt[i]);
}

Answer 17

在今天的JavaScript中你可以

Array.prototype.map.call('This is my string', (c) => c+c)

显然，c + c表示你想用c做什么。

返回

["TT", "hh", "ii", "ss", " ", "ii", "ss", " ", "mm", "yy", " ", "ss", "tt", "rr", "ii", "nn", "gg"]

Answer 18

这应该在较旧的浏览器中工作，并使用UTF-16字符，如。

这应该是最兼容的解决方案。但是，它的性能不如for循环。

我使用regexpu

生成了正则表达式

var str = 'My String  ';
var regEx = /(?:[\0-\uD7FF\uE000-\uFFFF]|[\uD800-\uDBFF][\uDC00-\uDFFF]|[\uD800-\uDBFF](?![\uDC00-\uDFFF])|(?:[^\uD800-\uDBFF]|^)[\uDC00-\uDFFF])/g


str.replace(regEx, function (char) {
    console.log(char)
});

希望这会有所帮助！

Answer 19

如果你想为每个角色设置动画，你可能需要将它包装在span元素中;

var $demoText = $("#demo-text");
$demoText.html( $demoText.html().replace(/./g, "<span>$&amp;</span>").replace(/\s/g, " "));

我认为这是最好的方法，然后处理跨度。（例如使用TweenMax）

TweenMax.staggerFromTo（$ demoText.find（“span”），0.2，{autoAlpha：0}，{autoAlpha：1}，0.1）;

Answer 20

您现在可以使用String.prototype[@@iterator]遍历字符串中包含的各个Unicode代码点，这将返回众所周知的Symbol类型Symbol.iterator的值-类似于数组的对象（{{ 1}}）。

示例代码：

String

这与Unicode字符（如表情符号或非罗马字符）一起使用会破坏传统结构。

参考：MDN Link to String.prototype@@iterator。

Answer 21

试试此代码

Type x() const;

Answer 22

str.charAt(index)或str[index]可以access single characters。但后一种方式不是ECMAScript的一部分，所以你最好选择前者。

如何使用Javascript处理每个文本字母？

22 个答案:

如何处理每个文本字母（带基准）

的

用于...的

的forEach

用于...在

地图