Maison > interface Web > js tutoriel > le corps du texte

10 façons d'échanger des valeurs en JS (partage)

青灯夜游
Libérer: 2021-01-08 14:20:14
avant
2754 Les gens l'ont consulté

10 façons d'échanger des valeurs en JS (partage)

Pendant le processus de développement, nous devons à nouveau échanger des valeurs. Généralement on utilise une solution simple : "variables temporaires". Mais il existe une meilleure solution, et pas une seule, il y en a plusieurs. Parfois, nous recherchons une solution en ligne, la copions et la collons lorsque nous la trouvons, mais ne pensons jamais au fonctionnement de ce petit morceau de code. Il est maintenant temps d'apprendre à échanger des valeurs de manière simple et efficace.

1. Utilisez des variables temporaires

La plus simple est la première.

function swapWithTemp(num1,num2){
  console.log(num1,num2)

  var temp = num1;
  num1 = num2;
  num2 = temp;

  console.log(num1,num2)
}

swapWithTemp(2.34,3.45)
Copier après la connexion

2. Utilisez les opérateurs arithmétiques + et -

Vous pouvez également utiliser un peu de magie mathématique pour échanger des valeurs.

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)
Copier après la connexion

Voyons comment ça marche. On obtient la somme de deux nombres à la ligne 4. Maintenant, si un nombre est soustrait de la somme, l’autre nombre est correct. C'est ce que fait la ligne 5. En soustrayant num1 de la somme stockée dans la variable num2, vous obtenez la valeur num2 originale stockée dans la variable num1. De même, obtenez la valeur de num1 dans num2 à la ligne 6.

Attention : Il existe cependant également une alternative à une seule ligne à + et - interchangeables. . .

Ça se passe comme ceci :

function swapWithPlusMinusShort(num1,num2){
  console.log(num1,num2)

  num2 = num1+(num1=num2)-num2;

  console.log(num1,num2)
}

swapWithPlusMinusShort(2,3)
Copier après la connexion

Le code ci-dessus donne le résultat attendu. L'expression dans () stocke num2 dans num1 puis soustrait num1 - num2, ne faisant rien d'autre que soustraire num2 - num2 = 0 et obtenant ainsi le résultat. Mais lorsque vous travaillez avec des nombres à virgule flottante, vous verrez des résultats inattendus.

Essayez d'exécuter le code suivant et voyez le résultat :

function swapWithPlusMinusShort(num1,num2){
  console.log(num1,num2)

  num2 = num1+(num1=num2)-num2;

  console.log(num1,num2)
}

swapWithPlusMinusShort(2,3.1)
Copier après la connexion

3. Utilisez simplement l'opérateur + ou -

La simultanéité peut être obtenue simplement en utilisant l'opérateur + Utiliser + et - donne le même résultat.

Regardez le code ci-dessous :

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)
Copier après la connexion

Le code ci-dessus est valide, mais au détriment de la lisibilité. Dans () à la ligne 4, nous attribuons num1 à num2 et le 0 à côté est la valeur de retour. En bref, la logique de fonctionnement de la ligne 4 est la suivante :

num2 = num1 + 0 
=> num2 = num1.
Copier après la connexion

On obtient donc le bon résultat.

Remarque  : Certains moteurs JavaScript peuvent optimiser le code ci-dessus pour ignorer + 0.

4. Utilisez les opérateurs arithmétiques * et /

Faisons plus d'astuces avec les opérateurs * et /.

Le principe est le même que la méthode précédente, mais il y a quelques problèmes mineurs.

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)
Copier après la connexion

Identique à la méthode précédente. Obtenez d’abord le produit de deux nombres et stockez-les dans num1. Puis à la ligne 5, divisez num2 par ce résultat pour obtenir le premier nombre, puis répétez le processus pour obtenir le deuxième nombre.

Vous êtes désormais un « mathématicien ».

Mais où est ce petit problème ?

Essayons ceci :

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)
Copier après la connexion

Au lieu d'échanger nos valeurs, nous obtenons un NaN bizarre, que se passe-t-il. Si vous vous souvenez d’un cours de mathématiques à l’école primaire, vous vous souviendrez de ne pas diviser par 0 car cela n’a pas de sens.

Ensuite, pour examiner d'autres problèmes avec cette approche, regardez le code suivant :

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)
Copier après la connexion

Oui, NaN encore une fois. Parce que vous ne pouvez pas utiliser Infinity pour supprimer une valeur, elle n'est pas définie.

Mais j'ai envie de réessayer :

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)
Copier après la connexion

-Infinity Le résultat est le même que le code précédent, pour la même raison.

Il s'avère que même si vous êtes un excellent "mathématicien", il y aura des moments où vous serez impuissant.

Voici une version plus courte de l'échange de valeur utilisant * et / qui a toujours le même problème :

