很多開發人員,對于如何在JavaScript中交換值不清楚。在職業生涯的某個時刻,開發人員需要有交換價值。大多數時候,我們使用一種簡單的舊解決方案使用臨時變量gh。在絕望的時刻,我們在網上搜尋解決方案,找到解決方案,然后將其復制,而無需懷疑這小段代碼是如何工作的。幸運的是,現在該是學習如何輕松高效地交換價值,來消除開發人員的痛苦了。
1.使用臨時變量
讓我們讓最明顯的一個成為可能。
function swapWithTemp(num1,num2){
console.log(num1,num2)
var temp = num1;
num1 = num2;
num2 = temp;
console.log(num1,num2)
}
swapWithTemp(2.34,3.45)
2.使用算術運算符+和-是的。我們可以使用一些數學魔術來交換您的價值
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)
是的,讓我們看看它是如何工作的。我們在第4行獲得兩個數字的總和。現在,如果從總和中減去一個數字,那么另一個數字就正確了。這就是我們在第5行上所做的事情。從存儲在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)
3.僅使用+或-運算符
僅通過使用+運算符就可以達到與同時使用+和-時相同的結果。
讓我們在下面看到它:
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的代碼執行自己的優化。
4.使用算術運算符*和/讓我們使用*&/運算符做更多的魔術
其原理與先前的方法相同,但有一些微小的怪癖。
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)
與上一個相同。我們得到兩個數字的乘積,并將它們存儲在一個數字中。這就是我們在第5行上執行的操作。然后,將其中一個與產品相除,得到第一個數字,然后重復此過程以獲得第二個數字。你做到了,你是一個“ 數學家 ”。
function swapWithMulDiv(num1,num2){
console.log(num1,num2)
num1 = num1*num2;
num2 = num1/num2;
num1 = num1/num2;
console.log(num1,num2)
}
//Try switching out the numbers and see what happens
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)
}
//Try switching the numbers and see what happens
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)
}
//Try switching out the numbers and see what happens
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
我們的價值觀被交換了。
5.僅使用*或/運算符
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是返回值。簡而言之,我們的第4行如下所示:
num2 = num1 * 1 => num2 = num1
因此,我們得到了結果。
6.使用按位異或。
XOR操作二進制位。當我們有兩個不同的輸入時,它的結果為1,否則為0。
因此,讓我們了解其工作原理。
function swapWithXOR(num1,num2){
console.log(num1,num2)
num1 = num1^num2;
num2 = num1^num2;
num1 = num1^num2;
console.log(num1,num2)
}
// Try negative values
swapWithXOR(10,1)
4位二進制數10-> 1010
1-> 0001的4位二進制
On line 5: num1 = num1 ^ num2 => 1010 ^ 0001 => 1011 => 7 On line 6: num2 = num1 ^ num2 => 1011 ^ 0001 => 1010 => 10On line 7: 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
交換的值在哪里?我們只是得到數字的整數部分。這就是那里的問題。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)
}
//Try experimenting with infinities and integer values.
swapWithXOR(-Infinity,Infinity)
再次。我們沒有看到預期的結果。這是因為Infinity和–Infinity都是浮點數。正如我們上面所討論的,對于XOR,浮點數是一個問題。
7.使用按位XNOR
它也操縱二進制位,這與XOR相反。
當我們有兩個不同的輸入時,XNOR 產生0,否則產生1。JavaScript沒有執行XNOR的單個運算符,因此我們使用NOT運算符來取反XOR的結果。
因此,讓我們了解其工作原理!
function swapWithXNOR(num1,num2){
console.log(num1,num2)
num1 = ~(num1^num2);
num2 = ~(num1^num2);
num1 = ~(num1^num2);
console.log(num1,num2)
}
//Try negative values
swapWithXNOR(10,1)
4位二進制數10-> 1010
1-> 0001的4位二進制
在第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)
8.在數組中使用分配
這是一個單行的把戲。真!您只需要一行即可執行交換,更重要的是,無需數學運算。您只需要數組的基本知識。它可能看起來很奇怪,但請緊緊抓住。
所以,讓我們看看它的實際效果!
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中。而且我們可以在這里交換我們想要的任何東西,整數,浮點數以及字符串。實際上這很整潔,但是我們在這里失去了代碼的清晰度。讓我們探索其他東西。
9.使用解構表達式
這是ES6的功能。這是所有人中最簡單的。在一行中,我們可以交換以下值:
let num1 = 23.45;
let num2 = 45.67;
console.log(num1,num2);
[num1,num2] = [num2,num1];
console.log(num1,num2);
10.使用立即調用的函數表達式
這是一個奇怪的。簡而言之,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,第一個參數num1剛剛返回。因此,將交換值。請記住,這種交換方法效率不高。
好了,關于如何在JavaScript中交換值相信大家已經清楚了吧,想了解更多關于JavaScript的信息,請繼續關注中培偉業。