jsの読み方が分からない

Question

現在CODEPREPでjsを触っています。

ここ

では
下記のようなコードが正解とされていますが、どのような流れでthisに値が入ってくるのか自分には理解できません(m_ _m)

    return this !== hisHand && !this.winTo(hisHand);

これは

    return this, (!== hisHand && !this.winTo(hisHand));
    //もしくは
    return this.(!== hisHand && !this.winTo(hisHand));

通常の return thisもしくはreturn 引数ならまだ理解できます。
このコードの流れがわかる方がいらっしゃれば教えていただきますようよろしくお願いいたします(m_ _m)

Answer 1

まずは、カッコを付けておきましょう。

return (this !== hisHand) && !this.winTo(hisHand);

つまり、返り値は「thisがhisHandと等しくない」かつ「後半のメソッドがfalsyな値を返した場合」にtrue、それ以外の場合はfalseとなります。thisはメソッドを呼ぶだけでなく、通常の変数と同様に式の一部として使うことも可能なのです。

なお、

どのような流れでthisに値が入ってくるのか自分には理解できません

このコードだけでは誰にもわかりません。thisに何が設定されるかは、状況によっては関数の呼び方にまで左右されます。

Answer 2

リンク先は見ていませんが、最終的にreturn にわたるのは true false のどちらかです。

var a = this !== hisHand; // 「this が hisHandと違う場合 true」
var b = !this.winTo(hisHand) //「this.winTo(hisHand)の結果の逆」
var c = a && b // 「a  b 両方trueの場合 true」

【比較演算子 - JavaScript | MDN】
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Operators/Comparison_Operators

【論理演算子 - JavaScript | MDN】
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Operators/Logical_Operators

Answer 3

    return (this !== hisHand) && (!this.winTo(hisHand));

エスパーすると
「あいこではない、かつ、勝ってはいない」かどうか、要するに負けたかどうかですよね

Answer 4

リンク先もちょっと参照できないようなので正確には判断できませんが
thisはその関数自体かもしくはwindowsを返します
書き方によってことなるので詳細がわからないのでなんとも言えません