function swapWithMulDivShort(num1,num2){
  console.log(num1,num2)

  num2 = num1*(num1=num2)/num2;

  console.log(num1,num2)
}

swapWithMulDivShort(2.3,3.4)
Copier après la connexion

Le code ci-dessus est similaire à l'utilisation de + et - Code plus court lors du swap. Attribuez num2 à num1, puis la logique de calcul à la ligne 4 est la suivante :

num2 = num1 * num2 / num2
    => num2 = num1
Copier après la connexion

De cette façon, les deux valeurs​​sont interchangées.

5. Utilisez uniquement l'opérateur * ou /

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)
Copier après la connexion

Le programme ci-dessus est efficace, mais au détriment de la lisibilité. Dans () à la ligne 4, nous attribuons num1 à num2, et le 1 à côté est la valeur de retour. En un mot, la logique de la ligne 4 ressemble à ceci :

num2 = num1 * 1 
    => num2 = num1
Copier après la connexion

Cela vous donne le résultat.

6. Utilisez le OU exclusif au niveau du bit (XOR).

XOR est utilisé pour effectuer des opérations sur les bits binaires. Son résultat est 1 lorsqu'il y a deux entrées différentes et 0 sinon.

XYX^Y
110
101
011
000

先了解其工作原理!

function swapWithXOR(num1,num2){
  console.log(num1,num2)

  num1 = num1^num2;
  num2 = num1^num2; 
  num1 = num1^num2;

  console.log(num1,num2)
}
// 试试负值会怎样
swapWithXOR(10,1)
Copier après la connexion

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
Copier après la connexion

两个值交换了。

再来看另一个例子:

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)
Copier après la connexion

嗯??交换的值在哪儿?我们只是得到了数字的整数部分,这就是问题所在。 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)
Copier après la connexion

毫无意外,我们没有得到预期的结果。这是因为 Infinity– Infinity 都是浮点数。正如我们在前面所讨论的,对于 XOR,浮点数是一个问题。

7、使用按位同或 (XNOR)

它用来进行二进制位运算,但是与 XOR 正好相反。当有两个不同的输入时,XNOR 的结果是 0,否则结果为 1。 JavaScript 没有执行 XNOR 的运算符,所以要用 NOT 运算符对 XOR 的结果求反。

XYXNOR
111
100
010
001

先了解其工作原理:

function swapWithXNOR(num1,num2){
  console.log(num1,num2)

  num1 = ~(num1^num2);
  num2 = ~(num1^num2);
  num1 = ~(num1^num2);

  console.log(num1,num2)
}

//可以试试负值
swapWithXNOR(10,1)
Copier après la connexion

10 的 4 位二进制数 -> 1010

1 的 4 位二进制数 -> 0001

第 4 行:

num1 = ~(num1 ^ num2) 
    => ~(1010 ^ 0001) 
    =>~(1011) 
    => ~11 
    => -12
Copier après la connexion

由于这是一个负数,所以需要将其转换回二进制并计算 2 的补码来获取十进制值,例如:

-12 => 1100 
    => 0011 + 1 
    => 0100
Copier après la connexion

第 5 行:

num2 = ~(num1 ^ num2) 
    => ~(0100 ^ 0001) 
    => ~(0101) 
    => ~5 
    => -6-6 
    => 0110 
    => 1001 + 1
    => 1010 
    => 10
Copier après la connexion

第 6 行:

num1 = ~(num1 ^ num2) 
    => ~(0100^ 1010) 
    => ~(1110) 
    => ~14 
    => -15-15 
    => 1111 
    => 0000 + 1 
    => 0001 
    => 1
Copier après la connexion

花了一些时间,但还是交换了值。但不幸的是,它遇到了与 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)
Copier après la connexion

8、在数组中进行赋值

这是一线技巧。只需要一行代码就可以进行交换,更重要的是,无需数学运算,只需要数组的基本知识。不过它看上去可能很奇怪。

先让看看它的实际效果:

function swapWithArray(num1,num2){
  console.log(num1,num2)

  num2 = [num1, num1 = num2][0];

  console.log(num1,num2)
}

swapWithArray(2.3,Infinity)
Copier après la connexion

在数组的下标 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);
Copier après la connexion

10、使用立即调用的函数表达式(IIFE)

这是最奇怪的一个。简单的说 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)
Copier après la connexion

在上面的例子中,在第4行立即调用一个函数。最后的括号是该函数的参数。第二个参数将 num1 赋值给 num2,仅仅返回第一个参数,不过这种交换方法效率不高。

总结

本文探讨了用于在 JavaScript 中对值进行交换的众多方法。希望对你有所帮助!

本文转载自:https://codeburst.io/10-ways-to-swap-values-in-javascript-8a1d056352dd

作者:Piyush Kochhar

更多编程相关知识,请访问:编程教学!!

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:segmentfault.com
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal