详细说明几种变量交换方法以及JS的性能分析和比较

序

“两个变量的交换值不值”，这是一个经典话题。现在有很多成熟的解决方案。本文主要列举了几种常用的解决方案，并进行了大量的计算、分析和比较。

起源

最近在做一个项目的时候，其中一个要求是交换数组中的两个元素。当时使用的方法是：

arr=[项目0，项目1，ItemN]；//使用此代码交换第0个和第K(kN)个元素arr [0]=arr。split (k，1，arr[0])[0]；当时我觉得这个方法优雅有力。

后来，我在业余时间再次进行了这项研究，并自己编写了一个分析工具，与常用的方法进行比较。

结果，令我非常惊讶的是，这种方法的效率比我想象的要低得多。以下是一个测试结果的图表

因此，基于这一点，对其他几种数值交换方法进行了研究，并将其整合到分析工具中，从而对本文进行了总结。

JS变量交换的几种方式

其实关于JS变量交换，应用最广泛的方法基本都是前端人员必备的技能。本文正是借分析研究的机会，列举了本次分析中使用的几种交换方法。

第一个：常见的临时变量交换方法

适用性3360适用于所有类型

代码如下：

tmp=a；a=b；b=tmp简要说明：

这是应用最广泛的方法，经过实际测试和分析，性能也很高

(在JS中，这种方法非常高效，即使在其他语言中，只要提前创建tmp变量，性能也不会很低，但是有些杂技演员和少数民族的性能就很低。)

基本上可以说：经典是最优雅的

第二个：使用新对象进行数据交换

适用性3360适用于所有类型

代码如下：

a={a : b，b : a }；b=a.ba=a.a简要说明：

这种方法在实战中很少使用

第三个：使用新阵列进行数据交换

适用性3360适用于所有类型

代码如下：

a=[b，b=a][0]；简要说明：

这种方法在各大论坛都有使用，但测试后实际性能不高

第四个：使用数组来交换变量(EJS支持)

适用性3360适用于所有类型

代码如下：

`[a，b]=[b，a]；简要说明：

ES6出来后也有人用这个。实际上，它是在现有的浏览器中测试的，性能非常低

第五个：使用尝试捕获交换

适用性3360适用于所有类型

代码如下：

a=(函数(){；尝试{return b}最后{ b=a } })()；简要说明：

这个方法应该是基本不用的，不实用的，它的性能在所有方法中是垫底的

第六个：异或运算以第一种方式交换变量

适用性3360适用于数字或字符串

代码如下：

a=(b=(a ^=b)^ b)^ a；简要说明：

异或方法广泛应用于数字或字符串，性能不低

第七个：异或运算以第二种方式交换变量

适用性3360适用于数字或字符串

代码如下：

一个^=b；^=a；一个^=b；简要说明：

异或方法广泛应用于数字或字符串，性能不低

:数字之间的第八次加减，第一次加减

适用性：仅适用于数字

代码如下：

a=a b；b=a-b；a=a-b；简要说明：

当它仅用于数字交换时，这种用法并不弱

:个数之间的第九次加减运算，第一次加减方法

适用性：仅适用于数字

代码如下：

a=B- a(b=a)；简要说明：

当它仅用于数字交换时，这种用法并不弱

第十个：由eval计算

适用性3360仅适用于数字和字符串

代码如下：

eval(' a=' b '；b=' a '；简要说明：

这种方法只用于研究，在实战中慎用

这种模式执行一万次，相当于其他执行一亿次.

在第十一个：阵列中，拼接用于交换两个元素的位置

适用性3360仅适用于数组元素

代码如下：

arr[0]=arr.splice(2，1，arr[0])[0]；简要说明：

这种方式看似优雅，但实际上表现远不如临时变量

各种交换方法的性能比较

对上述方法进行了逐一对比分析，结论基本可以：

让我们诚实地用临时变量来交换它，经典的，优雅的，并保证什么都不会发生。

性能对比截图

分析结果1

下面截图中的数据是在chrome中运行1亿次后得出的结论(每次运行100万次，共100个周期，得出的分析结果)

可以看出，tmp变量交换最快，try catch最慢

分析结果2

以下截图数据是在chrome中运行100万次后得出的结论(支持es6)(每次运行10000次，共100个周期，得出的分析结果)

可以看出，eval最慢，拼接性能低，tmp变量交换稳定

以上就是本文的全部内容。希望对大家的学习有帮助，支持我们。