初识JS函数

1. 函数

1.1 函数概念

• 函数：就是封装了一段可被重复调用执行的代码块。通过此代码块可以实现大量代码的 重复使用。

// 不用函数
求 1~10的累加和
var sum = 0;
for (var i = 1; i <=10; i++) { 
sum += i; 
}
console.log(sum);
//使用函数 
//函数就是封装了一段可以被重复执行调用的代码块 目的： 就是让大量代码重复使用 function getSum(num1, num2) { 
var sum = 0;
 for (var i = num1; i <= num2; i++) {
  sum += i; }
  console.log(sum); }
  getSum(1, 5); 
  getSum(1, 10);

1.2 函数的声明

声明函数 
function 函数名() {
 函数体代码
  }

• function 是声明函数的关键字,必须小写
• 由于函数一般是为了实现某个功能才定义的， 所以通常我们将函数名命名为动词,函数名：驼峰命名法 动词;比如 getSum

1.3 函数的调用

调用函数 函数名(); 
通过调用函数名来执行函数体代码

• 调用的时候千万不要忘记添加小括号
• 口诀：函数不调用，自己不执行
• 注意：声明函数本身并不会执行代码，只有调用函数时才会执行函数体代码。

定义函数的两种方式区别：

1. 函数声明式，调用的时候可以放在函数定义的上面或者下面

     printSjx();
     function printSjx() {
     document.write('<table>')
      for (var i = 1; i <= 9; i++) {
         document.write('<tr>')
              for (var j = 1; j <= i; j++) {
                     document.write('<td>'+i+'*'+j+'='+i*j+'</td>')
                  document.write(`<td>${i}*${j}=${i * j}</td>`)
               }
               document.write('</tr>');
            }
            document.write('</table>')
        }

2. 表达式声明法：调用时只能写在函数定义的下面，放在上面会报错

         printSanJiaoXing();
         var printSanJiaoXing = function(){
             document.write('<table>')
             for (var i = 1; i <= 9; i++) {
                 document.write('<tr>')
                 for (var j = 1; j <= i; j++) {
                      document.write('<td>'+i+'*'+j+'='+i*j+'</td>')
                     document.write(`<td>${i}*${j}=${i * j}</td>`)
                 }
                 document.write('</tr>');
             }
            document.write('</table>')
         }

1.4 函数的参数

• 函数参数语法
  形参：函数定义时设置接收调用时传入
  实参：函数调用时传入小括号内的真实数据

参数的作用 : 在函数内部某些值不能固定，我们可以通过参数在调用函数时传递不同的值进去。

函数参数的运用：
1.调用的时候实参值是传递给形参的
2.形参简单理解为：不用声明的变量
3.实参和形参的多个参数之间用逗号（,）分隔

• 函数形参和实参数量不匹配时
  1.形参和实参个数相同时，参数赋值会一一对应
  2.形参个数>实参个数: 没有给赋值的形参，值为undefined
  3.实参的数>形参个数：可以通过arguments来获取传入的实参
  小结：
  1.函数可以带参数也可以不带参数
  2.声明函数的时候，函数名括号里面的是形参，形参的默认值为 undefined
  3.调用函数的时候，函数名括号里面的是实参
  4.多个参数中间用逗号分隔
  5.形参的个数可以和实参个数不匹配，但是结果不可预计，我们尽量要匹配

1.6 函数的返回值

• return 语句
  返回值：函数调用整体代表的数据；函数执行完成后可以通过return语句将指定数据返回 。
  我想把的到的这个和，存起来，下次还能用
  return 只能返回一个值

• 比如：

        function getSum(x,y){
            return x+y;
       }
  
         通过return 关键字返回出来的结果，函数调用时，结果就可以被保存起来
       var sum =  getSum(10,23);//把结果保存在sum变量中
      带return的函数，函数调用的结果是一个值，可以直接输出，也可以存到变量中
     console.log(sum);
     function getA(){
        return 'zs'
    }
   函数如果带return了，函数调用的结果是 一个值，可以直接输出，也可以保存到变量里
    console.log(getA()); 
    var x = getA()
    console.log(x);
  

1.7 arguments的使用

• 当不确定有多少个参数传递的时候，可以用 arguments 来获取。
  每一个函数内部都会有一个叫arguments：它会记录你传递过去的所有实参
  arguments: [2, 3, 6, 4, 5]
  arguments[0] arguments[1] arguments[2] arguments[3] arguments[4]
  length:长度（个数）
  arguments.length：传入实参的个数
  arguments[aruments.length-1]: 传入参数的最后一号元素

1.8return的补充知识

1．没有手写return的话，系统会在程序{}的结尾处，写return undefined;
2．函数带return了，函数调用的结果是return后面的值
3．函数只写一个return;函数调用结果还是undefined
4．函数只能带出来一个值
5. return终止函数后面的代码将不再执行

1.9 补充知识

