学会这七种方式,轻松应对笔试中的字符串反转

方法一:使用split()、split()、join()

这种方法使用了字符串的 split() 方法将字符串拆分成单个字符的数组,然后使用 split() 方法反转数组的顺序,最后使用 join() 方法将字符重新连接成字符串。

代码实现:

javascript 复制代码
function reverseString(str) {
     return str.split('').reverse().join('');
}

测试:

javascript 复制代码
console.log(reverseString('hello')); // olleh

步骤讲解:

  • str.split(''):将输入字符串 str 使用 split('') 方法拆分为字符数组。该方法将字符串拆分成单个字符的数组。例如,如果 str 是 "hello",这一步将生成数组 ['h', 'e', 'l', 'l', 'o']

  • .reverse():在将字符串拆分为字符数组后,对该数组使用 reverse() 方法。这个方法将数组的元素顺序进行反转。例如,如果数组是 ['h', 'e', 'l', 'l', 'o']reverse() 方法后的结果就是 ['o', 'l', 'l', 'e', 'h']

  • .join(''):最后,对反转后的数组使用 join('') 方法。这个方法将数组中的字符重新连接成一个字符串,没有任何字符分隔。换句话说,它将数组中的字符拼接起来。所以,在这个例子中,它将 ['o', 'l', 'l', 'e', 'h'] 连接成字符串 "olleh",这就是输入字符串的反转结果。

这个 reverseString 函数接受一个字符串作为参数,将其拆分为字符数组,反转数组元素的顺序,然后将其重新连接成一个反转后的字符串,并将其作为函数的返回值。

方法二:使用展开运算符和数组方法

这种方法使用了展开运算符 [...] 来将输入的字符串转换成字符数组,然后再对数组使用 reverse() 方法进行元素顺序的反转,最后使用 join('') 方法将字符重新连接成字符串。

代码实现:

javascript 复制代码
function reverseString(str) {
     return [...str].reverse().join('');
}

测试:

javascript 复制代码
console.log(reverseString('hello')); // olleh

步骤讲解:

  • return [...str]:这部分代码使用展开运算符 [...] 将输入字符串 str 转换为字符数组。它通过将字符串拆分为单个字符并创建一个数组来实现这一点。

  • .reverse():在将字符串转换为字符数组后,对该数组使用 reverse() 方法。这个方法将数组的元素顺序进行反转。例如,如果数组是 ['h', 'e', 'l', 'l', 'o']reverse() 方法后的结果就是 ['o', 'l', 'l', 'e', 'h']

  • .join(''):最后,对反转后的数组使用 join('') 方法。这个方法将数组中的字符重新连接成一个字符串,没有任何字符分隔。换句话说,它将数组中的字符拼接起来。所以,在这个例子中,它将 ['o', 'l', 'l', 'e', 'h'] 连接成字符串 "olleh",这就是输入字符串的反转结果。

这个 reverseString 函数接受一个字符串作为参数,使用展开运算符将其转换为字符数组,然后反转数组元素的顺序,并将其重新连接成一个反转后的字符串,并将其作为函数的返回值。

方法三:使用 for...of 循环

这种方法使用了 for...of 循环来迭代输入字符串的每个字符,并通过每次将当前字符添加到结果字符串的开头来构建反转后的字符串。

代码实现:

javascript 复制代码
function reverseString(str) {
     let reversed = '';
     for (let character of str) {
       reversed = character + reversed;
     }
     return reversed;
}

测试:

javascript 复制代码
console.log(reverseString('hello')); // olleh

步骤讲解:

  • let reversed = '';:这一行初始化了一个空字符串 reversed。这个变量将被用于存储输入字符串的反转版本。

  • for (let character of str) { ... }:这是一个 for...of 循环,它遍历输入字符串 str 中的每个字符。它逐个遍历字符串中的字符。

  • reversed = character + reversed;:在循环内部,当前字符(即来自 str 的单个字符)被连接到结果字符串的开 头。这有效地以相反的顺序构建了反转的字符串。例如,如果输入字符串是 "Hello",循环首先将 "o" 添加到 reversed,然后是 "lo",依此类推,直到整个字符串被反转。

