React と React Native のスレ (481ﾚｽ)
上下前次1-新
355(1): 2022/09/26(月)22:42 ID:ikr92+JD(2/2) AAS
>>354
ごめんクラスコンポーネントと関数コンポーネントの違いは分かってるんだ
例えば、1+1を計算する関数をクラスベースで定義すべきか関数ベースで定義すべきか
的なことを知りたかった！
356: 2022/09/26(月)22:56 ID:lxhy0Qxo(1) AAS
JS/TSでクラスはほっとんど使わない
使うのは独自のErrorクラスくらいだな
メソッドというより関数をプロパティとして持つオブジェクトはよく使う
でも基本は単なる関数
357: 2022/09/26(月)22:59 ID:rxxJbSNv(1/2) AAS
>>355
書いてくれてるだろ
ちゃんと読もうよ
358: 2022/09/26(月)23:21 ID:rxxJbSNv(2/2) AAS
ああ、ごめんコンポーネントの話じゃなかったのか
359(3): 2022/09/26(月)23:22 ID:tIU7Oyti(1) AAS
React実践の教科書、2021
この本には、クラスは出てこない。
すべて関数
360(1): 2022/09/27(火)12:54 ID:CMfXpwKQ(1/5) AAS
なるほどなるほど
仕事でcobolとvbaしか使ったことなかったからオブジェクト指向的な記述自体馴染みなかったわ
Reactに関しては、本やらネットやらで関数しか使わねみたいな記述は多く見てたんだけど
今配属されてるプロジェクトではクラスベースの書き方が多く見られたから
現場では何だかんだ使うんだ！って勝手に納得してたけどそうじゃないのね
元々phpやらjavaやらやってた人たちが分かりやすいからって使ってる感じぽいな
361(1): 2022/09/27(火)13:46 ID:t32oMnpk(1) AAS
JSのクラスと
Reactのクラスコンポーネントと
Reactの関数コンポーネントの区別出来てる？
ちなみにReactのクラスコンポーネントはオワコンだけどね
362(2): 2022/09/27(火)14:04 ID:CMfXpwKQ(2/5) AAS
>>361
・jsのクラス…いわゆるオブジェクト指向の考え方におけるクラス。継承やらなんやらできる。但し、プロトタイプベースであるjsではほとんど使われない
・クラスコンポーネント…super(constructor)みたいな書き方してstate管理するやつ。thisとか使いまくって見通しクソ悪い上にhooks使えないゴミ。progateや公式チュートリアルはこの書き方してるので初心者は騙される。
・関数コンポーネント…スタンダードなreactコンポーネント。読みやすい。神。
こんなイメージだけど合ってる！？
363: 2022/09/27(火)15:39 ID:D1kdTDEr(1) AAS
>>362
Reactのクラスコンポーネントは無くなるんであれこれ考える必要ない
関数コンポーネントの一択だ
JSの方は好みだな
364(1): 2022/09/27(火)15:58 ID:aOp1T7nJ(1) AAS
>>360
> Reactに関しては、本やらネットやらで関数しか使わねみたいな記述は多く見てたんだけど
> 今配属されてるプロジェクトではクラスベースの書き方が多く見られたから
> 現場では何だかんだ使うんだ！って勝手に納得してたけどそうじゃないのね
Reactだから関数しか使わないということはないという認識
本やネットで見かけるサンプルコードはそのへんは主眼じゃないから参考にならんでしょ
クラスベースを頭ごなしに否定するものではないと思うよ
365: 2022/09/27(火)16:41 ID:MQqAKvI3(1) AAS
Reactコンポーネントに関してはクラスベースを頭ごなしに否定して構わない
366: 2022/09/27(火)16:48 ID:CMfXpwKQ(3/5) AAS
>>364
頭ごなしに否定する気はないんだけど
（jsの）クラスベースの記述するメリットってどういうとこがあるの？
配属されたプロジェクトのコードを初心者目線で見てクラスベースと関数ベースが混在して読みにくいな、って印象なのよ
367: 2022/09/27(火)17:25 ID:fOqsMNTu(1/3) AAS
Reactに関しては関数コンポーネントしか使わないけど、それ以外の部分では臨機応変に使うのみよ。まぁそれでもclassの出番はかなり限定されるけど……
368(1): 2022/09/27(火)17:28 ID:YFL0VkhR(1) AAS
プロジェクトメンバーにどうして混在してるのか聞いてみた？
369: 2022/09/27(火)17:29 ID:fOqsMNTu(2/3) AAS
jsにおけるclassの出番って、大量に作成し、なおかつ副作用があるオブジェクトがある場合くらい……。
370: 2022/09/27(火)18:13 ID:dJevJ7EZ(1/2) AAS
クラスコンポーネントは公式に非推奨扱いじゃね
371: 2022/09/27(火)18:15 ID:397xSubl(1) AAS
話の流れで関数コンポーネントかクラスコンポーネントかの話は終わってるのは分かるっしょ
372: 2022/09/27(火)18:20 ID:dJevJ7EZ(2/2) AAS
Reactなので将来容赦なくクラスコンポーネントが無くなるかサポート切ると思う
373(2): 2022/09/27(火)20:04 ID:CMfXpwKQ(4/5) AAS
>>368
うん
「本当はよくないんですけどね～～」
的なことを言ってたよ
他にも
・propsのバケツリレー
・コールバック関数使って 子→親へのprops逆流（これが一番酷い）
・アロー関数とnamed functionの混在
・typeとinterfaceの混在
・mui使ってるのに無駄にemotionでカスタムコンポーネント作成
等々………
どの現場もこんな感じなのかなぁとは思ったりするけど
やっぱ立ち上げ段階でコーディングルールやら設計やらある程度固めとかないとスパゲッティ化するんだね
374(1): 2022/09/27(火)20:20 ID:6DdS+dLy(1) AAS
プロジェクトメンバーが現状を問題と捉えてるならどういう方針でコードを
書いていけばいいかお伺いを立ててそれに従うべきでしょ
もちろん自分の意見があるならそれも伝えて
375(1): 2022/09/27(火)20:22 ID:fOqsMNTu(3/3) AAS
>>373
Java屋PHP屋Cobol屋の混成チームでコーディングルールも設計もフワフワとか地獄やん……。
PMがフロントエンド舐めてたのかな。
376: 2022/09/27(火)20:39 ID:CMfXpwKQ(5/5) AAS
>>374
リモートだけどSESだから元請けに当たる人に対して
ガチでWEB開発業務1ヶ月目の俺からは意見しにくいんよ、、(笑)
スタイリングぐちゃぐちゃだったのはさすがに言ったけど
でも言うとこは言ったがいいね。ありがとう。
>>375
アジャイルってこんなもんなんじゃないの？知らんけど(笑)
でもしっかりしたreact案件でちゃんと現場のこと学びたいとは思うわ
377: 2022/09/27(火)22:23 ID:/UUTRmF2(1) AAS
>>362
jsでクラス使わないことは多いが、だからといって今時 __proto__ なんて直接使わないから
プロトタイプベース云々は関係ない。
378: 359 2022/09/27(火)23:17 ID:oW3s344K(1/2) AAS
>>373
React実践の教科書、2021
基礎はこの本で良い。3日で読める
propsのバケツリレーは、
グローバルState である、useContext を使うと書いてある
これ以上に複雑なものは、Redux, Recoil, Apollo Client など
useMemo など、use何々にはどういう機能があるか、すべて見た方がよい
379: 359 2022/09/27(火)23:29 ID:oW3s344K(2/2) AAS
Reactビギナーズガイド ――コンポーネントベースのフロントエンド開発入門
Stoyan Stefanov, 2017
この本には、createClass と書いてあるけど、
2017年6月には非推奨になっている
var MyComponent = React.createClass({
render: function() {
return React.DOM.span(null, "カスタムコンポーネント");
}
});
380: 2022/09/27(火)23:53 ID:BMrl8a7V(1) AAS
なんでそんなにクラスコンポーネントの話にこだわるの？
381: 2022/09/28(水)20:45 ID:KHG5QcXL(1) AAS
presentationalとcontainerに分けて書くといいよ、って本かなんかで読んだことある。今のプロジェクトでも実践されてる。
で、その辺の構成の都合上、仕方なくコールバック関数使ってpropsの値を子→親に伝播させてるけど普通なの？
一般的には状態管理ライブラリ使うべきだと思ってるけど認識違う？
382(1): 2022/09/28(水)21:57 ID:Km2fmn1T(1) AAS
プレゼンテーショナルとコンテナに分けるのはRedux全盛時代の流行でhooks以降は廃れた
それとは別に親から子にコールバック渡すのは極めて普通
useReducerなんかそういう使い方がほとんどだろ
その親がほとんどルート(いわゆるAppコンポーネント)に近いくらい上位にいるならそれはグローバルステート
383: 2022/09/28(水)22:11 ID:0Dahyjoe(1) AAS
グローブステートにRxで変更通知でどうですか？
384: 2022/09/28(水)22:46 ID:HuYE1qae(1) AAS
>>382
へー！なるほど！
その経緯は知らんかったわ！ありがとう
propsの大原則として親→子→……
があって、それを解消するためのグローバルステートと状態管理ライブラリ、という理解なんだけど
グローバルステート使わずに普通にコールバックして直接、
子→親、孫→親みたいな渡し方してるのに違和感感じてたのよ
現場では割と普通のことなのね
上下前次1-新書関写板覧索設栞歴
あと 97 ﾚｽあります
ｽﾚ情報 赤ﾚｽ抽出 画像ﾚｽ抽出 歴の未読ｽﾚ
ぬこの手 ぬこTOP 0.007s