jsにて変数同士の値を交換する4つの方法

一時格納用の変数を使う方法

var $hoge_1 = 'ほげ1';
var $moge_1 = 'もげ1';
var $dummy_1 = $hoge_1;
$hoge_1 = $moge_1;
$moge_1 = $dummy_1;

$('.btn_1').click(function(){
    alert($hoge_1);
    alert($moge_1);
    return false;
});

• クリックすると変数が入れ替わるので、「もげ1」→「ほげ1」の順でアラートされます

加減算で入れ替える方法

var $hoge_2 = 10;
var $moge_2 = 100;
$moge_2 = $hoge_2 - $moge_2;
$hoge_2 -= $moge_2;
$moge_2 += $hoge_2;
$('.btn_2').click(function(){
    alert($hoge_2);
    alert($moge_2);
    return false;
});

• クリックすると変数が入れ替わるので、「100」→「10」の順でアラートされます

XOR演算子で入れ替える方法

var $hoge_3 = 20;
var $moge_3 = 200;
$moge_3 ^= $hoge_3;
$hoge_3 ^= $moge_3;
$moge_3 ^= $hoge_3;
$('.btn_3').click(function(){
    alert($hoge_3);
    alert($moge_3);
    return false;
});

• クリックすると変数が入れ替わるので、「200」→「20」の順でアラートされます

配列を応用した方法

var $hoge_X = 'ほげX';
var $moge_X = 'もげX';
$hoge_X = [$moge_X, $moge_X = $hoge_X][0];
$('.btn_X').click(function(){
    alert($hoge_X);
    alert($moge_X);
    return false;
});

• クリックすると変数が入れ替わるので、「もげX」→「ほげX」の順でアラートされます

デモの解説記事に戻る