JS中的匿名函数自执行、函数声明与函数表达式

先看一段jQuery源码中匿名函数自执行的例子:

1(function( window, undefined ) { 2 // jquery code 3 })(window);

另外一种常见的写法:

1+function( $ ) { 2 // jquery code 3 })(window.jQuery);

这两种写法该如何理解呢?第二种写法前面为何要加“+”号,不加会是什么结果呢?

1 function( $ ) { 2 // jquery code 3 })(window.jQuery); // 报错: Uncaught SyntaxError: Unexpected token (

先理解一些概念性的东西 

函数表达式(Function Expression)

  • 将函数定义为表达式语句(通常是变量赋值)的一部分

  • 通过 Function Expression 定义的函数可以是命名的,也可以是匿名的

  • Function Expression 不能以“function”开头,只用通过函数左侧的变量来调用

    a(); // 错误调用 Uncaught TypeError: a is not a function var a = function(){ alert('Function expression'); } a(); // 正确

函数声明(Function Declaration)

  • 可以定义命名的函数变量,而无需给变量赋值

  • 函数声明在JS解析时进行函数提升,因此在同一个作用域内,不管函数声明在哪里定义,该函数都可以进行调用

  • JS将function当作一个函数声明的开始,而函数声明后面不能跟圆括号直接进行调用 

    a(); // 这里可以正确调用 function a(){ alert('Function declaration'); } a(); // 这里可以正确调用

错误原因解析

1 function( $ ) { 2 // jquery code 3 })(window.jQuery); // 报错: Uncaught SyntaxError: Unexpected token (
  • 当js编译器开始执行的时候,碰见function之后,看到它周围没有任何东西。于是就把function关键字解析成函数声明,而函数声明后面不能跟圆括号直接进行调用,因此导致后面运行出错了
  • 我们只需要用一个括号把这个匿名函数包裹起来,或者前面使用如-,~,!这种其它的一元操作符,目的是告诉解析器在这些特定操作符附近的是一个表达式,避免js编译器将function关键字解析成函数声明,然后代码就能够正常执行

参考

https://www.jianshu.com/p/82cb460af066

https://www.cnblogs.com/cndotabestdota/p/5664112.html

点赞
收藏

评论区

加载中...

相关推荐

MySQL:[Err] 1292 - Incorrect datetime value: ‘0000-00-00 00:00:00‘ for column ‘CREATE_TIME‘ at row 1

文章目录问题用navicat导入数据时,报错:原因这是因为当前的MySQL不支持datetime为0的情况。解决修改sql\mode:sql\mode:SQLMode定义了MySQL应支持的SQL语法、数据校验等,这样可以更容易地在不同的环境中使用MySQL。全局s

Oracle 分组与拼接字符串同时使用

SELECTT.,ROWNUMIDFROM(SELECTT.EMPLID,T.NAME,T.BU,T.REALDEPART,T.FORMATDATE,SUM(T.S0)S0,MAX(UPDATETIME)CREATETIME,LISTAGG(TOCHAR(

MySQL部分从库上面因为大量的临时表tmp_table造成慢查询

背景描述Time:20190124T00:08:14.70572408:00User@Host:@Id:Schema:sentrymetaLast_errno:0Killed:0Query_time:0.315758Lock_

皕杰报表之UUID

​在我们用皕杰报表工具设计填报报表时,如何在新增行里自动增加id呢?能新增整数排序id吗?目前可以在新增行里自动增加id,但只能用uuid函数增加UUID编码,不能新增整数排序id。uuid函数说明:获取一个UUID,可以在填报表中用来创建数据ID语法:uuid()或uuid(sep)参数说明:sep布尔值,生成的uuid中是否包含分隔符'',缺省为

手写Java HashMap源码

HashMap的使用教程HashMap的使用教程HashMap的使用教程HashMap的使用教程HashMap的使用教程22

2020年前端实用代码段,为你的工作保驾护航

有空的时候,自己总结了几个代码段,在开发中也经常使用,谢谢。1、使用解构获取json数据let jsonData  id: 1,status: "OK",data: 'a', 'b';let  id, status, data: number   jsonData;console.log(id, status, number )

JS中的匿名函数自执行、函数声明与函数表达式 - HelloWorld