小道具をチェックする方法に違いはありますか？

Question

私はいつも違った読みやすさの方法でコードを書いていますが、最近私のReact-Reduxアプリケーションにif文を書いています。このように私の関数を書く上で機能上の違いはありますか？このサンプルでは、​​LoginコンテナのcomponentWillReceivePropsは、ユーザーのIDがRedStoreストア（mapStateToProps経由でアクセスされる）に定義されているかどうかを確認します。nextProps.isLoggedInがtrueの場合、ユーザーはアプリケーションのルートルートにプッシュされます。

以下に書かれた2つのコードスニペットは同じように動作しますが、それらが同義の方法で機能しないエッジケースがあるかどうか不思議です。私のコンテナの

componentWillReceiveProps(nextProps) { 
    if (nextProps.isLoggedIn) { 
     browserHistory.push('/'); 
    } 
    } 

componentWillReceiveProps(nextProps) { 
    !!(nextProps.isLoggedIn) && browserHistory.push('/'); 
    } 

connect

対部分：

export default connect(
    state => ({ 
    isLoggedIn: state.auth.identity, 
    }), 
    { login }, 
)(Login); 

そして、私の減速で、identityのデフォルトparamがnullです。ユーザーが正常にログインすると、identityの値は、認証バックエンドからの応答として返されるオブジェクトに更新されます。

Answer 1

論理演算子&&と||は、short-circuiting evaluationを使用します。つまり、最初の式が特定の値に評価された場合、2番目の式を評価しません。 &&で

• 最初の式がfalsyある場合、第二の式は評価されません。 ||で

• 最初の式がtruthyある場合、第二の式は評価されません。

これらは、ifの文を削除し、コードをより機能的にするために使用することがよくあります。あなたの特定のケースで

---

、nullので、falsy値である：

if (nextProps.isLoggedIn) { 
    browserHistory.push('/'); 
} 

はまったく同じ出力された人：提供される発現がある場合

nextProps.isLoggedIn && browserHistory.push('/'); 

if statementsは、ステートメントを実行します真実なので、彼らは評価するために同じルールを使用します。 ifを使用する主な違いは、式だけでなくステートメントを評価できることです。たとえば、&&または||の2番目の部分にvarを宣言することはできません。