string. charat (x)或string[x]?

括号符号现在适用于所有主流浏览器，除了IE7及以下版本。

// Bracket Notation
"Test String1"[6]


// charAt Implementation
"Test String1".charAt(6)

过去使用括号是个坏主意，原因如下(Source):

在IE7中无效。 第一个代码片段将返回 在IE7中未定义。如果你碰巧使用 字符串的括号符号 你的代码，你想要迁移 对于.charAt(pos)，这是一个真正的痛苦: 括号在整个代码中都有使用 而且没有简单的方法来检测是否 这是字符串或 数组/对象。< / p >

不能使用此表示法设置字符。因为没有警告 不管怎样，这都很让人困惑 令人沮丧。如果你在用 .charAt(pos)函数，你不会

从中数:

有两种方法访问字符串中的单个字符。第一个是charAt方法，是ECMAScript 3的一部分:

return 'cat'.charAt(1); // returns "a"

另一种方法是将字符串视为类似数组的对象，其中每个单独的字符对应一个数值索引。自第一个版本以来，大多数浏览器都支持这一功能，除了IE。它在ECMAScript 5中被标准化:

return 'cat'[1]; // returns "a"

第二种方法需要ECMAScript 5支持(一些旧浏览器不支持)。

在这两种情况下，尝试改变单个字符都是行不通的，因为字符串是不可变的，也就是说，它们的属性既不是“可写的”也不是“可配置的”。

• 如果需要IE6/IE7兼容性，str.charAt(i)从兼容性角度更好。
• str[i]更现代，适用于IE8+和所有其他浏览器(所有Edge/Firefox/Chrome, Safari 2+，所有iOS/Android)。

String.charAt()是原始标准，适用于所有浏览器。 在ie8 +和其他浏览器中，您可以使用括号符号来访问字符，但ie7及以下不支持

如果有人真的想在IE 7中使用括号表示法，明智的做法是使用str.split('')将字符串转换为数组，然后将其作为数组使用，与任何浏览器兼容。

var testString = "Hello";
var charArr = testString.split("");
charArr[1]; // "e"

当你测试字符串索引访问器和charAt()方法时，会得到非常有趣的结果。似乎Chrome是唯一一个更喜欢charAt的浏览器。

CharAt vs index 1

ChartAt vs index 2

ChartAt vs index 3

它们在边缘情况下可以给出不同的结果。

'hello'[NaN] // undefined
'hello'.charAt(NaN) // 'h'


'hello'[true] //undefined
'hello'.charAt(true) // 'e'

charAt函数取决于索引如何转换为规范中的Number。

当您试图访问超出边界的索引或不是整数时，这是有区别的。

如果x是0到string.length-1之间的整数，string[x]返回string中x位置的字符，否则返回undefined。

string.charAt(x)使用在这里解释的过程将x转换为整数(如果x是非整数，则返回0，如果parseInt(x)为NaN，则返回0)，然后如果整数在0到string.length-1之间，则返回该位置的字符，否则返回空字符串。

下面是一些例子:

"Hello"[313]    //undefined
"Hello".charAt(313)    //"", 313 is out of bounds


"Hello"[3.14]    //undefined
"Hello".charAt(3.14)    //'l', rounds 3.14 down to 3


"Hello"[true]    //undefined
"Hello".charAt(true)    //'e', converts true to the integer 1


"Hello"["World"]    //undefined
"Hello".charAt("World")    //'H', "World" evaluates to NaN, which gets converted to 0


"Hello"[Infinity]    //undefined
"Hello".charAt(Infinity)    //"", Infinity is out of bounds

另一个区别是赋值给string[x]不做任何事情(这可能会令人困惑)，赋值给string.charAt(x)是一个错误(正如预期的那样):

var str = "Hello";
str[0] = 'Y';
console.log(str);    //Still "Hello", the above assignment did nothing
str.charAt(0) = 'Y';    //Error, invalid left-hand side in assignment

赋值给string[x]不起作用的原因是因为Javascript字符串是不可变的。

使用charAt(index)和string[index]访问字符有什么区别?

注:

• 对于charAt()，在搜索索引之前，index首先尝试被强制输入一个数字。

  • 布尔值是类型强制的。Number(true)的值为1，而Number(false)的值为0。
  • 所有假值返回索引0。
  • 包含单个元素[1]或['1']的数组在强制转换时返回数字。包含多个元素的数组返回NaN，处理按上表进行。
  • 如果index是一个十进制值，例如一个数字、字符串或只有一个元素的数组，则应用Math.floor(Number(index))。

• 对于括号，当提供的索引是一个字符串或包含一个元素的数组时，将尝试类型强制转换。

  • 布尔值不是类型强制的。因此true不会强制转换为1。true或false都返回undefined。
  • 除0外的所有假值，返回undefined。
  • 十进制值返回undefined。
• < p > type falsy = null | undefined | NaN | ''
  • falsy在这里不包括0，因为0是一个有效的Number索引。

let str = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';


/** index > str.length */
console.log({ charAt: str.charAt(27) }); // returns ''
console.log({ brackets: str[27] }); // returns undefined


/** index < 0 */
console.log({ charAt: str.charAt(-2) }); // returns ''
console.log({ brackets: str[-2] }); // returns undefined


/** Falsy Values */


// All falsy values, return character at index 0
console.log({ charAt: str.charAt(NaN) }); // returns 'A'
console.log({ charAt: str.charAt(false) }); // returns 'A'
console.log({ charAt: str.charAt(undefined) }); // returns 'A'
console.log({ charAt: str.charAt(null) }); // returns 'A'
console.log({ charAt: str.charAt('') }); // returns 'A'


// All falsy values except 0, return undefined
console.log({ brackets: str[NaN] }); // returns undefined
console.log({ brackets: str[false] }); // returns undefined
console.log({ brackets: str[undefined] }); // returns undefined
console.log({ brackets: str[null] }); // returns undefined
console.log({ brackets: str[''] }); // returns undefined


/** index = Boolean(true) */
console.log({ charAt: str.charAt(true) }); // returns 'B', (character at index 1)
console.log({ brackets: str[true] }); // undefined


/** Type coercion: Failure */
console.log({ charAt: str.charAt('A1') }); // returns 'A' (character at index 0)
console.log({ brackets: str['ABC'] }); // returns undefined


/** Type coercion: Success */
console.log({ charAt: str.charAt('1') }); // returns 'B' (attempts to access index after type coercion)
console.log({ brackets: str['1'] }); // returns undefined (attempts to access index after type coercion)


/** Decimal Values */
console.log({ charAt: str.charAt(1.9) }); // returns 'B', applies Math.floor(Number(index))
console.log({ charAt: str.charAt('1.9') }); // returns 'B', applies Math.floor(Number(index))
console.log({ charAt: str.charAt(['1.9']) }); // returns 'B', applies Math.floor(Number(index))


console.log({ brackets: str[1.9] }); // returns undefined

在Github上查看我的快速参考