Skip to content
js
{
      // 普通函数
      function add(a, b) {
        return a + b
      }

      console.log(
        '%c普通函数➜:',
        'background:green;color:#fff;padding:4px;',
        add(1, 2)
      ) // 3

      console.log(
        '%c普通函数➜:',
        'background:green;color:#fff;padding:4px;',
        add
      ) // 函数体

      // 函数表达式-匿名函数
      const add2 = function (a, b) {
        return a + b
      }

      console.log(
        '%c匿名函数➜:',
        'background:blue;color:#fff;padding:4px;',
        add2(1, 2)
      ) // 3

      console.log(
        '%c匿名函数➜:',
        'background:blue;color:#fff;padding:4px;',
        add2
      ) // 函数体

      // 函数表达式 - 命名函数
      const add3 = function add4(a, b) {
        return a + b
      }

      console.log(
        '%c命名函数➜:',
        'background:red;color:#fff;padding:4px;',
        add3(1, 2)
      ) // 3

      console.log(
        '%c命名函数➜:',
        'background:red;color:#fff;padding:4px;',
        add3
      ) // 函数体

      //   console.log(
      //     '%c命名函数➜:',
      //     'background:yellow;color:#fff;padding:4px;',
      //     add4(1, 2)
      //   ) // 报错undefined

      //   console.log(
      //     '%c命名函数➜:',
      //     'background:yellow;color:#fff;padding:4px;',
      //     add4
      //   ) //  // 报错undefined

      // 箭头函数
      const add5 = (a, b) => {
        return a + b
      }
      console.log(
        '%c箭头函数➜:',
        'background:purple;color:#fff;padding:4px;',
        add5(1, 2)
      ) // 3
      console.log(
        '%c箭头函数➜:',
        'background:purple;color:#fff;padding:4px;',
        add5
      ) // 函数体
    }

    { /* 立即执行函数 */
      
      (function () {
        console.log('这是立即执行函数A')
      })()

      console.log(function () {
        console.log('这是立即执行函数A')
      })

      let test = function () {
        console.log('这是立即执行函数B')
      }

      console.log(test);

      (test)()
    }
{
      // 普通函数
      function add(a, b) {
        return a + b
      }

      console.log(
        '%c普通函数➜:',
        'background:green;color:#fff;padding:4px;',
        add(1, 2)
      ) // 3

      console.log(
        '%c普通函数➜:',
        'background:green;color:#fff;padding:4px;',
        add
      ) // 函数体

      // 函数表达式-匿名函数
      const add2 = function (a, b) {
        return a + b
      }

      console.log(
        '%c匿名函数➜:',
        'background:blue;color:#fff;padding:4px;',
        add2(1, 2)
      ) // 3

      console.log(
        '%c匿名函数➜:',
        'background:blue;color:#fff;padding:4px;',
        add2
      ) // 函数体

      // 函数表达式 - 命名函数
      const add3 = function add4(a, b) {
        return a + b
      }

      console.log(
        '%c命名函数➜:',
        'background:red;color:#fff;padding:4px;',
        add3(1, 2)
      ) // 3

      console.log(
        '%c命名函数➜:',
        'background:red;color:#fff;padding:4px;',
        add3
      ) // 函数体

      //   console.log(
      //     '%c命名函数➜:',
      //     'background:yellow;color:#fff;padding:4px;',
      //     add4(1, 2)
      //   ) // 报错undefined

      //   console.log(
      //     '%c命名函数➜:',
      //     'background:yellow;color:#fff;padding:4px;',
      //     add4
      //   ) //  // 报错undefined

      // 箭头函数
      const add5 = (a, b) => {
        return a + b
      }
      console.log(
        '%c箭头函数➜:',
        'background:purple;color:#fff;padding:4px;',
        add5(1, 2)
      ) // 3
      console.log(
        '%c箭头函数➜:',
        'background:purple;color:#fff;padding:4px;',
        add5
      ) // 函数体
    }

    { /* 立即执行函数 */
      
      (function () {
        console.log('这是立即执行函数A')
      })()

      console.log(function () {
        console.log('这是立即执行函数A')
      })

      let test = function () {
        console.log('这是立即执行函数B')
      }

      console.log(test);

      (test)()
    }