程序员最近都爱上了这个网站  程序员们快来瞅瞅吧！  it98k网:it98k.com

JavaScript函数

一、函数基本概念

1、函数：可以实现某种特定功能的代码块
2、函数的使用：声明函数和调用函数
例：求n~m的累加和

function getSum(num1, num2) {      //定义getSum()
  var sum = 0;
  for (var i = num1; i <= num2; i++) {   sum += i;   }
      console.log(sum);     // 函数执行结束后，将结果输出
}
getSum(1, 100);	           // 输出结果：5050     //调用getSum(
getSum(10, 50);	           // 输出结果：1230

3、定义函数

function 函数名([参数])
		{
		   函数体语句
		}

(1)function是一个关键字，全部小写
(2)函数名：是一个标识符，建议使用驼峰命名，做到见名知义
(3)函数可以有参数也可以没有参数，可以有多个参数，若有多个参数，参数之间用逗号分隔
(4)"{}"表示函数的控制范围，不能省略
(5)函数体语句可以有多条，建议一个函数只完成一个功能
  内聚：模块内部结合的紧密程度
  耦合：模块之间结合的紧密程度

4、调用函数

(1)  函数名([参数])
(2) 事件名 = 函数名([参数])

5、函数的参数：形参和实参

(1)形参(形式参数)：在定义函数时出现在函数首部的参数，在定义函数时形参只是占位符，没有确定的值
(2)实参(实在参数)：函数调用时出现在函数首部的参数，是实际的值

function 函数名(形参1, 形参2, …) { // 函数声明的小括号中的是形参
  // 函数体代码
}
函数名(实参1, 实参2, …)                  // 函数调用的小括号中的是实参

(3)参数的传递方式：实参将数据传递给形参
(4)当形参的个数比实参的个数多时，函数不会报错，多出的形参会是undefined类型
(5)当实参的个数比形参的个数多时，多余的实参会被忽略

function getSum(num1, num2) {
  console.log(num1, num2);
}
getSum(1, 2, 3);	// 实参数量大于形参数量，输出结果：1 2
getSum(1);           // 实参数量小于形参数量，输出结果：1 undefined

(6)实参向形参传递数据是单向的，形参的改变不会影响到实参
6、函数的返回值：是函数的处理结果。通过return语句返回

function 函数名() {
  return 要返回的值; // 利用return返回一个值给调用者
}

7、函数的内置对象arguments的使用
当不确定函数中接收到了多少个实参的时候，可以用arguments来获取实参。这是因为arguments是当前函数的一个内置对象，所有函数都内置了一个arguments对象，该对象保存了函数调用时传递的所有的实参

function fn() {
  console.log(arguments);	  // 输出结果：Arguments(3) [1, 2, 3, …]
  console.log(arguments.length);  // 输出结果：3
  console.log(arguments[1]);         // 输出结果：2
}
fn(1, 2, 3);

二、函数案例

1、定义函数 判断输入的年份是否是闰年，调用该函数输出1500-2021间所有的闰年，要求每行输出十个年份

function fun(year){
    console.log("你好")
    if(year%100!=0 && year%4==0 || year%400==0){
        return true;
    }else{
        return false;
    }
}

var str = '';
var flag = 0;
for(var y = 1500;y <= 2021;y++){
    if(fun(y)){
        flag ++;
        str += y + '\t';
    }
    if(flag == 10 ){
        str += '\n';
        flag = 0;
    }
}

console.log(str);

2、定义函数，判断一个数是否是素数，调用该函数找到100以内的所有素数并输出

//定义函数
function fun(n){
    for(var i = 2;i <= n;i++){
        if(n % i == 0){
            return false;
        }
    return true;    
    }
}

//调用函数
for(var j = 2;j <= 100;j++){
    if(fun(j)){
        console.log(j);
    }
}

3、定义函数来算n的阶乘

function fun(n){
    var s = 1;
    for(var i = 1;i <= n;i++){
        s = s * i;
    }
    // return s;     //变量s的值就是fun函数的运算结果
}

//函数调用
var t = prompt("请输入要计算的数: ");

var s1 = fun(t);

console.log(t+"!="+s1);

4、编写一个fn()函数，该函数调用后会弹出一个输入框，要求用户输入一个年份，输入以后，程序会提示该年份的2月份有多少天

在这里插入代码片function fn() {
  var year = prompt('请输入年份：');
  if (isLeapYear(year)) {  alert(‘当前年份是闰年，2月份有29天’); }
  else {  alert('当前年份是平年，2月份有28天'); }
}
function isLeapYear(year) {
  // 将上一个案例中的isLeapYear()函数中的代码复制到此处
}
fn();

