1.匿名函数的常见场景

js中的匿名函数是一种很常见的函数类型,比较常见的场景:

  1.  
    <input type="button" value="点击" id="btn">
  2.  
    <script type="text/javascript">
  3.  
    //匿名函数的第一种情形
  4.  
    var btn=document.querySelector("#btn");
  5.  
    btn.onclick=function(){
  6.  
    // alert("aaaaa");
  7.  
    }
  8.  
    //匿名函数的第二种情形
  9.  
    setInterval(function(){
  10.  
    // alert("bbbbb");
  11.  
    }, 1000);
  12.  
    //匿名函数的第三种情形
  13.  
    var fun=function(){
  14.  
    alert("ccccc");
  15.  
    }
  16.  
    // fun();
  17.  
    //匿名函数的第四种情形
  18.  
    var obj={
  19.  
    name:"dddd",
  20.  
    say:function(){
  21.  
    alert(this.name);
  22.  
    }
  23.  
    }
  24.  
    obj.say();
  25.  
    </script>

上面展示的就是常见的匿名函数的使用场景。(注意:querySelector是H5中新增的查找dom元素的方法)

2.匿名自执行函数

见名思义,匿名自执行函数首先是一个匿名函数,但是这个函数是可以自己自动执行的,不需要借助其他的元素。
  1.  
    <input type="button" value="点击" id="btn">
  2.  
    <script type="text/javascript">
  3.  
    //1,匿名函数的第一种实现方式
  4.  
    (function(data){
  5.  
    // alert(data);
  6.  
    })("eee");
  7.  
    //2.匿名自执行函数的第二种实现方式
  8.  
    (function(){
  9.  
    // alert("fff");
  10.  
    }());
  11.  
    //3.匿名自执行函数的第三种实现方式
  12.  
    !function(data){
  13.  
    // alert(data);
  14.  
    }("hhh");
  15.  
    //4.匿名自执行函数的第四种实现方式
  16.  
    var fun=function(data){
  17.  
    alert(data);
  18.  
    }("iii");
从上面的代码块中我们可以总结出实现匿名自执行函数的方法一般有四种。

3.匿名自执行函数的作用

1.匿名自执行函数最常见的作用是用于实现闭包的情况中。关于闭包的概念我会在后面的博客中详细介绍。这里简单说明一下闭包。闭包:闭包是js的一种特性,我们可以通过闭包实现函数内外部的连接,并且可以使得函数的局部变量始终存在于内存中。
 
2.匿名自执行函数还可以用于在js中模拟创建块级作用域,即如果使用匿名自执行函数将某些代码包裹起来可以实现块级作用域的效果,减少全局变量的数量,在匿名自执行函数执行结束后变量就会被内存释放掉,从而也会节省了内存。
 

4,匿名函数和匿名自执行函数总结

匿名函数可以简单理解为没有名字的函数,常见的场景一共就有4种。
匿名自执行函数可以简单理解为可以自己执行的匿名函数,实现匿名自执行函数的方式一共有4种。
匿名自执行函数的作用就是用于闭包和创建独立的命名空间两个方面。

js中的匿名函数和匿名自执行函数的更多相关文章

  1. js进阶js中支持正则的四个常用字符串函数(search march replace split)

    js进阶js中支持正则的四个常用字符串函数(search march replace split) 一.总结 代码中详细四个函数的用法 search march replace split 二.js进 ...

  2. js中使用function定义类、实例化,函数的调用方法

    function Test002(name, age){ name, age, this.printInfo = function(){ //定义的公有方法 console.log(name, age ...

  3. JS中var声明与function声明两种函数声明方式的区别

    JS中常见的两种函数声明(statement)方式有这两种: // 函数表达式(function expression) var h = function() { // h } // 函数声明(fun ...

  4. js中函数表达式和自执行函数表达式的用法总结

    立即调用函数表达式 给函数体加大括号,在有变量声明的情形下,没有任何区别 但是,如果只是[自动执行]的情形下,就会不同 因为,一个匿名函数,不赋值或函数体不加小括号,是不能自动执行的 //以下情形并无 ...

  5. 在js中获取query string 以及重写URL的函数

    函数用途:如标题.1. 从URL中解析出參数,2.重写URL中的參数值 例如以下代码所看到的.包括了測试.能够直接copy到浏览器中,输入測试地址:localhost:xxx?a=1&b=2& ...

  6. JS中有关分支结构、循环结构以及函数应用的一些简单练习

    案例一:搬桌子    年龄大于七岁男女都可以搬桌子,年龄小于七岁大于五岁的男生可以搬桌子: var num =parseInt(prompt("请输入你的年龄")) var sex ...

  7. jquery中ready函数,$(function(){})与自执行函数的区别

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  8. koa-graphql express-graphql 中如何 定义每一个字段resolver执行函数

    第一种方式:  首先来看一下,官方给出的koa-graphql的例子, ```js var express = require('express'); var {graphqlHTTP} = requ ...

  9. js中try、catch、finally的执行规则

    首先一个常识就是,在浏览器执行JS脚本过程中,当出现脚本错误,并且你没有手动进行异常捕捉时,他会在浏览器下面出现黄色的叹号,这是正常的,这也不是最重要的,最重要的是,出错行以下的所有JS代码将中停执行 ...

  10. js中变量名加“-” new Vue()不执行

    如var app-1 = new Vue(): 不执行的 var app1 = new Vue(): 才能执行

随机推荐

  1. QFTPERROR lists

  2. PHP框架之ThinkPHP项目CMS内容管理系统源码及开发手册视频

    http://download.csdn.net/download/duguqing/4203042

  3. 一些必看的jQuery导航插件和教程

    导航是一个网站最重要的元素之一,您必须遵循统一的风格来设计您的网站,特别是导航的风格,让用户可以轻松地找到他们想要的内容.这里最大的部分是开发一个菜单,即要直观易用,又要符合你网站的设计风格.本文列举 ...

  4. .net开发遇到的一个问题

    之前项目有个entity是写在Entity层的,相关的配置项也写死在程序里了,而且还是个static的配置,后来有了新需求,上峰指示要从CMS读取配置内容,大概是要在BLL实现,BLL依赖IBLL的I ...

  5. 关于Cocos2d-x中多边形物理刚体的设置

    1.如果想要设置某个物体有多边形的刚体,这样可以更精确地进行碰撞检测,可以用以下的方法 auto hero = PlaneHero::create(); addChild(hero, 0, HERO_ ...

  6. python 向qq邮箱发邮件

    #coding:utf-8 ''' Created on 2017-1-12 @author: xiaochun ''' import smtplib from email.mime.text imp ...

  7. ‘,’之后要留空格,如 Function(x, y, z)

    ‘,’之后要留空格,如 Function(x, y, z).如果‘;’不是一行的结束 符号,其后要留空格,如 for (initialization; condition; update). #inc ...

  8. R语言低级绘图函数-symbols

    严格意义上将symbols 并不能算是一个低级的绘图函数,因为它不仅可以在一幅已经存在的图标上添加元素,还可以创建一张新的图表 鉴于它绘图时的灵活性,我把它归入到低级绘图函数中 symbols 可以创 ...

  9. highchart的用法积累

    highcharts 柱子换颜色 var colors = Highcharts.getOptions().colors; $(arr_Y_bfb).each(function (index, ele ...

  10. PHP实现MySQL数据导出为EXCEL(CSV格式)

    <?php // 输出Excel文件头,可把user.csv换成你要的文件名 header('Content-Type: application/vnd.ms-excel'); header(' ...