[2週目5日目授業]JavaScript-3


1.学習ログ


-復習
<input type="button" value="Night" onclick="
  let btn = this;
  if(btn.value === 'Night'){
     document.querySelector('body').style.backgroundColor='black';
     document.querySelector('body').style.color='white';
     btn.value = 'Day';
  }
     else{
        document.querySelector('body').style.backgroundColor='white';
     document.querySelector('body').style.color='black';
     btn.value = 'Night';
     }

  ">
==は比較演算子であり、より正確な値を指す場合に使用されます.=は代入演算子=の後の値です.
繰り返し文と並べ替え文
<h1>Array+Loop</h1>
<script>
   topics = ['html','css','js','python'];
   for(let i=0; i<topics.length; i=i+1){
      document.write('<li>'+topics[i]+'</li>');
   }
 </script>
このように記入することもできます.
なお、i=i+1はi++と略すこともできる.
上のコードでは、装飾部分も以下のように書くことができます.
<script>
   let topics2 = ['html','css','js'];
   for (i=0;i<topics2.length;i=i+1) {
      //document.write('<li>'+topics2[i]+'</li>');
      document.write(`<li>${topics2[i]}</li>`);
   }
</script>
-今日学んだこと
昨日「a」のラベルの色が変わらないコマンドを学びました.
簡単なコマンドはdocumentです.querySelector All(“a”)
そうすると、aラベル全体が選択され、色が変わらず、ボタンにエラーが発生します.
オールでも1つの値しか返さないからです.
したがって、「a」がリストされている場合は、対応するすべての値でスタイルを変更する必要があります.
forを使うべきです.
 let as = document.querySelectorAll('a');
 for (let i=0;i<as.length;i++){
    as[i].style.color='black'; //as배열에 있는 값을 하나하나 꺼냄:a[i]
 }
as宣言時の意味をletで書き,forで条件文を書く.
そして,{}からas配列の値を取り出す場合は,対応するスタイルを指定すればよい.
-番外...
「2000個のボタンを同時に押したい」という条件が出たら、
上と同じように、letでforを宣言して書けばいいです.
ボタンは「input」タブで作られています.
let inputs = document.querySelectorAll('input');
//이때 선언했기 때문에 inputs을 입력해 보여달란 명령을 내리면 input에 있는 값 하나하나를 보여줌.
for(i=0;i>inputs.length;i++){
	inputs[i].click()
}
すると2000個のボタンが選択されます.
次に、暗いモードと日モードを1つのボタン+に設定し、「a」マークのフルカラーを同時に変更します.
しました.コード統合は以下の通りです.
 <input type="button" value="Night" onclick="
    let btn = this;
    if(btn.value === 'Night'){ 
      document.querySelector('body').style.backgroundColor = 'black';
      document.querySelector('body').style.color = 'white';
      let as = document.querySelectorAll('a');
      for (let i=0;i<as.length;i++){
      as[i].style.color='white';
      }
      btn.value = 'Day';
      }
      else{
      document.querySelector('body').style.backgroundColor = 'white';
      document.querySelector('body').style.color = 'black';
      let as = document.querySelectorAll('a');
      for (let i=0;i<as.length;i++){
      as[i].style.color='black'; //as배열에 있는 값을 하나하나 꺼냄:a[i]
      }
    btn.value = 'Night';}
    ">
しかし、このようにすると、コードが長すぎて可読性が悪いという問題が発生します.
コードはできるだけ簡潔に書いたほうがいいので、ここでは関数機能を使います.
関数とは?
Meth.random();オブジェクト.関数()はこのように構成され、結果値が表示されます.
これらのオブジェクトと関数は、開発者が作成した文です.上の式を実行して、数字をランダムに出します.
jsで結果値を作成できるのはfuncrion、すなわち関数宣言です.
function name([param[, param[, ... param]]]) {
  statements
}
では、前に作ったジドラン式を整理してみましょう.
<script>
            function Night(){
          document.querySelector('body').style.backgroundColor = 'black';
         document.querySelector('body').style.color = 'white';
         let as = document.querySelectorAll('a');
         for (let i=0;i<as.length;i++){
            as[i].style.color='white';
            }
         }

         function Day(){
         document.querySelector('body').style.backgroundColor = 'white';
         document.querySelector('body').style.color = 'black';
         let as = document.querySelectorAll('a');
         for (let i=0;i<as.length;i++){
            as[i].style.color='black'; //as배열에 있는 값을 하나하나 꺼냄:a[i]
         }
      }
</script>

<input type="button" value="Night" onclick="
 let btn = this;
if(btn.value === 'Night'){ 
  Night();
btn.value = 'Day';
}
else{
  Day();

btn.value = 'Night';}
">
inputラベルの中は明らかに減っている様子です.
functionとして定義され、名前();加入すれば、同じように実現します.
名前の後ろにカッコを付けることもできますが、計算された値を数値で表すこともできます.
  <h1>VAT</h1>
<script>
   function 부가세계산(가격,부가세율){ //매개변수, parameter
      let 부가세 = 가격 * 부가세율;
      //console.log(부가세);
      return 부가세;
   }
   console.log(부가세계산(2000,0.1)); //인자, argument, 입력값

</script>
付加税計算()このように表すことができますが、そうであればletで数字を指定して結果を出すべきです.
letを使用して数値を指定すると、いくら数値を追加しても計算できます.
letを除いて、定義()の値(ex.ここでは価格、付加税率)
{}ではletのみを使用して結果値を計算します.
計算機能とコンソールに出力する機能を一緒にするよりも、個別に表示します.
なぜなら、関数として宣言された計算文に単独で乗算または加算された式が作成されても、結果値にはNaN(どういう意味か分からない)が表示されるからです.
例えば、付加税計算(2000、0.5)*100;作ると値段の意味がありません
だから付加価値税は数値で、公式で計算することができます.
コンソールの場合.ロゴを書きたいなら、上のようにconsole.log(付加税計算(2000,0.1);
書けばいいです.
+オブジェクト指向の学習を追加しました.
元のデータをインデックスとして識別し、オブジェクトを名前で識別できます.
let Student = ['egoing','duru'];
         console.log(Student[0],Student[1]);
次に、「」をコンソールにリストします.オブジェクトに対する低い「」値はStudent[0],Student[1]である.
入力しなくても名前で入力できる定義.
let Memember = {developer:'egoing',desiger:'duru'};
         console.log( Memember.developer, Memember.desiger);

2.難点と解決策


前にしばらく勉強したが、===と=の違いが分からないので、授業でもう一度聞いた.
「==は比較演算子であり、より正確な値を指す場合に使用されます.=は代入演算子=の後の値です.」
私は今忘れないと思います.
リストされた値をfor(条件){}の{}に最初の宣言letの値を書いて[i]と書くのは覚えていませんが、今はよくできると思います.スタイルやその他の結果値を表す数式を適用する場合は、
for(i=0;i>inputs.length;i++){
	inputs[i].click()
}
forの前にletを宣言しなければならないと書きます.

3.勉強の心得


ますます困難になっている文では、突然、これらの条件で文を入力するタスクがあります.
for反復文を書くことは知っていますが、具体的にどう書くか分かりません.
再度結果を見て、理解しましたが、自分で文法をマスターして書くためには、かなりの努力が必要です.
少し萎縮するのも事実ですが、少しでも問題を解決すれば、前に悩んでいたことが一気に解決できると信じています.