• 1.随机数的生成

  JavaScript Math.random()内置函数

  random函数返回值

  返回0和1之间的伪随机数，可能为0，但总是小于1，（0,1)

  random函数示例

  //返回随机数

  document.write(Math.random());

  //返回10-20的随机数

  document.write(Math.random()*(20-10)+10);

  //返回指定范围的随机数(m-n之间)的公式

  document.write(Math.random()*(n-m)+m);

  用Math.round(Math.random());可均衡获取0到1的随机整数。
  用Math.round(Math.random()*10);时，可基本均衡获取0到10的随机整 数，其中获取最小值0和最大值10的几率少一半。

x-y 之间的随机数
    console.log(Math.random()*(y-x)+x);

• 2.三元表达式

  条件表达式?值1:值2
  当条件表达式结果为true，选择的是值1
  当条件表达式结果为false，选择的是值2
  

  var y = (x%4==0&&x%100!=0||x%400==0)?'是闰年':'是平年';
        console.log(y);

  var x = 35;
  var y = x%2==0?'是偶数':'是奇数'
        console.log(y);

2.1作用域

• 作用域：代码的作用范围，一段代码起作用的区域

   全局作用域： 在函数外面定义的变量
   全局位置定义的变量称为全局变量， 会保存在一个叫window对象里面
   全局变量的生命周期：页面一打开变量就起作用了，页面已关闭，变量就起作用了
  

1. 全局作用域里面定义的变量，哪哪都能访问

       var n = 20;
      console.log(n);//20
       function fn() {
       console.log(n);
     }
      fn();//20
     console.log(n);//20

2. 局部作用域定义的变量，只能在函数作用域内部使用，外部访问不到

   局部变量的声明周期:函数调用时产生,函数调用结束消失
   

function fn(){
         var n = 10;
        }
        fn();
        console.log(n);//n is not defined

4. js中 不是所有的{}都用于作用域 像 if(){} for(){} while(){}不能形成作用域

       if (true) {
           var n = 20;
       }
       console.log(n);//20

       for(var i=1 ;i<=10;i++){      }
       console.log(i); //  11

2.2 变量的赋值和访问规则

变量的访问(获取)规则：

1. 局部位置访问变量时，就近原则：先找局部作用域下的变量，找到就不找了，如果局部作用域里面没有，向上找，直到全局都没有，就报错

var x = 10;
       function fn(){
          var x = 20;
          console.log(x); //20
       }
       fn();


       var x = 10;
       function fn(){
          console.log(x);//10
       }
       fn();


       function fn(){
          console.log(x); // x is not defined
       }
       fn();

2. 变量的赋值(获取)规则： 遵循就近赋值

 var x = 10;;
        function fn() {
            var x = 20; //初始值
            x = 30;  //重新赋值
            console.log(x); // 30
        }
        fn();

        console.log(x); // 10

3. 赋值也好，访问也好，先找局部，再找全局

        var x = 10;; //初始值
        function fn() {
            x = 30;  // 先找一找 函数内部有没有定义局部变量x,  向上找，找了一个叫x的变量   ， 全局位置的x已经被重新赋值了  x = 30;
            console.log(x);  //30
        }
        fn();
        console.log(x);   //30

2.2 递归函数

函数内部，直接或者间接调用函数自己
Maximum call stack size exceeded: 内存溢出
递归一定要有出口，不然就是死递归
return 除了返回一个结果，终止函数的执行
break： 用于终止循环

var x =0;
function fn(){
            x++;
            console.log('从前有座山，山里有个庙，苗里有个老和尚...');
            if (x==10) {
                return;
            }
            fn();
             }
fn();
  // 函数的功能：求n的阶乘  带return
        function fn(n) {
            var jc = 1;
            if (n > 1) {
                jc = n * fn(n - 1)
            }
            // 递归的出口
            if (n == 1) {
                jc = 1;
            }
            return jc;
        }
        console.log(fn(5));
        //n=5    5*fn(4)  = 5*4*fn(3) = 5*4*3*fn(2)= 5*4*3*2*fn(1) =  5*4*3*2*1

2.3 对象

万事万物皆对象:对象是一组无序的相关属性和方法的集合
对象由属性和方法
属性：静态的描述信息： 身高，体重，年龄... 
方法：动态的行为:      吃饭, 学习，睡觉.....
身高，年龄，体重，性别，是否已婚 --->
var obj = {}
对象属性
    obj.name = '张三丰';
	obj.age = 112;
	obj.weight = 200;
	obj.sex = '男'
对象的方法
        obj.eat = function(){
            console.log('会吃吗');
        }
        // .... 
        console.log(obj);
对象的属性：键值对组成
        var obj = {
            age:112,
            name:'张三丰',
            sex:'男',
            weight:200
        }

 // for in循环遍历对象
 // obj代表的是整个对象
			  var obj = {
			                age:112,
			                name:'张三丰',
			                sex:'男',
			                weight:200
			            }
	            for(var k in obj){
                // console.log(k); // 键
                // console.log(obj[k]); //值
                console.log(k, obj[k]);
            }