如何在字符串上调用Array.prototype.map？对call用法的疑问

直接调用map的问题 #

字符串属于原始类型，本身并没有继承Array的方法，直接调用map会抛出类型错误：

const str = 'MY NAME IS USER';
const result = str.map(c => c); // "Uncaught TypeError: str.map is not a function"
console.log(result);

报错信息：

"Uncaught TypeError: str.map is not a function"

用Array.prototype.map.call操作字符串的原理 #

JavaScript中的call方法能强制改变函数的执行上下文（即this的指向）。Array.prototype.map是一个通用型函数——它并不要求this必须是严格意义上的数组，只要是类数组对象（拥有length属性，且能通过数字索引访问元素）就能正常工作。

而字符串恰好满足类数组的特征：

• 有length属性，对应字符的总数
• 可以通过str[索引]的方式访问对应位置的字符

当执行Array.prototype.map.call(str, 回调函数)时，map函数内部的this会被替换成字符串str，随后map会像遍历数组一样逐个访问字符串的字符，把每个字符和对应的索引传给回调函数，最终返回一个新数组。

拆解示例代码 #

这段代码的作用是提取字符串中只出现一次的字符：

const str = 'MY NAME IS USER';

const x = Array.prototype.map
  .call(str, (c, i) => {
    // 判断当前字符c在i之后的位置不存在，且在i之前的位置也不存在
    if (str.indexOf(c, i + 1) === -1 && str.lastIndexOf(c, i - 1) === -1)
      return c;
  })
  .join(''); // 将map返回的数组拼接成字符串，回调未返回值的位置会是undefined，拼接时自动转为空字符串

console.log(x);

内容的提问来源于stack exchange，提问作者DecPK