前端基础-07-函数及作用域

红太狼 2022-06-05 04:17 241阅读 0赞

# 函数及作用域 #

### 1.函数的使用 ###

#有名函数
    定义函数：
    function fn() {
        var box = document.getElementById("box");
        box.innerHTML = "Java";
    } //函数定义 可以在定义前加括号执行，也可以在定义后加括号执行
    #第一种调用方式：
    fn();
    #第二种调用方式：
    document.onclick = function () {
        alert(1);
    }
    
    # 匿名函数
        没有名字的函数
        匿名函数不能单独出现 一般充当事件函数
            document.onclick = function () {
               alert(1);
            }
    
    #函数表达式：
    特点：可以在后面加括号立即执行
    （） + - ! ~ 可以将匿名函数变为函数表达式
    
    #第一种：
    var fn = function () {
        alert(1);
    };//通过var 的函数，只能在后面运行
    fn();
    
    #第二种：
    (function () {
        alert(1);
    })();
    
    #第三种：
    (function () {
        alert(1);
    }());
    #第四种：
    +function () {  //可以使用+ 、-、!、~
        alert(1);
    }();

### 2.形参和实参 ###

# 形参和实参
    fn(20);//实参
    function fn(x) {//形参
        alert(x);
    }
    #多个参数
     实参和形参个数不一定非得一样，但是不一样的时候要注意一一对应的关系
    sum( 20 , 30);#传入参数少了，运算会返回NaN,未传的参数值是undefined
    
    function sum( x , y ,z) {
        //一个函数里面，形参不要重复，也不要和内部var定义的变量重复
        alert( x +y+z );
    }
    
    #参数少了，设置默认值
    sum( 20 , 32 );#传入参数少了
    
    function sum( x , y , z) {
        //给形参设置默认值
        x = x || 0;
        y = y || 0;
        z = z || 0;
        alert(z);
        alert(x+y+z);
    }

### 3.不定参数 ###

sum(1, 2, 3, 4, 5, 6, 7, 8, 9);//实参
    function sum(r, t) {//和有没有形参没关系
        //不定参 arguments,存储着所有 实参的集合
        var x = 0;
        var len = arguments.length;//
        for (var i = 0; i < len; i++) {
            x += arguments[i];
        }
        alert(x);
    }

### 4.return 返回 ###

函数未写return值，默认返回 的是 undefined
    function fn() {
        var box = document.getElementById("box");
        box.innerHTML = "java";//过程
        return box;
    }
    var x = fn();
    alert(x);

### 5.JS作用域 ###

#JavaScript代码运行，先解析在运行
    
        1.（定义）解析顺序：var > function> 参数
        a.var只定义变量，后面的=赋值不解析
        b.函数只定义函数，函数的代码块不执行
        c.重名的只留一个，var 和函数重名  函数优先
    
        2.（运行）从上至下执行代码
    #案例1：
        alert(a)  #未定义变量a，脚本运行报错
    
    #案例2:
    alert(b)  #此时b未赋值，只是解析了变量b，运行结果是undefined
    alert(a)#此时解析了函数，运行返回的是函数体
    var a=function (b) {  #先解析var命名的变量a，在解析function,在解析方法体里面参数
        alert("1")
        return b
    }
    var  b=5  #b赋值了
    alert(b)  #运行结果返回是5