javascript一函数

1./ /声明一个函数

funct ion goudan() {
		consolc. log ("DSB") ;
	}
	// goudan() ;//主动式触发函数/主动的在合适的位置加()执行

	
//充当事件函数，事件触发时才执行，不能加() ,因为加上()表示右边为一个函数了，自执行，没有点击效果了
document.onclick = goudan；
//	document.onclick = goudan()；加上括号就自己执行了

2./ /匿名（没有名字的函数就叫匿名函数）一个函数
注意：没有参与任何表达式的匿名函数会报错
例如:
1）.报错

function () {
console.log("拉拉好可爱");
};//这会报错，因为没有参与任何表达式的匿名函数会报错

2）.正确格式

document.onclick = function () {
	console.log("拉拉好可爱");
	};

3）.注意：只有单独声明的变量，才可以自己调用
例如：

document.onclick = function aa() {
				console. log("123") ;
		}
	aa(); //这会报错

3.作用域（当前的变量起作用的范围是在哪个范围？）
1）

  <script>
    //1.全局变量：没有被其他的函数包裹住 -- 全局作用域 ：GO
    let a = 10;
    
    //2 局部作用域
    //函数能产生局部作用域
    function x(){
      //这个大括号里面，会产生一个局部作用域
      let b = 20;
      
      //3.局部作用域可以找全局，但是全局不可以找局部
      console.log(a); //10
    }
    x();
    
    //报错，因为不允许从全局访问局部的变量，作用域的作用体现
    //console.log(b);
  </script>

2）局部作用域和全局作用域的区别与联系

  <script>
    let a = 10;

    function x(){
      //局部变量名可以和全局一样，没有冲突
      let a = 20;

      //不管是取值还是赋值，都遵循就近原则
      // console.log(a); //20
      a = 30;//赋值
    }

    x();

    console.log(a); //10

  </script>

3）作用域链：指使用局部里面的某个变量从自身找起，如果没有就依次往上级找（使用局部作用域AO里面的某个变量从自身找起，如果没有就找全局作用域GO，实在找不到就报错）–基础考题

4.函数表达式

 <script>
    //1）不会报错，函数声明允许提前调用
    a();

    //2）会报错，通过 = 赋值定义的函数，不允许提前使用
    b();

    //1）函数声明
    function a(){
      console.log("a函数");
    }

    //2）函数表达式
    let b = function(){
      console.log("b函数");
    };
  </script>

5.函数表达式自执行
函数表达式自执行：称为：IIFE
1）

 <script>
   	function x(){
     console.log("x函数执行了");
    }()
    //执行不了，会报错
    </script>

如下图：某一个符号的错误

2）函数表达式可以加括号自执行

<script>
    //函数表达式可以加括号自执行
    let y = function(){
      console.log("y函数执行了");
    }(); //这个表达式的写法很奇怪

 </script>

如下图：

3）还有哪些写法能够把函数变成函数表达式？

    //还有哪些写法能够把函数变成函数表达式
    (function(){
      console.log("111");
    })();//打印 111

// 应用：不同的作用域里面变量可以一致，每写一个功能就写一个函数自执行，因为函数会产生一个局部的作用域，解决了变量名一致而不会出现问题
    //功能1
    (function(){
      let num = 0;
      /
    })();




    //功能2
    (function(){
      let num = 0;
      /
    })();



    //功能3
    (function(){
      let num = 0;
      /
    })();

 //其余的写法能够把函数变成函数表达式
  (function(){
      console.log("1111 - 11111");
    }());=== (function(){
      console.log("1111");
    })();//常用写法
    
    !function(){
      console.log("2222");
    }();

    +function(){
      console.log("3333");
    }();

    -function(){
      console.log("4444");
    }();

    ~function(){
      console.log("5555");
    }();

  </script>

