関数がクラスであるかどうかはどのようにして知ることができますか？

Question

私はrendererプロパティを取るReactコンポーネントを書いています。一般に、これは引数のオブジェクトを取り込み、別のReactコンポーネントを返す関数です。しかし、コンポーネントのユーザーがReactコンポーネントクラスを渡すことができるようにしたいと思います。私は、内部関数の中でそのクラスをラップします：もちろん

class MyComponent extends React.Component { 
    render() { 
     const { renderer } = this.props; 

     const renderFn = (renderer.isAComponentClass()) 
      ? (props => <renderer {...props} />) 
      : renderer; 

     return <div>{ renderFn(someArgs) }</div>; 
    } 
} 

、JavaScriptで、クラスでも関数です。 rendererがクラスであるかどうかを確認するにはどうすればよいですか？私はバベル6を使用しています。

私は簡単な返信<renderer {...someArgs} />ができることを知っています。私はこれを避けることができれば、コンポーネントツリーを不必要に膨らませてしまうので、これをやっていません。

Answer 1

正規表現でネイティブクラスを検出することは可能ですが、文字列としての表現が変更されるtoStringメソッドを実装していない限りです。

トランスコードされたコードのクラスとクラスが異なるわけではないため、関数がクラスであるかどうかを検出することはできません。これはプログラマチックにそれらを区別しようとすることさえできない良い理由です。

React.Componentが、これは不必要な制限を置きますので、より良いオプションは

renderer.prototype && ['render', 'setState', ...] 
    .map(methodName => typeof renderer.prototype[methodName]) 
    .every(methodType => methodType === 'function') 

のように、アヒルのテストそこにある

renderer.prototype instanceof React.Component 

と機能/クラスの祖先であるかどうかを確認することが可能ですただし、これらのチェックは正確ではありません。 prototypeプロパティは、場合によっては混乱する可能性があります。クラスが装飾されるとき。クラスがコンポーネントであることを確かめる唯一の方法は、まずそれをインスタンス化することです。

レンダラーの機能とコンポーネントを決して混乱させることができない場合は、たとえばrendererとrendererComponentのプロパティのように、APIはよりクリーンになります。