webフロントエンド-9-jsタイマー、js関数、変数とパラメータの問題


jsタイマー
JavaScriptを使用することにより、関数が呼び出された直後にコードを実行する代わりに、設定された時間間隔の後にコードを実行する能力があります.私たちは時間貸し事件と呼びます.
タイマーのjavascriptにおける役割
1、アニメーションを作る2、非同期操作
タイマーの種類と文法
set Interval()-間隔で指定されたミリ秒数で指定されたコードを継続的に実行します.
setTimeout()-指定のミリ秒数を一時停止して指定のコードsetInterval()とsetTimeout()はWindowオブジェクトの2つの方法です.
    :
    setTimeout            
    clearTimeout            
    setInterval          
    clearInterval           

  var time1 = setTimeout(myalert,2000);
  var time2 = setInterval(myalert,2000);
  /*
  clearTimeout(time1);
  clearInterval(time2);
  */
  function myalert(){
      alert('ok!');
  }

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>   title>
head>
<body>
<script>
    /*
        1.      setTimeout
              :setTimeout(    ,    (  ))
                           (  )
                 
                   clearTimeout(           )
        2.      setInterval()
              :setInterval(    ,    (  ))
                            
             :          ,        ,             
            clearInterval(             )
    */
    function demo(){
        console.log('     ')
    }

//    setTimeout(function(){
//        console.log('        ')
//    },3000)

//    setTimeout(demo,3000);

    var i=0;
    var set=setInterval(function(){
        console.log("       ");
       // i++;
    },2000);
    console.log(set);
    setTimeout(function(){
        //     
        console.log("       ")
        clearInterval(set);
    },6000);

script>
body>
html>

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>  title>
    <style>
        #item1{
            width:50px;
            height:50px;
            background:green;
        }
    style>
head>
<body>
    <div id="item1">div>
    <script>
        //       
        var oDiv=document.getElementById('item1');

        //            div       
        var i=50;
        var set=setInterval(function(){
            //   500    div    1
            i++;
            oDiv.style.width=i+'px';
            oDiv.style.height=i+'px';
            //  div     200          
            if(i==200){
                clearInterval(set);
            }
        },33);
    script>
body>
html>
js関数
*一つ目は、function文で関数を定義することです.
function abc(){
    alert('abc');
}
*2番目は、式で関数を定義することです.
var     = function\(  1,  2,…\){   };

//  :
//  
    var add = function\(a,b\){
        return a+b;
    }

    //    
    document.write\(add\(50,20\)\);

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>js         title>
head>
<body>
<script>
    // 1.  function         
    //                              
    //         
     //     
    //demo();
//    function demo(){
//        alert('      ');
//    }

    // 2.          (    )
    //                    

    var demo1=function(){
        alert('      ');
    };
    console.log(demo1);
    demo1()

script>
body>
html>
アーグメンント
      ,       arguments,            ,      。
  ,    sayHi()  ,       message。  arguments[0] 
        ,        (          0,
          1,    )。

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>       title>
head>
<body>
<script>
    /*
                ,            ,    undifiend
            ,         
                 arguments              ,       
    */
    function demo(a,b){
        console.log('      ');
        console.log(arguments);

        for(i in arguments){
            console.log(arguments[i])
        }
    }

    demo(1,2,3,4);
script>
body>
html>
変数とパラメータの問題について:
              ,         。
         var   =        ,
*      var             ,           。

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>     title>
head>
<body>
<script>
    /*
            :                  
            :               

                      ,               
                         ,       ,                     
                var          
    */
    var a=1;//    
    function demo(){
        a=6;
        var a=0;//    
        b=10;
        console.log(a);
    }
    //console.log(a);
    demo();
    console.log(a);
    console.log(b);
script>
body>
html>