当前位置:首页 > JavaScript

js实现翻转

2026-04-06 12:05:14JavaScript

翻转数组

使用 Array.prototype.reverse() 方法可以原地翻转数组。该方法会改变原数组,并返回翻转后的数组。

const arr = [1, 2, 3, 4, 5];
const reversedArr = arr.reverse();
console.log(reversedArr); // [5, 4, 3, 2, 1]
console.log(arr); // [5, 4, 3, 2, 1]

如果需要保留原数组不变,可以先复制数组再翻转。

const arr = [1, 2, 3, 4, 5];
const reversedArr = [...arr].reverse();
console.log(reversedArr); // [5, 4, 3, 2, 1]
console.log(arr); // [1, 2, 3, 4, 5]

翻转字符串

字符串没有直接的翻转方法,可以先将字符串转为数组,翻转后再转回字符串。

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

手动实现翻转

可以通过循环手动实现翻转逻辑,适用于数组或字符串。

function reverseArray(arr) {
  const result = [];
  for (let i = arr.length - 1; i >= 0; i--) {
    result.push(arr[i]);
  }
  return result;
}

const arr = [1, 2, 3, 4, 5];
console.log(reverseArray(arr)); // [5, 4, 3, 2, 1]

使用递归翻转

递归方法也可以实现翻转,但需要注意栈溢出的风险。

function reverseArrayRecursive(arr, result = []) {
  if (arr.length === 0) return result;
  return reverseArrayRecursive(arr.slice(0, -1), [...result, arr[arr.length - 1]]);
}

const arr = [1, 2, 3, 4, 5];
console.log(reverseArrayRecursive(arr)); // [5, 4, 3, 2, 1]

翻转对象属性

如果需要翻转对象的键值对,可以使用 Object.entries()reduce 方法。

js实现翻转

const obj = { a: 1, b: 2, c: 3 };
const reversedObj = Object.entries(obj).reduce((acc, [key, value]) => {
  acc[value] = key;
  return acc;
}, {});

console.log(reversedObj); // { '1': 'a', '2': 'b', '3': 'c' }

性能考虑

对于大型数组,reverse() 方法通常比手动实现的循环更快,因为它是原生方法。但在某些特定场景下,手动实现可能更灵活。

标签: js
分享给朋友:

相关文章

js实现轮播

js实现轮播

实现基础轮播效果 使用HTML结构创建轮播容器和图片元素: <div class="carousel"> <div class="carousel-inner">…

js实现图片上传

js实现图片上传

图片上传的基本实现 使用HTML的<input type="file">元素配合JavaScript的File API可以实现图片上传功能。HTML部分需要创建一个文件选择输入框和一个用于…

jquery.js

jquery.js

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

js实现论坛

js实现论坛

实现论坛的基本功能 使用JavaScript实现一个论坛需要结合前端和后端技术。前端可以使用React、Vue或Angular等框架,后端可以选择Node.js配合Express或Koa框架。数据库可…

js怎么实现异步

js怎么实现异步

异步实现方法 JavaScript中实现异步操作主要通过以下几种方式: Promise Promise是ES6引入的异步解决方案,用于处理异步操作的成功或失败状态。 const promise =…

js 实现页面刷新

js 实现页面刷新

使用 location.reload() location.reload() 是原生 JavaScript 提供的页面刷新方法。调用该方法会重新加载当前页面,相当于点击浏览器的刷新按钮。 // 基本…