三、函数的进阶

1、函数表达式：是将声明的函数赋值给一个变量，通过变量完成函数的调用和参数的传递，函数表达式的定义必须在调用前

 var 变量名 = function([参数]){
		
		   函数体
		}

2、回调函数：指的就是一个函数A作为参数传递给一个函数B，然后在B的函数体内调用函数A

<script>
        var s1 = cal(15,16,fun1);       //fun1为回调函数
        console.log("s1="+s1);

        var s2 = cal(15,16,fun2);       //fun2为回调函数
        console.log("s2="+s2); 

        var s3 = cal(3,5,function(a,b){     //回调函数的另一种写法，比较常用，在其他地方没有定义函数
            return a / b;                   //在写参数的时候直接定义了函数内容
        })
        console.log("s3="+s3);
        
    </script>

//回调函数的使用

function fun1(a,b){
    return a + b;
}

function fun2(a,b){
    return a * b;
}

function cal(m,n,fn){
    return fn(m,n);
}

3、递归调用：指的是一个函数在其函数体内调用自身的过程，这种函数称为递归函数（自己调用自己）

(1)递归的使用前提
      A、问题可以分解(即复杂的问题逐步分解成简单的问题)
	  B、分解得到的新问题的解法和原来老问题的解法是相同的
	  C、必须有明确的终止条件
(2)递归过程
      A、自上而下分解问题
	  B、自下而上回溯得到问题的解

①使用递归函数计算1+2+3+…+100的值

function sum(n){
    if(n == 1){
        return 1;
    }else{
        n += sum(n - 1);
        return n;
    }
}

②使用递归函数，输出斐波拉契数列的前20项

function fib(n){
    if(n == 1 ||n == 2){
        return 1;
    }else{
        return fib(n - 1) + fib(n - 2);
    }
}

var str = '';
for(var i = 1;i <= 20;i++){
    str += fib(i) + '\t';
}
console.log(str);

四、作用域

1、作用域的分类：变量需要在它的作用范围内才可以被使用，这个作用范围称为变量的作用域

• 全局变量：不在任何函数内声明的变量（显式定义）或在函数内省略var声明的变量（隐式定义）都称为全局变量
• 局部变量：在函数体内利用var关键字定义的变量称为局部变量
• 块级变量：ES6提供的let关键字声明的变量称为块级变量，当语句块结束后就销毁
  2、全局变量和局部变量
  区别
• 在全局作用域下，添加或省略var关键字都可以声明全局变量，全局变量在浏览器关闭页面的时候才会销毁，比较占用内存资源
• 在函数中，添加var关键字声明的变量是局部变量，省略var关键字时，如果变量在当前作用域下不存在，会自动向上级作用域查找变量。局部变量在函数执行完成后就会销毁，比较节约内存资源
  3、作用域链：当在一个函数内部声明另一个函数时，内层函数只能在外层函数作用域内执行，在内层函数执行的过程中，若需要引入某个变量，首先会在当前作用域中寻找，若未找到，则继续向上一层级的作用域中寻找，直到全局作用域，称这种链式的查询关系为作用域链

五、闭包函数与预解析

1、闭包函数：所谓“闭包”指的就是有权访问另一函数作用域内变量（局部变量）的函数
2、主要用途：

• 可以在函数外部读取函数内部的变量
• 可以让变量的值始终保持在内存中
  3、注意事项：由于闭包会使得函数中的变量一直被保存在内存中，内存消耗很大，所以闭包的滥用可能会降低程序的处理速度，造成内存消耗等问题
  4、闭包函数的实现:闭包的常见创建方式就是在一个函数内部创建另一个函数，通过另一个函数访问这个函数的局部变量可以在函数外部读取函数内部的变量。

function fn() {
    var times = 0;
    var c = function () { return ++times; };
    return c;
  }


var count = fn();       // 保存fn()返回的函数，count就是一个闭包
console.log(count());	// 输出结果：1
console.log(count());	// 输出结果：2
console.log(count());	// 输出结果：3

2、预解析:JavaScript解析器在运行JavaScript代码的时候会进行预解析，也就是提前对代码中的var变量声明和function函数声明进行解析，然后再去执行其他的代码

// 输出结果：undefined
console.log(num) ;
var num = 10;
// 报错，提示num2 is not defined
console.log(num2) ;0

var预解析

var num ;
 // undefined
console.log(num) ;
num  = 10;