首先排除,不是数学中的函数;函数可以理解为一个点
一、为什么要有函数,函数的功能是什么??
帮我们把项目多个地方用到的功能(代码段),抽离出来(就把他拿到那个小盒子,就不需要在多个地方写重复的功能); 然后在需要的地方 调用函数即可
二、写一个完整的函数
写一个函数(或者说一个完整的函数) 分为两部分
1、定义阶段
2、调用阶段
三、函数的定义
1、语法
function(){}
2、两种定义函数的方式:
1.赋值式定义
var fn=function(){} ----匿名函数
function: 关键字,表明后续紧跟一段代码,是函数
() 内部书写,参数 ,后续讲,暂时记住,暂时理解为 固定写发
{} 内部书写,函数调用执行时 的代码,要执行的代码
2.声明式定义
function 函数名(){}---->具名函数
function: 关键字,表明后续紧跟一段代码,是函数
fn(函数名):将来可以通过 这名字(变量) 去调用(会找到)本函数
{} 内部书写,函数调用执行时 的代码,要执行的代码
3、函数的调用方式
语法:函数名()
赋值函数: 由于赋值函数没有函数名,数据存储在变量中,所以可以把变量理解为函数名,即调用方法 函数名()
4、函数声明式和赋值式的区别
5、函数声明式和赋值式的区别
1、书写不同
var fn=function(){}
function fn1(){}
2、打印时,声明式会带上函数名;赋值式没有
3、调用时有差异
fn1() //111
function fn1(){
console.log('111')
}
fn1() //111
4、声明式可以在函数定义前 调用
fn() //报错
var fn=function()(){
console.log('111')
}
fn() //111
--------------------------
//预解析
//浏览器做变量提升
var f; //备注:这一行会在当前最开始的那一行,第一行
fn() //fn is not a function
//原因在于,此时fn 经过变量提升,有fn,但值为 undefined
赋值式不可以在函数定义前 调用
6、函数是做什么的??
- 我们的函数在不参与的时候,可以正常执行
- 但!功能相对单一
- 如果函数想要真正的灵活起来,在多个地方调用时,有不同的执行,那么我们可以通过函数的参数来完成
四、函数的参数
1、形参:
函数名后(function)后面的小括号,没书写的一个,相当于在函数内部声明一个变量,可以在函数内部去调用
2、实参
调用函数时的小括号内部书写的值,就是实参
function fn(a,b){//形参
console.log(a,b)
}
//实参
fn(1,2) //打印1 2
fn(2,3) //打印2 3
--------------------
function add(a,b){
console.log(a+b)
}
add(1,2) //3
add(2,3) //5
3、形参与实参会一一对应
-
如果实参数量少于形参,那么前边的形参对应受值,没有对应的实参的形参值,为undefined
-
如果形参的属性 少于 实参 。那么会一一对应后,多余的实参,无法通过 函数获取
//1 function fn(a,b,c){ console.log(a,b,c) } fn(1) //1 undefined undefined fn(2,3)//2 3 undefined //2 function fn(a){ console.log(a) } fn(1) //1 fn(2,3)//2
五、函数的返回值
1、语法
return 需要返回的内容
2、小案例
function add(a,b){
return a+b;
}
var sum=add(1,2)
console.log(sum) //3
函数默认返回值
我们可以不写return 函数会默认在代码段最后一行,写上return undefined
function fn(){
console.log(1)
}
var sum=fn() //调用fn函数(打印1就是在此时执者),
//将fn函数内部返回值,存储给sum,因为我们没有写return,所以默认值
console.log(sum)//undefined
3、return 中断函数
function fn(){
console.log(1)
return
console.log(1)
console.log(1)
console.log(1)
}
4、我们要写返回值吗?我们什么时候需要??
返回值的书写,取决于是否需要得到函数内部某一个变量的值,如果需要 可以使用返回值将其返回,如果不需要我们可以不写
5、总结
- 具有中断函数的共功能
- 如果不想中断函数,那么一定将return放到函数的最后
- 除非就是想要通过return中断函数的运行
六、案例
1、案例一 水仙花
function fn(num){
//1、书写代码
//1.1 拿到 个位,十位,百位
var bai=parseInt(num/100)
var bai=parseInt(num%100/10)
var ge=num%10
//1.2 拿到各个位置的三次的值
var sum=bai **3 + bai ** 3 +ge ** 3
//2、如果是水仙花数,返回true 如果不是水仙花数 返回false
if(sum==nume){
//水仙花数
return true
}
else{
//非水仙花数
return false
}
}
var bo=fn(153)
console.log(bo)
var bo1=fn(666)
console.log(bo1)
2、案例二
-
需要参数吗? 两个
-
需要返回值吗?? 不需要
function fn(a,b){ var num=0 for(i=a;i<=b;i++){ if(i % 4 == 0 && i % 100 !=0){ document.write(i +' '); num++ if(num == 4){ document.write('<br>') num=0 } } } } fn(1000,2000)
3、案例三
/*
需要参数吗?
需要两个 一个控制行 一个控制列
需要返回值?? 不需要
*/
function fn(num1,num2){
for(var i=0;i<num1;i++){
for(var j=0;j<num2;j++){
document.write("*")
} document.write("<br>")
}
}
fn(5,6)
4、案例四
计算两个数的和,并且在此之前。如果哟有一个参数不是 number 那么停止函数
需要参数吗? 需要 两个
需要返回值吗 ?? 需要
function add(a,b){
if(typeof a !=="number" || typeof b!== "number"){
console.log("参数a或者b参数,其中有一个不是number类型的,终止函数运行")
//停止函数
return flase;
}
console.log('a+b的和:',a+b)
return a+b
}
add(100,200)
5、 案例五
/*
需不需要参数?? 需要
需不需返回值 ?? 需要,并最好是布尔值
是--》true 否--》false
*/
function fn(a){
//1、判断传入的参数是否为质数
var count=0;
for(var i=2;i<a;i++){
if(a%i==0){
count=count+40
}
}
//2、根据出入的参数决定返回值是什么
if(count ===0){
//应该返回true
return true
}
else{
//应该返回false
return flase
}
//不能使用三元表达式,判断
}
var a=fn(9)
console.log(a) //false
var b=fn(7)
console.log(b) //true
六、函数的预解析
1、代码书写
fn()
function fn(){
console.log(1)
}
fn()
//预解析之后(会把函数提升到当前作用块最顶层)(暂时理解为 当前代码的第一行)
/*
1. fn() 不需要
2. function fn(){} 需要预解析
3. fn() 不需要
----------------------------
1.function fn(){} //提升到了当前代码最开始的第一行
...
2. fn() //正常调用
3. fn() //正常调用
*/
2、重名问题
-
函数的预解析,可能会遇上同名变量提升(变量的预解析) 直接以函数为主
-
JS编程时应该尽量避免变量名和函数名同名,否则会发生相互覆盖的问题.从实际测试效果来看,这种覆盖可以分为两种情况:
-
定义变量时只使用var定义变量,不分配变量初始值,此时函数的优先级更高,函数会覆盖变量;
-
定以变量时为变量指定了初始值,此时变量的优先级更高,变量会覆盖函数.
var fn='hhh' //有提升 console.log(fn) //没有 fn()//没有 function fn(){ //有 console.log(1) } fn() //没有 ---------------------------------------------------------------- //预解析之后 function fn(){ //第一行 console.log(1) } var fn //第二行 没意义 fn='hhh' //这行很重要,直接将变量保存的函数,更改为了 'hhh' console.log(fn) //按照分析,此处应该打印 'hhh' fn() //按照分析,此处fn 的应该为'hhh' 所以会报错 fn is not a function fn() //按照分析 此处fn 的值还是'hhh',所以还会报错 fn is not a function