「!!」+vs[i]の「!!」の意味は何でしょうか

質問

while( i-- ) es[ i ].checked = !!+vs[ i ];
といった文に「!!」があるのですが、
これはどういった意味なのでしょうか。

回答No.2

hitomura · ベストアンサー

多分あなたはこの文の右辺を
( !! ) + ( vs[i] )
と読むものと考えたのでしょうが、実は違います。この右辺は
!( !( +( vs[i] ) ) )
と解釈されます。! については #1 の方が説明されているので、+ のほうを説明します。

めったに使われることはありませんが、単項で使われる + は数値をそのまま返す演算子です。
これは、数値を負にした値を返す単項演算子 - と対になる形で定義されています。従って、結合順はかなり高くなっています。

使い方は以下のような感じですが……
var a;
var b;

a = 1;
b = -a; // b には -1 が入る：下との対比のための行
b = +a; // b には 1 が入る：b = a; と結果的に同じ
……これだとあまり意味がありませんね。実は自分も単項の + を使わなくてはならない例が思いつきませんでした(^^;

お礼

!( !( +( vs[i] ) ) )は
vs[i]を+によって文字列に変換し、!でbool型にしているということですね。
このサンプルの全体は、

<form action="#">
　<p>
　　<select name="myselect" onchange="fuga.call( this, event )">
　　　<option value="1111111111" selected>全てにチェック</option>
　　　<option value="0000000000">全てチェック解除</option>
　　　<option value="1010101010">奇数だけチェック</option>
　　　<option value="0101010101">偶数だけチェック</option>
　　　<option value="1000010100">1、6、8番だけチェック</option>
　　　<option value="0001111111">3番以降全てチェック</option>
　　</select>
　</p>
　<p><input type="checkbox" value="1" name="chk" checked>1番</p>
　<p><input type="checkbox" value="1" name="chk" checked>2番</p>
　<p><input type="checkbox" value="1" name="chk" checked>3番</p>
　<p><input type="checkbox" value="1" name="chk" checked>4番</p>
　<p><input type="checkbox" value="1" name="chk" checked>5番</p>
　<p><input type="checkbox" value="1" name="chk" checked>6番</p>
　<p><input type="checkbox" value="1" name="chk" checked>7番</p>
　<p><input type="checkbox" value="1" name="chk" checked>8番</p>
　<p><input type="checkbox" value="1" name="chk" checked>9番</p>
　<p><input type="checkbox" value="1" name="chk" checked>10番</p>
</form>

<script type="text/javascript">
var hoge = function ( es /*Array Elements*/ ) {
　return function ( ) {
　　var vs = this.value.split( '' ), i = vs.length;
　　while( i-- ) es[ i ].checked = !!+vs[ i ];
　};
};
var fuga = hoge( document.getElementsByName( 'chk' ) );
</script>

while( i-- ) es[ i ].checked = !!+vs[ i ];では0と1で判断するのではなく、
falseかtrueで判断しているということですね。

.checked = ○○でcheckboxにチェックを入れるかどうかを判別するためには○○の部分が
◎数字の0か1
◎falseかtrue
の２通りの使い方しかできず、変数や配列は使うことが出来ない。
例えばwhile( i-- ) es[ i ].checked = vs[ i ];のように
0か1が格納された変数であっても、それでは機能しないので型を変換してある。
というのが使った理由なのでしょうか。

また、
while( i-- ) es[ i ].checked = !!0;
のように数値に直接やっても動くのに（全部チェックが付くことになりますが）
while( i-- ) es[ i ].checked = !!vs[ i ];
配列に直接やると動かないのですね。
変数には直接！を使えても配列には使えないということでしょうか。

回答No.4

notnot

＞文字列なら何でも真偽するとtrueになるということでしょうか。

文字列の場合の真偽値は、長さ0の文字列の場合だけfalse、つまり !!"" だとfalseになります。
詳しくは、http://www2u.biglobe.ne.jp/~oz-07ams/prog/ecma262r3/9_Type_Conversion.html を参照。

!!"0" も true ですが、これを false にしたいということで !!+ と一旦数値に変換してます。

お礼

良く分かりました。
ありがとうございます。

回答No.3

think49

!! は Boolean() のショートハンドで + は Number() のショートハンドです。

Boolean(Number(value)) === !!+value;

+ を利用する理由は文字列の '0' を false と判定して欲しいためと考えられます。

var value = '0';
console.log(!!value); // true
console.log(!!+value); // false

お礼

ありがとうございます。
自分でも試してみました。
var value = '0';
console.log(!!value); // true
console.log(!!+value); // false
を実行しFirebugのコンソールを見て確認しました。
試していて疑問になったところがあるのですが、
文字列でなく数値でやると結果が変わるのですが、
var value2 = 0;
console.log(!!value2); // false
console.log(!!+value2); // false
console.log(value2); // 0
文字列なら何でも真偽するとtrueになるということでしょうか。

回答No.1

hanabutako

!!で元の値の方からbool値に変換しているのでは。
vs[i]に何が入っているか知りませんが、普通は値が入っていると!vs[i]でfalseのbool値になり、!!vs[i]でtrueのbool値になりますので。
こうなっていると、うっかりes[i].checked == trueと書いても、vs[i]の値の有無に応じてtrue/falseとなりますが、!!をしていないと、うっかりes[i].checked == trueと書いたら、方が違うのでそもそも比較できないか、必ずfalseになると思います。(JavaScriptの仕様としてどちらの動作をするのかは調べていません)

お礼

迅速な回答ありがとうございます。
型を変換するために使うものだったのですね。
まだ理解できていませんが、もっと調べてみます。