1. 什么是函数?
1.1 函数是专门用来封装代码的,函数是一段可以随时被反复执行的代码块。
1.2 好处:冗余代码变少了,需求变更,需要修改的代码变少啦。
function sum(a,b){
let res = a + b
return res
}
let result = sum(10,20)
console.log(result)
1.3 函数没有通过return明确返回值,默认返回undefined
function demo(){
console.log(111)
return;
}
注意:return作用立即结束当前所在函数
1.4 js中的函数和数组一样,都是引用数据类型(对象类型),既然是一种数据类型,所以也可以
保存到一个变量中,将来可以通过变量名称找到函数并执行函数。
let fun = function(){
console,log(123)
}
fun()
2. 函数中的arguments
2.1 arguments的作用:保存所有传递给函数的实参
注意点:每个函数中都有一个叫做arguments的东东
function demo(){
console.log(arguments) [10,20]
let sum = 0;
for(let i=0;i<arguments.length;i++){
let num = arguments[i]
sum = sum+num
}
return sum
}
let result = demo(10,20)
console.log(result)
3. 函数拓展运算符
3.1 拓展运算符在等号左边,将剩余的数据打包到一个新的数组中
let [a, ...b] = [1,3,5,7]
console.log(a) //1
console.log(b) //[3,5,7]
3.2 拓展运算符在等号右边,将数组中的数据解开
let arr1 = [1,3,5]
let arr2 = [2,4,6]
let arr = [...arr1, ...arr2]
console.log(arr) //[1,3,5,2,4,6]
3.3 拓展运算符在函数的形参列表中的作用:将传递给函数的所有实参打包到一个数组中。
注意点:拓展运算符只能写在形参列表的最后。
function demo(...values){
console.log(values) //[10,20,30]
let sum = 0
for(let i=0
let num = values[i]
sum = sum+num //sum += num
}
return sum
}
let result = demo(10,20,30)
console.log(result)
4. 函数形参默认值
4.1 在es6之前可以通过逻辑运算符来给形参指定默认值。
格式:条件A || 条件B。
如果条件A成立,那么就返回条件A。如果条件A不成力,无论条件B是否成立,都会返回条件A。
function demo(a,b){
a = a || 'liu'
b = b || 'ren'
console.log(a,b) //10,ren
}
demo(10)
4.2 从es6开始,可以直接在形参后面通过=指定默认值。
注意点:es6开始的函数形参默认值还可以从其它的函数中获取。
function demo( a=10,b=getDefault() ){
console.log(a,b) //10,20
}
demo();
function getDefault(){
return 20
}
5. 函数作为参数和返回值
5.1 将函数作为其他函数的参数。
let say = function(){
console.log(123)
}
function test(fn){
fn();
}
test(say);
5.2 将函数作为其它函数的返回值。
注意点:只有在javascript中函数是可以嵌套定义的。其它编程语言是不可以的。
function demo(){
let say = function(){
console.log(123)
}
return say;
}
let result = demo()
result();
6. 匿名函数
6.1 什么是匿名函数? 就是没有名称的函数。
function(){
console.log(123)
}
6.2 匿名函数的注意点:匿名函数不能够只定义不使用,否则报错。
6.3 匿名函数的应用场景:
6.3.1 作为其它函数的参数:
function demo(fn){
fn();
}
demo(function(){
console.log(123)
})
6.3.2 作为其它函数的返回值
function demo(){
return function(){
console.log(123456)
}
}
let result = demo();
result();
6.3.3 作为一个立即执行的函数
(
function(){
console.log(456)
}
)();
7. 箭头函数
7.1 什么是箭头函数:是es6中新增的一种定义函数的格式。
目的:为了简化定义函数的代码
7.2 箭头函数的注意点:
7.2.1 在箭头函数中如果只有一个形参,那么()可以省略。
7.2.2 在箭头函数中如果{}中只有一句代码,那么{}也可以省略。
let demo = (name) =>{
console.log(name)
}
demo('liu')
let demo = name = console.log(name)
8. 递归函数
8.1 什么是递归函数?
就是在函数中自己调用自己,称之为递归函数。
递归函数在一定程度上可以实现循环功能。
8.2 递归函数的注意点:
每次调用递归函数都会开辟一块新的存储空间,所以性能不是很好。
function login() {
let pwd = prompt("请输入密码");
if(pwd !== "123456"){
login();
}
alert("欢迎回来");
}
login();
9. 函数中变量作用域
9.1 在JavaScript中函数后面{}中的的作用域, 我们称之为"局部作用域"
function test() {
var num1 = 123;
let num2 = 123;
num3 = 123;
}
test();
console.log(num1)
console.log(num2)
console.log(num3)