当前位置:首页 > JavaScript

反转实现方式js

2026-03-16 07:08:07JavaScript

反转数组的实现方式(JavaScript)

使用 Array.prototype.reverse() 方法
这是最直接的方式,会原地修改原数组并返回反转后的结果:

const arr = [1, 2, 3];
const reversedArr = arr.reverse();
console.log(reversedArr); // [3, 2, 1]
console.log(arr); // [3, 2, 1](原数组被修改)

使用扩展运算符 ...reverse()(不修改原数组)
通过创建新数组避免修改原数组:

const arr = [1, 2, 3];
const reversedArr = [...arr].reverse();
console.log(reversedArr); // [3, 2, 1]
console.log(arr); // [1, 2, 3](原数组不变)

使用 reduce() 方法
通过累加器从右向左构建新数组:

const arr = [1, 2, 3];
const reversedArr = arr.reduce((acc, current) => [current, ...acc], []);
console.log(reversedArr); // [3, 2, 1]

使用 for 循环
手动遍历数组并反转:

const arr = [1, 2, 3];
const reversedArr = [];
for (let i = arr.length - 1; i >= 0; i--) {
  reversedArr.push(arr[i]);
}
console.log(reversedArr); // [3, 2, 1]

使用 Array.from()map()
结合索引计算实现反转:

const arr = [1, 2, 3];
const reversedArr = Array.from({ length: arr.length }, (_, i) => arr[arr.length - 1 - i]);
console.log(reversedArr); // [3, 2, 1]

反转字符串的实现方式(JavaScript)

使用 split()reverse()join()
将字符串转为数组反转后再合并:

const str = "hello";
const reversedStr = str.split("").reverse().join("");
console.log(reversedStr); // "olleh"

使用 reduce()
直接操作字符串字符:

const str = "hello";
const reversedStr = [...str].reduce((acc, char) => char + acc, "");
console.log(reversedStr); // "olleh"

使用 for...of 循环
遍历字符串并拼接:

反转实现方式js

const str = "hello";
let reversedStr = "";
for (const char of str) {
  reversedStr = char + reversedStr;
}
console.log(reversedStr); // "olleh"

注意事项

  • 数组的 reverse() 方法会修改原数组,若需保留原数组,需先创建副本。
  • 字符串不可变,所有方法均需返回新字符串。

标签: 方式js
分享给朋友:

相关文章

js实现拖拽

js实现拖拽

实现拖拽的基本步骤 使用JavaScript实现拖拽功能需要监听鼠标事件,包括mousedown、mousemove和mouseup。以下是实现的基本逻辑: const draggableEleme…

js 实现倒计时

js 实现倒计时

实现倒计时的基本方法 使用 JavaScript 实现倒计时可以通过 setInterval 或 setTimeout 结合日期计算来完成。以下是两种常见实现方式。 使用 setInterval 实…

js 实现继承

js 实现继承

原型链继承 通过让子类的原型对象指向父类的实例来实现继承。子类实例可以访问父类原型上的属性和方法。 function Parent() { this.name = 'parent'; } Par…

js 进度条的实现

js 进度条的实现

使用 HTML 和 CSS 创建基础进度条 HTML 结构可以简单使用一个 div 元素作为容器,内部嵌套另一个 div 表示进度: <div class="progress-containe…

js实现验证

js实现验证

验证表单输入 使用JavaScript验证表单输入是常见的需求。可以通过监听表单提交事件,检查输入字段是否符合要求。 document.getElementById('myForm').addEve…

jquery.js

jquery.js

jQuery 是一个快速、简洁的 JavaScript 库,简化了 HTML 文档遍历、事件处理、动画设计和 Ajax 交互等操作。以下是关于 jQuery.js 的核心信息和使用方法: 获…