函数

使用

function 函数名(){
		函数体
}

命名规范

• 和变量命名基本一致
• 尽量小驼峰式命名法
• 前缀应该为动词
• 命名建议:常用动词约定 can has is get set load

调用

函数名()

注意:声明(定义)的函数必须调用才会真正被执行，使用 () 调用函数

传参

• 调用函数时，需要传入几个数据就写几个，用逗号隔开
• 开发中尽量保持形参和实参个数一致

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

形参如果不被赋值，就是undefined

小技巧

1.利用逻辑中断：

function getSum(x,y){
  x = x || 0
  y = y || 0
  console.log(x + y)
}
getSum(1,2)  // 3
getSum()     // 0

2.直接赋值

//没有参数x = 0 , y = 0  如果有参数传来，则用实参赋值
function getSum(x = 0,y = 0){ 
  x = x || 0
  y = y || 0
  console.log(x + y)
}
getSum(1,2)  // 3
getSum()     // 0

实参少于/多于形参

function fn(x, y) {
    console.log(x + y)
}

// 1. 实参个数少于形参   返回的结果 NaN
fn(1)   // x = 1 y = underfined

// 2. 实参个数大于形参 非诚勿扰
fn(1, 2, 3)   // x = 1 , y = 2  3没人接

小知识（了解）

函数内部可以使用arguments得到一个伪数组

  // arguments 函数内有效 表现形式：伪数组
  // 伪数组 比真数组 少了一些 pop()  push()  等方法
function fn() {
  console.log(arguments) //  [1,2,3]
  let sum = 0
  for (let i = 0; i < arguments.length; i++) {
    sum += arguments[i]
  }
  console.log(sum)
}

fn(1, 2, 3)

返回值

语法：return 数据

• return后面的代码均不会被执行！
• return会立即结束当前函数
• 函数可以没有 return，这种情况函数默认返回值为 undefined

作用域

1. 全局作用域（全局有效）

作用于所有代码执行的 环境(整个script标签内部)或者一个独立的js文件

2. 局部作用域（局部有效）

作用于函数内的代码环境，就是局部作用域

因为跟函数有关系，所以也称为函数作用域

3. 块级作用域（{} 内有效）

块作用域由{ }包括，if语句和for语句里面的{ }等

变量的作用域

    <script>
//————————————————————————————————————
      let a = 0         //全局作用域 
//————————————————————————————————————
      function fn() {
        let b = 0       //局部作用域
      }
      fn()
//————————————————————————————————————
      if (true) {
        let c = 0      //块级作用域
      }
//————————————————————————————————————
    </script>

变量类型
全局变量（函数外部let 的变量）	全局变量在任何区域都可以访问和修改
局部变量（函数内部let的变量）	局部变量只能在当前函数内部访问和修改
块级变量（{} 内部的let变量）	let定义的变量,只能在块作用域里访问,不能跨块访问,也不能跨函数访问

特殊情况:

• 如果函数内部或者块级作用域内部（if、for···），变量没有声明，直接赋值，也当全局变量看（强烈不推荐）
• 函数内部的形参可以看做是局部变量

作用域链

采取就近原则的方式来查找变量最终的值

<script>
  function f1() {
    let num = 123
    function f2() {  
      let num = 0
      console.log(num)
    }
    f2()
  }
  let num = 456
  f1()
</script>

匿名函数

//——————具名函数——————

声明 function 函数名(){}
调用 函数名()

//——————匿名函数——————

声明 let 变量名 = function(){}
调用 变量名()
传参 变量名(参数)

//———————————————————

//例1
let btn = document.querySelector('button')
btn.onclick = function(){
  alert('123')
}

//例2
let btn = document.querySelector('button')
btn.addEventListener('click',function(){
    alert('123')
})

立即执行函数

防止变量污染

场景:避免全局变量之间的污染

立即执行无需调用

//写法1
(  function(){}  )()

//写法2
(  function(){} () )

注意:多个立即执行函数要用 ; 隔开，要不然会报错