JavaScriptのショートハンドがわかりません

Question

function methodSample(name) {
    var win = getHogeHoge(name);
    win && !win.closed && win.close();
}

win && !win.closed && win.close();

というショートハンド部分が見慣れず、よくわかりません。

私の理解は以下です。
①winがnull・空文字かの存在チェックをする。
②null・空文字でなければ、win.closedのチェックをする
③win.closedがfalseであれば、win.close()を実行する

合っておりますでしょうか？

よろしくお願い致します。

【追記】
記載不足、また返信遅くなり失礼致しました。

window.wins = { };
というものがあり、
他の処理で、
var win = window.open(hoge,name);
window.wins[name] = win;
とセットされており、

getHogeHoge(name)で、
window.wins[引数]を返します。

よろしくお願い致します。

Comments

[miyabi_pudding]

getHogeHogeが何を返すかがわらないとなんとも言えません。
何を返す想定のメソッドでしょうか？

[circular2016]

ご指摘ありがとうございます。

質問に追記させて頂きました。

[think49]

なぜ空文字が出てきたのかが謎ですが、期待通りに動かないケースはありますね。

Answer 1

truthy

win && !win.closed && win.close();

...中略...

①winがnull・空文字かの存在チェックをする。
②null・空文字でなければ、win.closedのチェックをする
③win.closedがfalseであれば、win.close()を実行する

合っていません。

1. win を truthy 判定する
2. win が truthy なら、!win.closed === true を判定する
3. !win.closed === true が true なら、win.close() を実行する

truthy とは「Boolean型に変換後、true となる性質」を指し、掲示された「null, 空文字」以外にも条件があります。

• 7.1.2 ToBoolean - ECMAScript® 2019 Language Specification

getHogeHoge()

var win = getHogeHoge(name);
win && !win.closed && win.close();

getHogeHoge() が「null または window オブジェクトを返す関数」ならば、このコードは期待通りに動作するでしょう。
2行目の win は truthy である時点で「window オブジェクトである事が確定」し、以降の式がエラーを返さない事が保証されます。

変数 win に入りうる値を確認するには、前述のコードに注目する必要があり、miyabi_takatsuk さんが指摘しているのはそういう意味です。

もしも、getHogeHoge() が「null または空文字、または、window オブジェクトを返す関数」であるならば、質問者さんの見解はこのコードにおいては正解ですが、我々回答者にはその事実が伝わっていません。
適切な回答を得るには、回答に必要な情報を含めるように注意する必要が有ります。

Re: circular2016 さん

Answer 2

自分が論理演算子の勉強してたときに書いた記事です。参考にどうぞ。
&& や || を使う条件分岐の理解と使用例。

Answer 3

win && !win.closed && win.close();

論理演算として考えましょう。

win && !win.closed && win.close();
===    ===========    ===========
[1]    [2]            [3]

• [1] が真なら [2] を評価し、偽なら 以降、||演算子 や ; までは評価しない
• [2] も真なら [3] を実行し、偽なら 以降、||演算子 や ; までは評価しない

①winがnull・空文字かの存在チェックをする。

②null・空文字でなければ、win.closedのチェックをする
③win.closedがfalseであれば、win.close()を実行する

① 変数 win が オブジェクトなら真, nullやundefined なら偽
② window.closed プロパティが true でないなら真, trueなら 偽
③ window.close() を実行

①、②では真偽の２値を考えるのが正しい解釈と思います。

Answer 4

こんにちは、 circular2016 さん

基本的には正しい理解だと思います。
もう少し厳密に言うと、「存在チェック」の部分はfalsyな値が対象になるので、 該当の値は、nullか「空文字」だけではありません。以下URLがfalsyについてまとめられているので、よろしければご確認ください。

Falsy

参考になれば、幸いです。

Answer 5

あってるとおもいます。