回顾JavaScript基础——函数

1：声明函数

//声明一个函数 /* function 函数名(参数1,参数2,...){ //在内部定义函数体 } */ function put(something){ console.log("1" + something + "="); } function add(a,b){ return a + b; } function testNum(num){ if(num < 0 ) return; return num > 10; }

2：调用函数

//在声明的函数外部通过 函数名(参数1,参数2,...) 来调用函数 function put(something){ console.log("1" + something + "="); } put(2); function add(a,b){ return a + b; } add(1,2); console.log(add(1,2));//输出结果：3 //函数可以赋值给一个变量 var result = add(1,2) console.log(result);//输出结果：3 //变量可以作为函数的参数 console.log(add(result,5));//输出结果：8 function testNum(num){ if(num < 0 ) return; return num > 10; } console.log(testNum(-5));//输出结果：undefined console.log(testNum(15));//输出结果：true

3：函数表达式

function add(a,b){ return a + b; } console.log(add);//不加小括号的话，就会输出函数本身的值，也就是函数自己的定义 //可以将函数的定义赋值给一个变量，然后就可以跟普通函数一样进行调用 var plus = add; var res = plus(5,6); console.log(res);//输出结果：11 //定义一个函数将他赋值给一个变量,这时函数名可以省略不写 var multiply = function a(可以省略不写) (a,b){ return a * b; } console.log(multiply(2,3));//输出结果：6

4：变量和函数的提升（Hoisting）

//可以在底下声明这个变量，但是需要在输出语句前给它赋值 x = 5; console.log(x);//输出结果：5 var x; //可以在函数输出语句的下方声明函数 console.log(divide(8,4));//输出结果：2 function divide(a,b){ return a / b }

5：默认参数

//有默认参数的函数可以不用向他传递参数 function greetings(name = "z){ console.log("你好，" + name);//输出结果：你好，z } greetings(); //向有默认参数的函数重新传递一个参数，会将默认值覆盖 greetings("zhou");//覆盖默认参数后的输出结果：你好。zhou //如果函数存在多个默认参数，且只有第一个参数有默认值，需要向第二个参数传递参数，可以将第一个参数传递为undefined function greetingsWithWeather(name = "z", weather){ console.log("你好，" + name + ",今天是"+weather);//输出结果：你好，z，今天是晴天 } greetingsWithWeather(undefined,"晴天");

6：递归：函数自己调用自己

function sum(n){ if(n === 1){ return 1; } return n = sum (n-1); } console.log(sum(100));//输出结果：5050 //1 1 2 3 5 8 13 ...,每个数都是前两个数的和 function fib(num){ if(num <= 1){ return 1; }return fib(num-1)+fib(num-2); } console.log(fib(5));//输出结果：8

7：arguments函数里内置的跟数组类似的参数集合

function log(){ console.log(arguments[0]); } log("abc");//输出结果：abc function logs(){ console.log(arguments[0]); } logs("abc","bcd");//输出结果：abc function loges(){ if(let i =0,i<arguments.length;i++){ console.log(arguments[0]); } } loges("abc","bcd","efg");//输出结果：依次打印出abc bcd efg

8：作用域，指自定义变量的可以范围，分局部作用域（函数内部定义的变量），全局作用域（在最外层定义的变量）

//全局作用域的变量 var x = 5 //局部作用域 function add(a){ var y = 10; console.log(y);//输出结果：10 return a + x; } console.log(add(8));//输出结果：13 console.log(y);//输出结果：undefined。访问不到函数内部的变量 var num = 100; function multiply(num){ return num * 10; } console.log(multiply(4));//输出结果：40

10：var，let（const定义的常量跟let定义的变量一样）

相同之处：

​ 1）都是用来定义变量的；

​ 2）在函数内部定义的变量，出了函数，就不能再访问；

​ 3）定义的全局变量在哪里都能访问；

不同之处：

​ 1）除了函数之外，在其他代码块内部定义的变量，出了函数是否能访问

//在这个代码块外部访问不到代码块内部定义的let变量，但可以访问内部定义的var变量 var z = 6; if(z > 2){ console.log(z);//输出结果：6 var innerA = 17; let innerB = 17; } console.log(innerA);//输出结果：17 console.log(innerB);//报错 for (var i = 0;i < 10;i++){ console.log(i);//输出结果：0、1、2、3、4、5、6、7、8、9 } console.log(i);//输出结果：10 for (let i = 0;i < 10;i++){ console.log(i);//输出结果：0、1、2、3、4、5、6、7、8、9 } console.log(i);//输出结果：报错

11：箭头函数

//var 变量名 = () =>{} var greeting = () =>{ console.log("hello");//输出结果：hello } greeting(); //1:var 变量名 = 参数=>{} var greeting = name =>{ console.log("hello"+name);//输出结果：hello z } greeting("z"); //2:var 变量名 = (参数1,参数2,...)=>{} var greetings = (name,age) =>{ console.log("hello"+name+19);//输出结果：hello z 19 } greetings("z",19); //3:var 变量名 = 参数 => 方法 var num = x => x+1; console.log(num(2));//输出结果：3

12：闭包（函数内部再定义函数）

function squareSum(a,b){ function square(x){ return x * x; } return square(a) + square(b) } console.log(2,3);//输出结果：13 function person(){ let name = "z"; function getName(){ return name; } return getName; } var getName = person(); console.log(getName);//输出内部定义的getName函数 console.log(getName());//输出结果：z

13：柯里化（curry：把一个接收多个参数的函数，变成一系列接收一个参数的内部函数）

function addThreeNums(a,b,c){ return a + b + c; } console.log(addThreeNums(1,2,3));//输出结果：6 function addThreeNumsCurry(a){ return function(b){ return function(c){ return a + b + c; }; }; } console.log(addThreeNumsCurry(1)(2)(3));//输出结果：6 //如果存在固定的参数和变化的参数，这样就可以先计算出固定的参数的值， var fixedTwo = addThreeNumsCurry(1)(2); console.log(fixedTwo(4));//输出结果：7 console.log(fixedTwo(5));//输出结果：8 console.log(fixedTwo(6));//输出结果：9

14：自执行函数（函数在定义完后，直接调用它自己）

自执行内部的代码，外部访问不到，防止被篡改，内部也形成了自己的作用域，防止和外部的变量命名冲突

var num1 = 10; (function(){ var num1 = 20; console.log(num1);//输出结果：20 })(); console.log(num1);//输出结果：10

15：回调函数

function request(cb){ console.log("请求数据");//1：先输出 cd("success");//调用回调函数 console.log("请求结束");//4:最后输出 } //定义一个回调函数 function callback(result){ console.log("执行回调");//2：其次输出 console.log("执行结果是；"+ result)//3：然后输出 } request(callback); /* //用箭头函数简化代码 request(result =>{ console.log("执行回调");//2：其次输出 console.log("执行结果是；"+ result)//3：然后输出 }) */