循环会一直执行,直到它处理完输入字符串中的所有字符。

最终,在循环完成后,reversed 字符串包含输入字符串的反转版本,并使用 return reversed; 将反转后的字符串作为函数的结果返回。

方法四:使用逆序循环索引

这种方法使用一个 for 循环,从输入字符串的最后一个字符开始,通过逆序索引遍历字符串,并将每个字符依次添加到结果字符串中。

代码实现:

javascript 复制代码
function reverseString(str) {
     let reversed = '';
     for (let i = str.length - 1; i >= 0; i--) {
       reversed += str[i];
     }
     return reversed;
}

测试:

javascript 复制代码
console.log(reverseString('hello')); // olleh

步骤讲解:

  • let reversed = '';:这一行初始化了一个空字符串 reversed。这个变量将被用于存储输入字符串的反转版本。

  • for (let i = str.length - 1; i >= 0; i--) { ... }:这是一个 for 循环,从输入字符串 str 的最后一个字符开始,逐个字符进行迭代。循环的索引 i 从字符串长度减一开始,一直减小到 0。

  • reversed += str[i];:在循环内部,这行代码将字符串 str 中当前索引 i 处的字符附加到 reversed 字符串中。这实际上是将输入字符串的字符顺序进行了反转。循环从字符串的末尾开始,逐渐构建反转的字符串。

循环会一直执行,直到它处理完输入字符串中的所有字符。

最终,在循环完成后,reversed 字符串包含输入字符串的反转版本,并使用 return reversed; 将反转后的字符串作为函数的结果返回。

方法五:使用 forEach() 方法

这种方法使用了 split('') 方法将字符串转换为字符数组,并使用 forEach() 方法迭代数组中的每个字符,并在每次迭代中将当前字符添加到结果字符串的开头。

代码实现:

javascript 复制代码
function reverseString(str) {
     let reversed = '';
     str.split('').forEach(character => reversed = character + reversed);
     return reversed;
}

测试:

javascript 复制代码
console.log(reverseString('hello')); // olleh

步骤讲解:

  • let reversed = '';:这一行初始化了一个空字符串 reversed。这个变量将被用于存储输入字符串的反转版本。

  • str.split(''):这部分代码使用 split('') 方法将输入字符串 str 转换为字符数组。它通过将字符串拆分为单个字符并创建一个数组来实现这一点。

  • forEach(character => reversed = character + reversed);:这行代码使用 forEach() 方法迭代数组中的每个字符,并在每次迭代中将当前字符添加到结果字符串的开头。通过这种方式,它逆转了字符的顺序。例如,如果输入字符串是 "hello",forEach() 循环将按以下顺序构建 reversed 字符串:

    • 第一次迭代:'h' + '' => 'h'
    • 第二次迭代:'e' + 'h' => 'eh'
    • 第三次迭代:'l' + 'eh' => 'leh'
    • 第四次迭代:'l' + 'leh' => 'lleh'
    • 第五次迭代:'o' + 'lleh' => 'olleh'

最终,在循环完成后,reversed 字符串包含输入字符串的反转版本,并使用 return reversed; 将反转后的字符串作为函数的结果返回。

方法六:使用 split('')、map() 方法

这种方法使用了 split('') 方法将字符串转换为字符数组,并使用 map() 方法迭代数组中的每个字符,并在每次迭代中将当前字符添加到结果字符串的开头。

代码实现:

javascript 复制代码
function reverseString(str) {
     let reversed = "";
     str.split("").map((character) => (reversed = character + reversed));
     return reversed;
}

测试:

javascript 复制代码
console.log(reverseString('hello')); // olleh

步骤讲解:

  • let reversed = '';:这一行初始化了一个空字符串 reversed。这个变量将被用于存储输入字符串的反转版本。

  • str.split(''):这部分代码使用 split('') 方法将输入字符串 str 转换为字符数组。它通过将字符串拆分为单个字符并创建一个数组来实现这一点。

  • .map((character) => (reversed = character + reversed));:这行代码使用 map() 方法迭代数组中的每个字符,并在每次迭代中将当前字符添加到结果字符串的开头。通过这种方式,它逆转了字符的顺序。例如,如果输入字符串是 "hello",map() 循环将按以下顺序构建 reversed 字符串:

    • 第一次迭代:'h' + '' => 'h'
    • 第二次迭代:'e' + 'h' => 'eh'
    • 第三次迭代:'l' + 'eh' => 'leh'
    • 第四次迭代:'l' + 'leh' => 'lleh'
    • 第五次迭代:'o' + 'lleh' => 'olleh'

最终,在循环完成后,reversed 字符串包含输入字符串的反转

方法七:使用split('')、.reduce()

javascript 复制代码
function reverseString(str) {
    return str.split('').reduce((reversed, character) => character + reversed, '');
}

测试:

arduino 复制代码
console.log(reverseString('hello')); // olleh

步骤讲解:

  1. str.split(''):此行获取输入字符串str并使用该split方法将其拆分为单个字符的数组。该参数''用作分隔符,这意味着字符串中的每个字符将成为结果数组中的单独元素。例如,如果str"hello,"结果将是['h', 'e', 'l', 'l', 'o']
  2. .reduce((reversed, character) => character + reversed, ''):将字符串分割成字符数组后,reduce在数组上调用该方法。该reduce方法用于迭代数组并根据数组中的元素累加单个值。
  3. (reversed, character) => character + reversed:这是一个箭头函数,用作reduce的回调函数。它需要两个参数:reversedcharacterreversed是累积值,以空字符串开头(''),并且character是数组中正在处理的当前字符。
  4. character + reversed:在 的每次迭代中reduce,此表达式将当前字符 ( character) 与累积的反转字符串 ( reversed) 连接起来。添加character到现有字符串的前面reversed。这有效地构建了输入字符串的反转版本。
  5. 运算结果reduce是反转后的字符串,由 r 函数返回everseString
  6. 因此,当您调用 时reverseString("hello"),它将字符串拆分为字符数组 ( ['h', 'e', 'l', 'l', 'o']),然后使用reduce反转这些字符的顺序,得到字符串"olleh"

总结

  • split()方法通过将字符串分隔为子字符串,使用指定的分隔符字符串来确定每次拆分的位置,从而将 String 对象拆分为字符串数组。
  • reverse()方法就地反转数组。第一个数组元素成为最后一个元素,最后一个数组元素成为第一个元素。
  • join()方法通过连接数组(或类似数组的对象)中的所有元素(用逗号或指定的分隔符字符串分隔)来创建并返回一个新字符串。如果数组只有一项,则将返回该项而不使用分隔符。
  • 请注意,我们在 的空引号之间不留空格.join(' ')。空格是必需的,否则返回的字符串将用逗号将每个字符与其余字符分隔开。
  • 展开运算符用于将可迭代对象扩展到参数列表中。
  • forEach()方法为每个数组元素执行一次提供的函数。
  • map()方法创建一个新数组,其中填充了对调用数组中每个元素调用所提供函数的结果。
  • reduce()方法对数组的每个元素执行(您提供的)reducer 函数,从而产生单个输出值。
相关推荐
qianmoQ3 分钟前
第五章:工程化实践 - 第三节 - Tailwind CSS 大型项目最佳实践
前端·css
椰果uu18 分钟前
前端八股万文总结——JS+ES6
前端·javascript·es6
微wx笑39 分钟前
chrome扩展程序如何实现国际化
前端·chrome
~废弃回忆 �༄44 分钟前
CSS中伪类选择器
前端·javascript·css·css中伪类选择器
CUIYD_19891 小时前
Chrome 浏览器(版本号49之后)‌解决跨域问题
前端·chrome
IT、木易1 小时前
跟着AI学vue第五章
前端·javascript·vue.js
薛定谔的猫-菜鸟程序员1 小时前
Vue 2全屏滚动动画实战:结合fullpage-vue与animate.css打造炫酷H5页面
前端·css·vue.js
春天姐姐2 小时前
vue3项目开发总结
前端·vue.js·git
谢尔登2 小时前
【React】React 性能优化
前端·react.js·性能优化
来一碗刘肉面2 小时前
TypeScript - 属性修饰符
前端·javascript·typescript