JavaScript交换变量的常用方法小结【4种方法】


Posted in Javascript onMay 07, 2020

本文实例讲述了JavaScript交换变量的常用方法。分享给大家供大家参考,具体如下:

JavaScript交换变量的常用方法小结【4种方法】

许多算法需要交换2个变量。在编码面试中,可能会问您“如何在没有临时变量的情况下交换2个变量?”。我很高兴知道执行变量交换的多种方法。在本文中,您将了解大约4种交换方式(2种使用额外的内存,而2种不使用额外的内存)。

1. 解构赋值

解构赋值语法(ES2015的功能)使您可以将数组的项提取到变量中。例如,以下代码对数组进行解构:

let a;
let b;

[a, b] = [1, 2, 3];

a; // => 1
b; // => 2

[a,b] = [1,2,3] 是对 [1,2,3] 数组进行解构的解构赋值。[1,2,3] 的第一项1 分配了一个变量 a,第二项 2 对应地分配了 b

知道如何解构数组,可以很容易地使用它交换变量。让我们使用解构分配交换变量 ab

let a = 1;
let b = 2;

[a, b] = [b, a];

a; // => 2
b; // => 1

第一步,在解构的右侧,创建一个临时数组[b,a](其值为[2,1])。

然后发生临时数组的解构:[a,b] = [2,1]。变量 a 分配了 2b 分配了 1。已经完成了 ab 的交换。

我喜欢这种解构方法,因为它简短而富有表现力:交换仅用一条语句执行。它适用于任何数据类型:数字,字符串,布尔值,对象。

对于大多数情况,我建议使用解构赋值来交换变量。

2. 临时变量

使用临时变量交换变量是经典的。顾名思义,这种方法需要一个额外的临时变量。

让我们使用临时变量 temp 交换变量 ab 的值:

let a = 1;
let b = 2;
let temp;

temp = a;
a = b;
b = temp;

a; // => 2
b; // => 1

3. 加减法

您可以交换变量而无需使用额外的内存(例如临时数组或变量)。

以下示例使用加法 + 和差分- 算术运算符交换变量 ab

let a = 1;
let b = 2;

a = a + b;
b = a - b;
a = a - b;

a; // => 2
b; // => 1

最初,a1b2。让我们看一下 3 条语句如何执行交换:

  1. a = a + b赋予a1 + 2
  2. b = a - bb赋值1 + 2 - 2 = 1b现在为1)。
  3. a = a - ba分配值1 + 2 - 1 = 2a现在为2)。

最后,a2b1。已经完成了ab的交换。

尽管这种方法不使用临时变量,但有很大的局限性。

  • 首先,您只能交换整数。
  • 其次,在第一步a = a + b进行加法时要注意数字溢出(总和必须小于Number.MAX_SAFE_INTEGER)。

4. 按位XOR运算符

如果操作数不同,则 XOR 运算符的计算结果为 true。提醒一下,这是 XOR 真值表:

a b a ^ b
0 0 0
1 1 0
0 1 1
1 0 1

在JavaScript中,按位 XOR 运算符 n1 ^ n2n1n2数字的每一位执行 XOR 操作。

举例来说,这是 5 ^ 7 评估(evaluates)为2的方式:

1 0 1 (5 的二进制)
1 1 1 (7 的二进制)
-----
0 1 0 (5 ^ 7 = 2 的二进制)

按位 XOR 具有 2 个有趣的属性:

  • n ^ n = 0:对相同数字执行的按位 XOR 为0.
  • n ^ 0 = n:对一个数字执行按位异或,零是相同数字.

这些 XOR 属性可用于交换变量。让我们看看如何交换ab变量:

let a = 1;
let b = 2;

a = a ^ b;
b = a ^ b;
a = a ^ b;

a; // => 2
b; // => 1

交换过程:

  1. a = a ^ b
  2. b = a ^ b。基于1 aa ^ b取代。因此b =(a ^ b)^ b = a ^(b ^ b)= a ^ 0 = a。请记住,现在b不是a
  3. a = a ^ b。基于1 aa替换为a ^ b,基于2 ba替换为a。因此a =(a ^ b)^ a = b ^(a ^ a)= b ^ 0 = b。变量a变为b

如果您觉得解释很复杂,请随时跳过。由3个赋值组成的按位XOR(n ^ n = 0n ^ 0 = n)的性质使您可以交换ab的值。

使用按位XOR运算符交换变量有局限性:您只能交换整数。

5. 结论

JavaScript提供了很多交换变量的好方法,无论有没有额外的内存。

  • 我建议使用的第一种方法通过应用解构赋值[a,b] = [b,a]交换变量。这是一种简短而富有表现力的方法。
  • 第二种方法使用临时变量。这是代替(applying)解构赋值方法的不错选择。
  • 第三种方法,使用加减法,不使用其他变量或内存。但是,该方法仅限于交换整数。
  • 同样,使用按位XOR的第四种方法不使用额外的内存。但是同样,您只能交换整数。

你觉得交换变量的首选方式是什么?

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

更多关于JavaScript相关内容可查看本站专题:《javascript面向对象入门教程》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
javascript showModalDialog模态对话框使用说明
Dec 31 Javascript
如何确保JavaScript的执行顺序 之实战篇
Mar 03 Javascript
文件编码导致jquery失效的解决方法
Jun 26 Javascript
javascript去除字符串中所有标点符号和提取纯文本的正则
Jun 07 Javascript
jQuery 实现侧边浮动导航菜单效果
Dec 26 Javascript
jquery实现简单的二级导航下拉菜单效果
Sep 07 Javascript
Bootstrap学习系列之使用 Bootstrap Typeahead 组件实现百度下拉效果
Jul 07 Javascript
pm2 部署 node的三种方法示例
Oct 20 Javascript
Node爬取大批量文件的方法示例
Jun 28 Javascript
JavaScript一元正号运算符示例代码
Jun 30 Javascript
Vue实现剪贴板复制功能
Dec 31 Javascript
vue完美实现el-table列宽自适应
May 08 Vue.js
原生JavaScript创建不可变对象的方法简单示例
May 07 #Javascript
Javascript幻灯片播放功能实现过程解析
May 07 #Javascript
基于javascript实现日历功能原理及代码实例
May 07 #Javascript
Vue简单实现原理详解
May 07 #Javascript
angular组件间通讯的实现方法示例
May 07 #Javascript
基于better-scroll 实现歌词联动功能的代码
May 07 #Javascript
Vue双向绑定实现原理与方法详解
May 07 #Javascript
You might like
PHP管理依赖(dependency)关系工具 Composer 安装与使用
2014/08/18 PHP
php实现上传图片保存到数据库的方法
2015/02/11 PHP
php上传大文件设置方法
2016/04/14 PHP
PHP简单实现冒泡排序的方法
2016/12/26 PHP
PHP获取中国时间(上海时区时间)及美国时间的方法
2017/02/23 PHP
javascript 新浪背投广告实现代码
2009/07/07 Javascript
EXTJS FORM HIDDEN TEXTFIELD 赋值 使用value不好用的问题
2011/04/16 Javascript
js 中将多个逗号替换为一个逗号的代码
2014/06/07 Javascript
JavaScript设计模式之单件模式介绍
2014/12/28 Javascript
jQuery及JS实现循环中暂停的方法
2015/02/02 Javascript
javascript实现支持移动设备画廊
2015/08/24 Javascript
纯js代码实现未知宽高的元素在指定元素中垂直水平居中显示
2015/09/12 Javascript
BootStrapValidator初使用教程详解
2017/02/10 Javascript
Vue.js学习笔记之修饰符详解
2017/07/25 Javascript
vue 标签属性数据绑定和拼接的实现方法
2018/05/17 Javascript
浅谈vue3中effect与computed的亲密关系
2019/10/10 Javascript
[44:47]Ti4 循环赛第三日 iG vs NaVi
2014/07/12 DOTA
Python实现处理管道的方法
2015/06/04 Python
详解Python的Django框架中的Cookie相关处理
2015/07/22 Python
Python和JavaScript间代码转换的4个工具
2016/02/22 Python
基于hashlib模块--加密(详解)
2017/06/21 Python
通过python实现随机交换礼物程序详解
2019/07/10 Python
python实现两张图片拼接为一张图片并保存
2019/07/16 Python
Python pip 安装与使用(安装、更新、删除)
2019/10/06 Python
python输入错误后删除的方法
2019/10/12 Python
Python 实现日志同时输出到屏幕和文件
2020/02/19 Python
python中sort sorted reverse reversed函数的区别说明
2020/05/11 Python
用python按照图像灰度值统计并筛选图片的操作(PIL,shutil,os)
2020/06/04 Python
卡塔尔航空官方网站:Qatar Airways
2017/02/08 全球购物
澳大利亚便宜隐形眼镜购买网站:QUICKLENS Australia
2018/10/06 全球购物
IFCHIC台湾:欧美国际设计师品牌
2019/05/18 全球购物
扩大国家免疫规划实施方案
2014/03/21 职场文书
基本公共卫生服务健康教育工作方案
2014/05/22 职场文书
大学生迟到检讨书500字
2014/10/17 职场文书
初中生300字旷课检讨书
2014/11/19 职场文书
简爱读书笔记
2015/06/26 职场文书