Object


この授業はとても難しい.オブジェクトの理解
客体は機能が増えたときにこの機能を縛って保管する役割を果たした.
配列は情報の容器で、順番に情報を整理する機能です.
それに比べてobjectは名前順にデータを整理する機能です.
情報を順番に格納=array
ラベルで保存=object
カッコを使用してオブジェクトを作成できます.
<script>
        var coworks = {
            "programer": "young",
            "designer": "inn"
        };
</script>
この式を説明すればyoungというデータはプログラマーの名前で命名されたものと見なすことができる.
同様にifnというデータもデザイナと名付けられています.
この情報を取得するためには,ネーミング方式を主とすることが考えられる.
<script>
        var coworks = {
            "programer": "young",
            "designer": "inn"
        };
         document.write("programer : " + coworks.programer + "<br>");
        document.write("designer : " + coworks.designer + "<br>");
</script>
こちらはdocumentwrite(「ネーミングスペース:」+object.ネーミングスペース);を行うと、対応する値をエクスポートできます.
紛らわしいのは「変数」NameTakeの実行中銀はオペレータのエセスの役割を果たした.
つまり、オブジェクト内のデータにアクセスできます.
このメソッドを使用して、生成されたデータにアクセスします.
ただし、既に作成したobjectに追加したい項目がある場合は、個別に設定できます.
<script>
        var coworks = {
            "programer": "young",
            "designer": "inn"
        };
         document.write("programer : " + coworks.programer + "<br>");
        document.write("designer : " + coworks.designer + "<br>");
        coworks.bookeeper = "ming";
        document.write("bookeeper : " + coworks.bookeeper + "<br>");
        coworks["data scientist"] = "bewhy";
        document.write("data scientist : " + coworks["data scientist"] + "<br>");
</script>
そして、コックス.データ科学者のようにスペースがあれば、文法に間違いがあります.
cowrks[「データ科学者」]このように処理すれば、他の文法のようにスペースを囲むこともできます.

オブジェクトの反復/オブジェクトの繰り返し


以下にオブジェクトの作成と作成を示します.
    <script>
        const sayhi = {
            "spain": "hola",
            "korea": "annyoung",
            "english": "hello"
        }
        document.write("spain : " + sayhi.spain);
    </script>

次のように繰り返します。


ここでkey値は、私たちが望むデータへの鍵として機能します.
つまり、説明するなら
ホラを抽出するために、sayhiでスペインの身長値と命名されました!
したがって、キー値をより簡単に抽出したい場合は、以下のコードで知ることができます.
    <script>
        for (const key in sayhi){
            document.write(key+'<br>')
        }
    </script>
では、次の値が表示されます.

左港のキー値を外した場合、右港名ラベルを貼った実際のデータ値はどのように抽出されますか?
以前に使用した配列を利用して表すことができます.
  <script>
    for (const key in sayhi){
        document.write(sayhi[key]+'<br>')
    }
</script>
これにより、以前data scientiisterを作成したときに使用したカッコを使用すると、右港湾を抜くことができます.
この2つを同時にインポートするには、「左キー」とobject[key]を使用します.デザインは以下の通りです.
ここからこの文章を全部引き出して繰り返したいなら
for(var keyin object)構文を使えばいいです.
    <script>
        for (const key in sayhi){
            document.write(key+ ':' + sayhi[key]+'<br>')
        }
    </script>
これを行うと、次のように計算されます.

関数の定義


以前に戻る
私たちが定義したobject「sayhi」を使用して、次のように繰り返し関数を適用します.
<script>
    sayhi.showall2 = function(){
    for(var key in this)
        document.write(key + ' : ' + this[key] + '<br>')
    }
    sayhi.showall2();
</script>
値段は以下のとおり

しかし自身もshowall 2の影響を受けているため、対応するコードもそのまま露出してしまう.
このような状況を減らすためにifを使用することができます.

利用対象


まず2つの形式で関数を定義します.
  • 関数名(){論理};
  • var関数名=関数(){論理};
  • 以前に作成した論理を表示すると、機能は4回繰り返されます.
    それらをオブジェクトに組み合わせて、関数を最小限に抑えましょう.
    まず、既存のコードは次のとおりです.
      <script>
        function AsetColor(color) {
          var alist = document.querySelectorAll('a');
          var i = 0;
          while (i < alist.length) {
            alist[i].style.color = color;
            i = i + 1;
          }
        }
        function bodysetColor(color) {
          document.querySelector('body').style.color = color;
        }
        function BackgroundColor(color) {
          document.querySelector('body').style.backgroundColor = color;
        }
        function buttonhandler(self) {
          var target = document.querySelector('body');
          if (self.value === 'night') {
            BackgroundColor('black');
            bodysetColor('white');
            self.value = 'day'
            AsetColor('powderblue');
          } else {
            BackgroundColor('white');
            bodysetColor('black');
            self.value = 'night'
            AsetColor('green');
          }
        }
      </script>
    この式ではfunctionを次のように再パッケージします.
    <script>
        var Alinks = {
          setColor: function (color) {
            var alist = document.querySelectorAll('a');
            var i = 0;
            while (i < alist.length) {
              alist[i].style.color = color;
              i = i + 1;
            }
          }
        }
        var Body = {
          setColor: function(color){
            document.querySelector('body').style.color = color;
          },
          setBackgroundColor:function(color){
            document.querySelector('body').style.backgroundColor = color;
          }
        }
        function buttonhandler(self) {
          var target = document.querySelector('body');
          if (self.value === 'night') {
            Body.setBackgroundColor('black');
            Body.setColor('white');
            self.value = 'day'
            Alinks.setColor('powderblue');
    
          } else {
            Body.setBackgroundColor('white');
            Body.setColor('black');
            self.value = 'night'
            Alinks.setColor('green');
          }
        }
      </script>
    
    機能はまったく同じで、外観も同じです.
    仕事のやり方では、意味を持って減らして、コードがきれいになりました.
    今回一番大切なのはkeyとobjectの理解です.
    すなわち、機能を簡素化するためには、以下の手順が必要である.
    var関数名=function(機能){
    論理1、論理2、論理3
    }
    このようにして関数を組み合わせることができます.