6.参数
形参 – 定义函数的时候规定好的变量名，作用域于函数内部
实参 – 调用函数的时候传入的实际的数据
不定参–是指每个函数都会存在的，无论有没有实参或者形参

 <script>
    // 声明函数的时候 - 定义好 形参(变量名)
    function sum(a, b) {

      let oWrap = document.getElementById("wrap");
      oWrap.innerText = a+b;
    }

    //调用的时候 - 传 实参(实际的数据)
    sum(2, 4);
    sum(2, 40);


  </script>

例如
1）实参、形参

 <script>

    function sum(x,y){
      console.log(x + y);
    }

    sum(1,2);//输出3

    let aaa = 10;
    let bbb = 20;
    sum(aaa,bbb);//输出30

  </script>

2） 不定参–是指每个函数都会存在的，无论有没有实参或者形参：采用：arguments ---- 所有实参的集合

  <script>
    function aaa(){
      console.log(arguments);
    }
    
    //实参的个数不确定的时候,采用不定参来计算
    aaa(2,2);//输出Arguments(2) 0:2 1:2
    aaa(2,4);//输出Arguments(2) 0:2 1:4
    aaa(2,4,5,6,7,2,3);//输出Arguments(7) 0:2 1:2 3:5 4:6 5:7 6:2 7:3
    aaa(2,3,4);//输出Arguments(3) 0:2 1:3 2:4
  </script>

  <script>
    //求乘积
    function aaa(){
      //当实参个数不确定的时候，形参没法预设好一一对应的变量

      //arguments ---- 所有实参的集合
      let t = 1;
      for (let i = 0;i<arguments.length;i++){
        t = t * arguments[i];
      }
      console.log(t);

    }
    
    //实参的个数不确定的时候
    aaa(2,2);//输出4
    aaa(2,4);//输出8
    aaa(2,4,5,6,7,2,3);//输出10080
    aaa(2,3,4);//输出24


    /*document.getElementById( "wrap" )//"wrap" 123都属于实参，而形参是已经被定义好了的
    console.log( 123 )*/

  </script>

7.返回值：只用函数才有返回值
1）一个函数表达式执行完之后，只要不规定返回的值是什么，则默认的返回值都是 undefined

<script>

    //一个函数执行完之后，默认的返回值是 undefined
    function x(){
      let x = 10;
      let y = 20;
      console.log(x + y);//输出20
      alert(x*y);//弹窗200
    }
    let a = x();

    console.log( "x的返回值" , a );//输出：x的返回值是undefined

  </script>

不定参求和+返回值

//结果输出：sum的返回值 9

2）一个函数表达式执行完之后，只要使用return规定,则返回值就是一个数据

  <script>
	//Javscript已经规定的返回值：let oWrap=document.getElementById("wrap");
	
    /*自己规定的返回值：
    function sum( x,y ){
      return x + y; //返回的是 一个 数据
    }*/

    //传入数字，得到这些数字的和
    /*功能函数的规范：
    提前定义好（写好注释）
    * @params
    *   告诉使用这个函数的人，应该要传入什么实参
    * @return
    *   告诉使用这个函数的人，我会返回什么数据
    * */

    /*例如：
    * @params
    *   传入一个或多个数字数据
    *   number,number,number,....
    * @return
    *   返回参数的总和
    *   number
    * */
    function sum(){
      let result = 0;
      for (let i=0;i<arguments.length;i++){
        result += arguments[i];
      }
      return result;
    }

    let a = sum(4,5);
    let b = sum(7,7,7,8);
    let c = sum(9,98,8,7);
    let d = sum(3,3,45,5);
    let e = sum(2,3,4,5);

    console.log(a);
    console.log(b);
    console.log(c);
    console.log(d);
    console.log(e);


  </script>

3）函数与事件联系

在事件中只有返回函数并且赋值给事件才有意义

 <script>

    /*
    function x(){
      console.log("点击");
    }

    document.onclick = x();//返回值是undefined，所以没有事件函数触发
    */

    function x(){
      return function(){
        console.log("阿秦");
      }
    }

    document.onclick  =  x();//返回值是是一个函数，所以有事件函数触发

  </script>