Javascript 函数

函数

函数是用来完成特定功能的代码块,可以被调用执行多次，实现复用

自定义函数

function 函数名(参数1,参数2...){
	//函数体
}

示例

function f1(){
	var sum=0;
	for(var i=1;i<=100;i++){
	sum+=i;
}
	console.log('1-200和:'+sum)
}
	//调用函数
	f1();

	//定义带参数的函数
	function f2(num){
	var sum=0;
	for(var i=1;i<=num;i++){
	sum+=i;
}
	console.log('1-200和:'+sum)
}
	//调用函数
	f2(100);

函数的参数

• 定义函数时指定的参数称为形参，没有实际的值，占位置
• 调用函数时指定的参数，称为实参，有实际的值
• 实参个数和形参个数可以不同，未指定参数时默认值是undefined

 <script>
        function f1(a, b) {
            console.log(a)
            console.log(arguments) //打印所有传递的参数
        }
        f1(1)
    </script>

函数与变量同名，函数不生效，变量会覆盖函数

<script>
        var f1 = 'haha'

        function f1(a, b) {
            console.log(a, b)

        }
        f1(1)
        console.log(f1)
    </script>

可以对函数的参数进行处理
如果参数为undefined,null,NaN默认设置为0

<script>
        function f1(a, b) {
            //只要不是数字则默认为0
            if (isNaN(b)) {
                b = 0
            }
            console.log(a + b)
        }
        f1(1)
    </script>

函数的返回值

• 函数执行后可以返回一个结果，称为函数的返回值
• 使用return 关键字来返回函数执行后的结果值
• 如果函数中没有使用return返回值，则默认返回undefined

变量的作用域

• 局部作用域
  在函数中声明的变量，只能在该函数内访问，函数运行结束后变量自动销毁
• 全局作用域
  在函数外声明的变量，或者在函数内未定义而直接赋值的变量，在任何位置都可以访问，将所在页面关闭后销毁
• 块级作用域
  使用let关键字声明的变量，只能在声明它的代码块内部使用(使用var声明的变量没有块级作用域的概念)

注意：

• 如果局部变量和全局变量同名，默认访问的是局部变量
• 如果想访问全局变量必须使用window前缀，在一定条件下也可以使用this前缀

  <script>
        //块级作用域，在javascript新版本中规范ES6中提供了let关键字用来定义变量
        //作用与var类似
        if (true) {
            var a = 5 //全局变量
            let b = 8 //块级变量，属于块级作用域只能在当前代码块中{}使用
            console.log(a)
            console.log(b)
        }

        //代码块
        {
            var c = 9
            let d = 10
        }
        console.log(a)
        console.log(b)

        console.log(c)
        console.log(d) //无法访问块级作用域
    </script>

for(let i=1;i<=10;i++){

}
console.log(i) //外面不能访问
//如果使用var定义  属于全局 


<script>
        var x = 5
        function f() {
            var x = 8
            console.log('局部变量:', x)
            console.log('全局变量:', window.x)
        }
        f()
    </script>

解析器执行JavaScript代码的过程

1. 首先预解析(全局作用域)
   将变量var和函数function的声明提前到作用域的最上面，需要注意的是变量的赋值操作不会提前
2. 然后执行代码，从上往下，一行一行执行代码
3. 当执行函数时会进入函数内部，再次预解析(局部作用域)
4. 然后从上往下，一行一行执行代码

示例

//第一步：预解析
var num;
function fn(){
	//第三步 预解析(局部作用域)
	var num;
	//第四步 从上往下依次执行
	console.log(num)
	num=20
}
//第二步：从上往下，一行一行执行代码
console.log(num)
fn()


function f1(){
	a=b=c=9 //等价于 var a=9 b=9 c=9 b和c是全局变量
}

区分：声明变量和变量未定义

• 如果没有声明变量 报错 …is not defined
• 声明了变量但未赋值 undefined

定义函数的两种方式

• 函数声明

function 函数名(参数){
	函数体
}

• 函数表达式

var 变量名 = function(参数){  //没有函数名 也叫匿名函数
	函数体
}
调用函数：变量名（参数）：

两种方式的区别：

• 函数声明在编写时可以先调用再声明
• 函数表达式必须先定义，在调用

回调函数
不立即执行的函数调用，满足一定条件时才会执行或者由别的代码调用执行，称为回调函数callback,调用时只写函数名，不能写小括号()和参数
应用场景：

• 作为事件绑定的函数，即当事件触发时要执行的函数
• 作为另一个函数的参数，即将函数作为参数传给另一个函数，（函数也是一种数据类型）

<script>
        //作为事件绑定
        function f() {
            alert('Hello')
        }
        // f() 立即调用
        //点击窗口时执行
        window.onclick = f //此时f就是回调函数

        //作为另一个函数的参数
        function f1(args) {
            if (typeof(args) != 'function') {
                console.log(args)
            } else {
                args()
            }

        }

        var a = function() {
            console.log('嘿嘿')
        }

        f1(a)
    </script>

匿名函数
没有名字的函数，称为匿名函数一般用于回调

应用场景：

• 用于事件的回调

window.onclick=function(){//匿名函数用于回调
	console.log()
}

• 用于一次性执行的函数，会自动执行称为自执行函数

//用小括号括起来表明是一个整体,然后加小括号直接执行
(function(a,b){
	console.log(a,b)
})(1,2)

• 将匿名函数作为另一个函数的参数