【javascript】真偽値の反転方法

「hoge =!hoge」という表示を見つけてどういうことだと思ったので備忘録

真偽値の反転

変数に真偽値を入れた場合に!変数と指定することで真偽値の反転を行うことができるよう

var hoge = false;// false
hoge = !hoge;// true

!って「ビックリマーク」以外になんて呼べばいいのかわからなかったけど「エクスクラメーション」とか「感嘆符」辺りで検索かければ引っかかるわ

真偽値の反転を利用した例

せっかくなので真偽値の反転を利用したサンプルコードを作ってみた
ボタンをクリックしたら背景を赤くするソースコード

<div id="btn">ボタン</div>
<script>
var boolean = false;
var btn = document.getElementById('btn');
btn.addEventListener('click', function() {
	console.log(boolean);// まだfalse
	boolean = !boolean;// 真偽値の反転
	console.log(boolean);// 反転してtrue
	if (boolean) {
		this.style.backgroundColor = 'red';// クリックしたら背景を赤くする
	}else{
		this.style.backgroundColor = 'transparent';// 背景を元に戻す
	}
}, false);
</script>