Heim > Artikel > Web-Frontend > 10 Möglichkeiten, Werte in JS auszutauschen (Teilen)
Im Entwicklungsprozess müssen wir erneut Werte austauschen. Im Allgemeinen verwenden wir eine einfache Lösung: „temporäre Variablen“. Aber es gibt einen besseren Weg, und zwar nicht nur einen, es gibt viele. Manchmal suchen wir online nach Lösungen, kopieren sie und fügen sie ein, wenn wir sie finden, denken aber nie darüber nach, wie dieser kleine Code funktioniert. Jetzt ist es an der Zeit zu lernen, wie man Werte einfach und effizient austauscht.
Die einfachste ist die erste.
function swapWithTemp(num1,num2){
console.log(num1,num2)
var temp = num1;
num1 = num2;
num2 = temp;
console.log(num1,num2)
}
swapWithTemp(2.34,3.45)Sie können auch etwas mathematische Magie verwenden, um Werte auszutauschen.
function swapWithPlusMinus(num1,num2){
console.log(num1,num2)
num1 = num1+num2;
num2 = num1-num2;
num1 = num1-num2;
console.log(num1,num2)
}
swapWithPlusMinus(2.34,3.45)Mal sehen, wie es funktioniert. Wir erhalten die Summe zweier Zahlen in Zeile 4. Wenn nun eine Zahl von der Summe abgezogen wird, dann ist die andere Zahl richtig. Dies ist, was Zeile 5 tut. Das Subtrahieren von num2 von der in der Variablen num1 gespeicherten Summe führt zum ursprünglichen num1-Wert, der in num2 gespeichert ist. Ebenso wird der Wert von num2 in num1 in Zeile 6 abgerufen. num1 变量中的总和中减去 num2 会得到存储在 num2 中的原始 num1 值。同样，在第 6 行的 num1 中得到 num2 的值。
小心：还有一个与 + 和 - 互换的单行代码方案，不过。。。
它是这样的：
function swapWithPlusMinusShort(num1,num2){
console.log(num1,num2)
num2 = num1+(num1=num2)-num2;
console.log(num1,num2)
}
swapWithPlusMinusShort(2,3)上面的代码给出了预期的结果。 () 中的表达式将 num2 存储在 num1 中，然后减去 num1 - num2，除了减去 num2 - num2 = 0 之外什么也没有做，因此得到了结果。但是当使用浮点数时，会看到一些意外的结果。
试着执行下面的代码并查看结果：
function swapWithPlusMinusShort(num1,num2){
console.log(num1,num2)
num2 = num1+(num1=num2)-num2;
console.log(num1,num2)
}
swapWithPlusMinusShort(2,3.1)仅通过使用 + 运算符就可以达到同时使用 + 和 - 相同的结果。
看下面的代码：
function swapWithPlus(num1,num2){
console.log(num1,num2)
num2 = num1 + (num1=num2, 0)
console.log(num1,num2)
}
//Try with - operator
swapWithPlus(2.3,3.4)上面的代码是有效的，但牺牲了可读性。在第 4 行的 () 中，我们将 num1 赋值给 num2，而旁边的 0 是返回值。简而言之，第 4 行的运算逻辑如下所示：
num2 = num1 + 0 => num2 = num1.
所以得到了正确结果。
注意：一些 JavaScript 引擎可能会对上面的代码进行优化，从而忽略 + 0。
让我们用 * 和/ 运算符玩更多的花样。
其原理与先前的方法相同，但是有一些小问题。
function swapWithMulDiv(num1,num2){
console.log(num1,num2)
num1 = num1*num2;
num2 = num1/num2;
num1 = num1/num2;
console.log(num1,num2)
}
swapWithMulDiv(2.34,3.45)与上一个方法相同。首先得到两个数字的乘积，并将它们存储在 num1 中。然后在第 5 行，把 num2 与这个结果相除，得到第一个数字，然后重复此过程以获得第二个数字。
现在你成“ 数学家” 了。
不过那小问题在哪儿呢？
让我们来尝试一下：
function swapWithMulDiv(num1,num2){
console.log(num1,num2)
num1 = num1*num2;
num2 = num1/num2;
num1 = num1/num2;
console.log(num1,num2)
}
//试着改变数字的值，看看会发生什么
swapWithMulDiv(2.34,0)我们的值没有交换，而是得到了一个奇怪的 NaN，这是怎么回事。如果你还记得小学的数学课，就会想起不要除以 0，因为那是没有意义的。
然后再看看这种方法的其他问题，看下面的代码：
function swapWithMulDiv(num1,num2){
console.log(num1,num2)
num1 = num1*num2;
num2 = num1/num2;
num1 = num1/num2;
console.log(num1,num2)
}
//看看会发生什么
swapWithMulDiv(2.34,Infinity)没错，又是 NaN。因为你无法使用 Infinity 去除任何值，它是未定义的。
但我还想再试试：
function swapWithMulDiv(num1,num2){
console.log(num1,num2)
num1 = num1*num2;
num2 = num1/num2;
num1 = num1/num2;
console.log(num1,num2)
}
//会怎样呢
swapWithMulDiv(2.34,-Infinity)-Infinity 的结果与前面的代码相同，原因也一样。
事实证明，即使你是一位出色的“数学家”，也有无能为力的时候。
下面是用 * 和 / 进行值交换的较短版本，仍存在相同的问题：
function swapWithMulDivShort(num1,num2){
console.log(num1,num2)
num2 = num1*(num1=num2)/num2;
console.log(num1,num2)
}
swapWithMulDivShort(2.3,3.4)上面的代码类似于用 + 和 - 进行交换时的较短的代码。把 num2 赋值给 num1，然后第 4 行的演算逻辑是这样：
num2 = num1 * num2 / num2
=> num2 = num1这样两个值就互换了。
function swapWithMul(num1,num2){
console.log(num1,num2)
num2 = num1 * (num1=num2, 1)
console.log(num1,num2)
}
//Try with / and ** operator
swapWithMul(2.3,3.4)上面的程序是有效的，但牺牲了可读性。在第 4 行的 () 中，我们将 num1 赋值给 num2，旁边的 1
+ und - austauschbar ist. . . Es sieht so aus: num2 = num1 * 1
=> num2 = num1() speichert num2 in num1 und subtrahiert dann num1 - num2, zusätzlich zum Subtrahieren von Going to num2 - num2 = 0 bewirkt nichts, daher das Ergebnis. Wenn Sie jedoch mit Gleitkommazahlen arbeiten, werden Sie einige unerwartete Ergebnisse sehen. Versuchen Sie, den folgenden Code auszuführen und sehen Sie sich das Ergebnis an: | Sehen Sie sich den Code unten an: | 第四行:
num1 = num1 ^ num2
=> 1010 ^ 0001
=> 1011
=> 7
第五行:
num2 = num1 ^ num2
=> 1011 ^ 0001
=> 1010
=> 10
第六行:
num1 = num1 ^ num2
=> 1011 ^ 1010
=> 0001
=> 1 | Der obige Code funktioniert, allerdings auf Kosten der Lesbarkeit. In function swapWithXOR(num1,num2){
console.log(num1,num2)
num1 = num1^num2;
num2 = num1^num2;
num1 = num1^num2;
console.log(num1,num2)
}
swapWithXOR(2.34,3.45) | Wir erhalten also das richtige Ergebnis.
|---|---|---|
Lassen Sie uns weitere Tricks mit den Operatoren * und / ausführen. |
Das Prinzip ist das gleiche wie bei der vorherigen Methode, es gibt jedoch einige kleinere Probleme. | Gleiche wie bei der vorherigen Methode. Ermitteln Sie zunächst das Produkt zweier Zahlen und speichern Sie es in num1. Dann wird in Zeile 5 num2 durch dieses Ergebnis dividiert, um die erste Zahl zu erhalten, und der Vorgang wird wiederholt, um die zweite Zahl zu erhalten. |
| Aber wo ist dieses kleine Problem? | Lass uns Folgendes versuchen: | Unsere Werte werden nicht vertauscht, aber wir bekommen ein seltsames NaN, was los ist. Wenn Sie sich an den Mathematikunterricht in der Grundschule erinnern, werden Sie daran denken, nicht durch 0 zu dividieren, weil das keinen Sinn ergibt. |
Ja, es ist wieder NaN. Da Sie mit Infinity keinen Wert entfernen können, ist dieser undefiniert. |
Aber ich möchte es noch einmal versuchen: | -Infinity hat aus demselben Grund das gleiche Ergebnis wie der vorherige Code. |
Hier ist eine kürzere Version des Werteaustauschs mit * und /, bei der immer noch das gleiche Problem auftritt: | Der obige Code ähnelt der Verwendung von + und <code>-. Weisen Sie num2 num1 zu, und die Berechnungslogik in Zeile 4 lautet wie folgt:
| Auf diese Weise werden die beiden Werte ausgetauscht. |
function swapWithArray(num1,num2){
console.log(num1,num2)
num2 = [num1, num1 = num2][0];
console.log(num1,num2)
}
swapWithArray(2.3,Infinity)🎜Das ergibt das Ergebnis. 🎜🎜6. Verwenden Sie bitweises Exklusiv-ODER (XOR). 🎜🎜XOR wird verwendet, um binäre Bitoperationen durchzuführen. Das Ergebnis ist 1, wenn zwei unterschiedliche Eingaben vorliegen, andernfalls 0. 🎜🎜🎜🎜🎜 🎜🎜🎜🎜0🎜🎜1🎜🎜1🎜 🎜🎜🎜0🎜🎜0🎜🎜0🎜🎜🎜🎜先了解其工作原理！
function swapWithXOR(num1,num2){
console.log(num1,num2)
num1 = num1^num2;
num2 = num1^num2;
num1 = num1^num2;
console.log(num1,num2)
}
// 试试负值会怎样
swapWithXOR(10,1)10 的4 位二进制数 -> 1010
1 的 4 位二进制数 -> 0001
现在：
第四行:
num1 = num1 ^ num2
=> 1010 ^ 0001
=> 1011
=> 7
第五行:
num2 = num1 ^ num2
=> 1011 ^ 0001
=> 1010
=> 10
第六行:
num1 = num1 ^ num2
=> 1011 ^ 1010
=> 0001
=> 1两个值交换了。
再来看另一个例子：
function swapWithXOR(num1,num2){
console.log(num1,num2)
num1 = num1^num2;
num2 = num1^num2;
num1 = num1^num2;
console.log(num1,num2)
}
swapWithXOR(2.34,3.45)嗯？？交换的值在哪儿？我们只是得到了数字的整数部分，这就是问题所在。 XOR 假定输入是整数，所以···相应地执行计算。但是浮点数不是整数，而是由 IEEE 754 标准表示的，将数字分为三部分：符号位、代表指数的一组位和代表尾数的一组位。位数是介于1（含）和2（不含）之间的数字。所以得到的值不正确。
另一个例子：
function swapWithXOR(num1,num2){
console.log(num1,num2)
num1 = num1^num2;
num2 = num1^num2;
num1 = num1^num2;
console.log(num1,num2)
}
// 试试 infinities 和整数值.
swapWithXOR(-Infinity,Infinity)毫无意外，我们没有得到预期的结果。这是因为 Infinity 和 – Infinity 都是浮点数。正如我们在前面所讨论的，对于 XOR，浮点数是一个问题。
它用来进行二进制位运算，但是与 XOR 正好相反。当有两个不同的输入时，XNOR 的结果是 0，否则结果为 1。 JavaScript 没有执行 XNOR 的运算符，所以要用 NOT 运算符对 XOR 的结果求反。
| X | Y | XNOR |
|---|---|---|
| 1 | 1 | 1 |
| 1 | 0 | 0 |
| 0 | 1 | 0 |
| 0 | 0 | 1 |
先了解其工作原理：
function swapWithXNOR(num1,num2){
console.log(num1,num2)
num1 = ~(num1^num2);
num2 = ~(num1^num2);
num1 = ~(num1^num2);
console.log(num1,num2)
}
//可以试试负值
swapWithXNOR(10,1)10 的 4 位二进制数 -> 1010
1 的 4 位二进制数 -> 0001
第 4 行：
num1 = ~(num1 ^ num2)
=> ~(1010 ^ 0001)
=>~(1011)
=> ~11
=> -12由于这是一个负数，所以需要将其转换回二进制并计算 2 的补码来获取十进制值，例如：
-12 => 1100
=> 0011 + 1
=> 0100第 5 行：
num2 = ~(num1 ^ num2)
=> ~(0100 ^ 0001)
=> ~(0101)
=> ~5
=> -6-6
=> 0110
=> 1001 + 1
=> 1010
=> 10第 6 行：
num1 = ~(num1 ^ num2)
=> ~(0100^ 1010)
=> ~(1110)
=> ~14
=> -15-15
=> 1111
=> 0000 + 1
=> 0001
=> 1花了一些时间，但还是交换了值。但不幸的是，它遇到了与 XOR 相同的问题，不能处理浮点数和无穷大。
试试下面的值：
function swapWithXNOR(num1,num2){
console.log(num1,num2)
num1 = ~(num1^num2);
num2 = ~(num1^num2);
num1 = ~(num1^num2);
console.log(num1,num2)
}
swapWithXNOR(2.3,4.5)这是一线技巧。只需要一行代码就可以进行交换，更重要的是，无需数学运算，只需要数组的基本知识。不过它看上去可能很奇怪。
先让看看它的实际效果：
function swapWithArray(num1,num2){
console.log(num1,num2)
num2 = [num1, num1 = num2][0];
console.log(num1,num2)
}
swapWithArray(2.3,Infinity)在数组的下标 0 位置中存储 num1，在下标 1 中，既将 num2 分配给 num1，又存储了 num2。另外，我们只是访问 [0]，将数组中的 num1 值存储在 num2 中。而且可以在这里交换我们想要的任何东西，比如：整数、浮点数（包括无穷数）以及字符串。看上去很整洁，但是在这里失去了代码的清晰度。
这是 ES6 的功能。这是所有方法中最简单的。只需要一行代码就可以完成交换：
let num1 = 23.45; let num2 = 45.67; console.log(num1,num2); [num1,num2] = [num2,num1]; console.log(num1,num2);
这是最奇怪的一个。简单的说 IIFE 是在在定义后立即执行的函数。
可以用它来交换两个值：
function swapWithIIFE(num1,num2){
console.log(num1,num2)
num1 = (function (num2){ return num2; })(num2, num2=num1)
console.log(num1,num2)
}
swapWithIIFE(2.3,3.4)在上面的例子中，在第4行立即调用一个函数。最后的括号是该函数的参数。第二个参数将 num1 赋值给 num2，仅仅返回第一个参数，不过这种交换方法效率不高。
本文探讨了用于在 JavaScript 中对值进行交换的众多方法。希望对你有所帮助！
本文转载自：https://codeburst.io/10-ways-to-swap-values-in-javascript-8a1d056352dd
作者：Piyush Kochhar
更多编程相关知识，请访问：编程教学！！
Das obige ist der detaillierte Inhalt von10 Möglichkeiten, Werte in JS auszutauschen (Teilen). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!