函数

157 阅读2分钟

函数

    // function 函数名 (){ 函数体}
    //函数的调用 只有“喊”函数名才会调用函数
    函数名()
    // 1函数声明式
    function fu (){
    }
    // 2函数表达式
    var fn = function() {} //匿名函数
//3
var  fn = new Function()

函数作用域

var a=1; // 全局作用域 整个script标签或者单独的js文件
    function fn(){
        var b=5 ; // 局部作用域 只在fn函数中访问
        console.log(b)
        console.log(a)
    }
    // console.log(b)  不会输出b的值
    fn() // 函数调用
    console.log(a) //输出a

函数套函数

    /*  function f1(){
        f2()
        console.log("第一")
    }
    function f2 (){
        f1()
        console.log("第二")
    }
    f1()  出现死循环    */
    function f1(){
        f2()
        console.log("第一")
    }
    function f2 (){
        console.log("第二")
    }
    f1()

作用域链

      // 内部函数访问外部函数的变量,采用的是链式查找的方式来决定取哪个值!!
    // 向上查找!!!
    var num = 10;
    function fn() {
        var num = 20;
        function fun() {
            // 1.先查找fun里面有没有num
            console.log(num) // 20
        }
        fun();
    }

    fn()
    //
    var a = 1;
    function fn1() {
        var a = 2;
        var b = 22;
        fn2();
        function fn2() {
            var a = 3;
            fn3();
            function fn3() {
                var a = 4;
                console.log(a)
                console.log(b)
            }
        }
    }
    fn1()//  输出 4   22
    //
    function f4() {
         var num = 123;
         function f5() {
             var num = 0;
             console.log(num)
         }
         f5() //调用函数f5
     }
     f4() // 0

预算析

console.log(num); // undefined
var num =10;
   // 按照正常思路来说,console.log(num),此时num没有定义!!!
    // 是因为js引擎在处理代码时,是需要先进行预编译!!!
    // 先进行预编译在执行代码!!!
    var v=1;
    console.log(v)
 /* // 案例3
     fun()
     var fun = function() {
         console.log("222")
     }
    // 1 编译 var fun  2.执行阶段 fun()  fun = function()*/
    // 案例4:
    demo() // demo是可以执行!!!
    function demo() {
        console.log("demo")
    }
    // js引擎运行js代码的时候分为两个步骤: 预解析  代码执行
    // 1.预解析 js引擎会把js里面的var还有function函数提升到作用域的最前面。
    // 2.代码执行 从上到下顺序执行

    // 提升: 变量的提升和函数的提升!!!
    /*
   变量提升 var a =10; var a 提升到作用域最前面
   函数提升 function f1 (){}  var f1 =function(){} 只能提升变量f1 不能提升函数匿名函数
    */

预算析案例

 var num = 10;
     fun(); // undefined
     function fun() {
         var num; //(代号3)
         console.log(num)
         // 变量提升是提升到当前的作用域的最前面!!!
          num = 20; //var num =20  提升3 到当前的作用域的最前面
     }
  /*  var num = 10;
     function fn() {
         console.log(num) // undefined
         var num = 20;
         console.log(num) //20
     }
     fn();*/
       /*
     var a = 18;
     f1();
     function f1() {
         var b = 9;
         console.log(a) //undefined
         console.log(b) //9
         var a = "123"
     } 
 */
 /* f1()
    console.log(a) // js是单线程语言,一旦出错,下面的代码不再执行!!!
    console.log(b)
    console.log(c)
    function f1() {
        var a = b = c =9;
        // 相当于 c = 9; b = c; var a = b
        console.log(a)
        console.log(b)
        console.log(c)
    }
 */
    // 着重强调,如果函数中没有使用var定义变量,外部也没有这个变量,则这个变量为全局变量
    // function demo() {
    //     // 这个num就被定义成了全局变量
    //     num = 5;
    // }
    // demo();

案例

  var num = 1;
     function demo() {
         console.log(num); // 在demo函数中找不到num输出    undefined
         function demoSon() {
             num = 3;
             console.log(num)
         }
         console.log(num) // undefined
         var num = 2
         console.log(num) //2
         demoSon(); // 3
     }
     demo();