反応とは?



🙈 文章が少ない原因


Javascriptでtodo listを作成した後、モジュール化を試みたことがありますが、dependency errorのため、この2日間は大変でした.リレーショナルマップの描画が正しくないため、すべての場所でtodosを参照する問題が発生し、スキャンも分離されていません.MVCモードによる関係図のモジュール化を再度試みたが,render内部参照todoListというdom APIで依存周期の問題が発生した.
私自身の哲学が含まれていますが、それをモジュール化するのは難しいです.最初はどのように細分化するかを考えていましたが、ループ、let、constキーワードに依存する多くの問題に直面し、多角的にモジュール化を考えるべきだと思いますので、このようなモジュール化の反応を解決することができることを期待しています.△私は3回しか授業を受けませんでしたが、私が直面した問題を考慮して授業を受けます.

🙊 だからReactは何ですか。


reactionは、ユーザーインタフェースを作成できるJavaScriptライブラリです.だからJavaScriptがもっと楽しくRECTを学ぶことができることを知っています...!(知っているだけ見られるから)
Reactは宣言型で構成部品ベースの特徴を持つ.宣言プログラミングは、「what」に焦点を当てることを意味します.つまり、コマンドプログラミングのように、「ここでこうして、そこでそうします」ではなく、「これをします」を一つ一つ詳しく教えてくれます.言い換えれば、あなたは「何をするか」に興味を持っています.
素子ベースとは,React公式サイトで「自己管理状態のパッケージ素子」を見ることができる.先ほどお話ししたモジュール化のように、再利用可能な小さな機能単位です.これらの構成部品を組み合わせることで特定の機能を作成することができ、Reactはこれらの構成部品を合成します.しかし,すべての反応素子は,自分のpropsを処理する際に純粋な関数のように動作しなければならない.

🙉 React.createElement, JSX


👉React.createElement


React.createElementは、与えられたパラメータに基づいて新しいReact Elementを生成する.このcreateElementには、タイプ、props、children情報が含まれている必要があります.では、このタイプの道具は子供は何ですか?
React.createElement({
    type : 'body',
    props: {
    	className: 'sectionRoot',
        children: [
        	{type: 'h1', props: {children: 'heading'} },
          	{type: 'p', props: {className: 'description'} },
        ]
    },
})
上のコードはcreateElementで新しい要素を生成します.typeパラメータはhtml tag、react component type、react fragment typeであってもよい.propsにはclassまたはサブ要素情報が含まれます.JSXは「反応元素をより簡単に作ることができるか」に由来する.JSXを使わなければならないわけではありませんが、使いやすくなったので、ほとんどがJSXを使っています.

👉JSX (JavaScript XML)


JSXはJavaScriptを拡張した構文で、createElementのように応答要素を生成します.JSXはcamel case property命名規則を使用する特徴がある.
class Hello extends React.Componenet{
  return (
  	<button type={type} aria-label={label}>
      <svg width={30} height = {30} viewBox ="0 0 30 30" fill=none"></svg>
	</button>
  );
}
    
上のコードはJSXですが、読みやすさがいいのではないでしょうか.
JSXの特徴は、createElementよりも少ないコードを書くだけで反応ユニットを作成でき、サイト間スクリプト(XSS)攻撃を防ぐことができることです.これは、すべての値をレンダリングする前にエスケープ(特定の文字をhtmlに変換する動作)を行うため、明示的に記述されていないコンテンツはレンダリングされないため、セキュリティを維持できます.ただし、JSXはバーベルでcreateElementにコンパイルする必要があります.

n/a.結論


このような反応庫は重複を解消できるという利点がある.たとえばhtmlが同じコードを使用する場所が異なる場合は、コピーと貼り付けが必要です.しかし反応器ではモジュール化されているので、持ってきて使うだけでいいです.本当に反応を学んで、不思議に思って、仕事の効率を最大化することができます.さらに,反応動作の仕方が非常に不思議であるため,次の位置決めではdiffingアルゴリズムについて議論する.