JavaScript嵌套函数、匿名函数、自调用函数(IIFE)

函数

  • 一个工具,被封装好可重复执行的一段代码块
  • 把某一段代码放在函数里面进行封装,可以避免在非必要情况下调用该代码,也就是说我们可以让一段代码在特定情况下再去执行,而且每次需要执行这一段代码的时候只需调用一下这个函数即可(函数名)
  • 系统函数: parseInt() alert() prompt() eval()
  • 自定义函数:自己封装一段代码,需要的时候再调用
     function fn () {
      // 需要重复执行的代码
      console.log(456)
    }
    fn()
    
    function Fn () {
      // 需要重复执行的代码
      console.log(456)
    }
    // 调用函数:函数名加小括号
    Fn()
  • 函数的声明(定义),这个时候代码并不会执行
  • 函数名的规范和变量命规范一致:数字字母下划线$,并且不能以数字开头
  • 驼峰命名
  • 大小写是敏感的:fn和Fn是两个不同的函数
    // 声明函数的第二种方式(了解)
    var test = function () {
      console.log(789)
    }
    // 调用test函数
    test()

函数参数

形参:形式参数,声明函数的时候写在小括号里面的参数,无需var

实参:实际参数,在函数调用的时候需要传递实际有值得参数

实参个数大于形参,多余实参自动舍弃

形参个数大于实参,多余形参默认为undefined

实参副本arguments:可以在函数内部使用arguments接收所传递过来的参数,是一个集合

作用域

  • 区分变量的作用域以函数区分,函数内部声明的就是局部变量,外部声明的就是全局变量

  • 作用域:变量的作用范围

  • 全局变量

    作用范围为整个程序的执行范围

    在函数体外部定义的变量就是全局变量

    在函数体内部不使用var定义的也是全局变量

  • 局部变量

    作用范围是某个函数体内部

    在函数体内部通过var关键字定义的变量或者形参,都是局部变量

    当局部变量与全局变量重名时,在函数体内部局部变量优先于全局变量

 <script>
    var a = 20
    function fn () {
      var b = 30
      // 局部作用域可以访问全局变量
      console.log(a, b)
    }
    fn()
    // 全局作用域访问不到局部变量
    console.log(b)
  </script>
  • a变量是页面一加载立马就声明了,这个变量称之为全局变量
  • b变量在fn函数内部声明的,这种变量我们称之为fn的局部变量
  • b的作用范围是当前函数fn

return关键字

  • 函数内部计算出来这个结果以后可以在全局返回收到这个值

  • return 关键字可以在函数运行完成以后返回一个值,返回到了函数的调用位置

    1.结束函数的执行

    2.交回函数执行权

    3.返回一个结果函数调用位置

 <script>
    function sum (a, b) {
      var res = a + b
      return res
    }
    var num = sum(3, 6)
    console.log(num)
  </script>

嵌套函数

 <script>
    function sum (a, b) {
      // return a + b
      var n = a + b
      return n
    }
    function fn (x, y) {
       sum(x, y)
    }
      // x,y对于fn来讲是形参,但是对于sum来讲是实参
      // 这里的代码执行的时候意味着fn已经被调用了,fn的实参已经传进来了,也就是说x,y这个时候已经有值了
      var num = sum(x, y)
      console.log(num)
    }
    fn(1, 2)
  </script>
 <script>
    function sum (a, b) {
      // return a + b
      var n = a + b
      return n
    }
    function fn (x, y) {
      // 在fn里声明sum1这个函数,这个函数成为fn的局部函数
      // 也就意味着sum1只能在fn内部调用
      function sum1 (a, b) {
        return a + b
      }
      // sum1是fn的局部函数,全局不能调用的
     console.log(sum1(3, 4)) // 报错
  </script>

匿名函数

function () {
    console.log(123)
}
//命名方式
var test = function () {
    console.log(123)
}
//点击事件
div.onclick = function () {
    console.log(123)
}

自调用函数(IIFE)

  • Immediately Invoked Function Expression ( 立即调用函数表达式)
;(function () {
    console.log(123)
})()
 <script>
    // 在封装一个函数的同时立马就调用
    // 函数只会在一开始的时候被调用一次
    ;(function () {
      // num是局部变量,节约内存空间
      var num = 123
      console.log(num)
    })()
    
    // 写IIFE的时候如果前面的代码没有分号,那么需要在IIFE前面加上一个分号
    ;(function (n) {
      console.log(n)
    })(3)
  </script>

注意:自调用函数如果前一行没有分号,要在前面加上分号

发布了62 篇原创文章 · 获赞 0 · 访问量 538

猜你喜欢

转载自blog.csdn.net/qq_43633053/article/details/105422489