JS自执行函数,匿名函数

自执行函数

  1. 先来看个最简单的自执行函数
(function(){    }());

相当于声明并调用

var b=function () {       }b()
  1. 自执行函数也可以有名字
function b(){    ...}()
  1. 自执行函数也可以传参
function b(i){    console.log(i)}(5)

下面我们来总结一下自执行函数:

· 自执行函数在调用上与普通函数一样,可以匿名,可以传参。只不过是在声明的时候自调用了一次

· 自执行函数的写法有两种 , 推荐第二种写法

   // 1.第一种方式: 两个()() ,function写在第一个()里面   (function(){})()   // 2.第二种方式: 一个() ,里面写 function(){}()   (function(){}())

匿名函数

匿名函数就是没有名字的函数

匿名函数通常与自执行函数结合使用,因为匿名函数没有函数名,没办法调用,通过自执行调用

匿名函数的基本形式为

(function(){...})();

前面的括号包含函数体,后面的括号就是给匿名函数传递参数并立即执行之

匿名函数的作用是避免全局变量的污染以及函数名的冲突

1.小括号的作用

小括号能把我们的表达式组合分块,并且每一块,也就是每一对小括号,都有一个返回值。

这个返回值实际上也就是小括号中表达式的返回值。

所以,当我们用一对小括号把匿名函数括起来的时候,实际上小括号对返回的,就是一个匿名函数的Function 对象。

因此,小括号对加上匿名函数就如同有名字的函数般被我们取得它的引用位置了。

所以如果在这个引用变量后面再加上参数列表,就会实现普通函数的调用形式。

简单来说就是小括号有返回值,也就是小括号内的函数或者表达式的返回值,所以说小括号内的function返回值等于小括号的返回值

2.匿名函数的写法

方式1,调用函数,得到返回值。强制运算符使函数调用执行

(function(x,y){    return x+y;}(3,4)); 

方式2,调用函数,得到返回值。强制函数直接量执行再返回一个引用,引用再去调用执行

(function(x,y){    return x+y;})(3,4); 

这种方式也是很多库爱用的调用方式,如jQuery,Mootools。

方式3,使用void

void function(x) {    x = x-1;}(9);

方式4,使用-/+运算符

-function(x,y){    return x+y;}(3,4);+function(x,y){    return x+y;}(3,4);--function(x,y){    return x+y;}(3,4);++function(x,y){    return x+y;}(3,4); 

方式5,使用波浪符(~)

~function(x, y) {    return x+y;}(3, 4); 

方式6,匿名函数执行放在中括号内

[function(){    console.log(this) // 浏览器得控制台输出window}(this)] 

方式7,匿名函数前加typeof

typeof function(){console.log(this) // 浏览器得控制台输出window}(this) 

匿名自执行函数

匿名自执行函数首先是一个匿名函数,但是这个函数是可以自己自动执行的,不需要借助其他的元素

匿名自执行函数的作用:

· 匿名自执行函数最常见的作用是用于实现闭包的情况中

· 匿名自执行函数还可以用于在js中模拟创建块级作用域

匿名函数

function () {       }

自执行

(function(){          //代码 })();

匿名函数自执行 实现 异步函数递归

详情可参考 icode仓库的 js/异步递归调用.js

目标:在setTimeout异步函数中依次 打印 0 1 2 3 4

(function async(i) {        if (i >= 5)        return    else                setTimeout(() => {            console.log(i)            i++            async(i)        }, 1000)    })(0)
(0)

相关推荐

  • 用一个例子理解JS函数的底层处理机制

    个人笔记,如有错误烦请指正 以下面代码的运行举例,一行行进行运行的解析 var x = [12, 23]; function fn(y) { y[0] = 100; y = [100]; y[1] = ...

  • Node.js 概述

    Node.js 概述 1. 简介 Node是JavaScript语言的服务器运行环境. 所谓"运行环境"有两层意思:首先,JavaScript语言通过Node在服务器运行,在这个意 ...

  • JavaScript入门-函数function(一)

    js函数(function) function的英文是[功能],[数] 函数:职责:盛大的集会的意思 在js里,就是函数的意思.在Java里叫做方法. 定义函数 function fun(参数){ / ...

  • JavaScript(六)-函数

    函数:定义函数 定义方式 第一种定义方式:可在后面定义前面调用.可提前调用 function gg(){ console.log("函数内部的代码"); } 第二种定义方式:必须先 ...

  • 关于javascript中的promise的用法和注意事项

    一.promise描述 promise是javascript中标准的内置对象,用于表示一个异步操作的最终状态(是失败还是成功完成)及其结果值.它让你能够把异步操作最终成功或者失败的原因和响应的处理程序 ...

  • 深入理解js立即执行函数

    看过jQuery源码的人应该知道,jQuery开篇用的就是立即执行函数.立即执行函数常用于第三方库,好处在于隔离作用域,任何一个第三方库都会存在大量的变量和函数,为了避免变量污染(命名冲突),开发者们 ...

  • JS匿名函数和闭包

    $(function() {}) 是$(document).ready(function()的简写, 这个函数什么时候执行的呢? 答案:DOM 加载完毕之后执行. 立即执行函数(function(){ ...

  • Power Query里的匿名函数是什么鬼?这个例子最典型了。

    小勤:我现在有个按营业额不同等级的提成比例表,怎么用Power Query读到营业额数据表里?如下图所示: 大海:这个问题如果是在Excel里的话,用Lookup函数非常简单. 小勤:这我知道啊,但我 ...

  • 在PHP中如何为匿名函数指定this?

    在PHP中如何为匿名函数指定this? 在之前的文章中,我们已经学习过匿名函数的使用,没有看过的小伙伴可以进入传送门先去了解下闭包匿名函数的用法,传送:还不知道PHP有闭包?那你真OUT了. 关于闭包 ...

  • [PHP小课堂]在PHP中如何为匿名函数指定this?

    [PHP小课堂]在PHP中如何为匿名函数指定this? 关注公众号:[硬核项目经理]获取最新文章 添加微信/QQ好友:[xiaoyuezigonggong/149844827]免费得PHP.项目管理学 ...

  • Node.js 中的异步 Generator 函数和 Websockets

    前端大全 3天前 以下文章来源于大前端技术之路 ,作者浥阳 大前端技术之路分享Web前端,Node.js.React Native等大前端技术栈精选 (给前端大全加星标,提升前端技能) 英文:Vale ...

  • Python中的匿名函数

    原创 DBA随笔 DBA随笔 1周前 // Python中的匿名函数 // 写python的时候,大多数场景下,我都是if else选手,因为最核心的逻辑几乎都是通过if else语句来实现的.关于匿 ...

  • JS 常用的一些功能性函数 (自用)

    平时常用的一些功能性函数 关于原生JS 16进制转rgb()或rgba()字符串 const hexToRgb = (hexT, opacity) => { const rgb = []; le ...

  • 匿名函数没有自己的this

    匿名函数没有自己的this,因此,在构造对象中调用全局函数时,可以省去保存临时this,再将其传入全局函数这一步: 1 <!DOCTYPE html> 2 <html lang=&q ...