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. 深入浅出Cache

    章节 ① 什么是Cache? Cache的目标? ② Caching住哪些内容? ③ 我们想要的Cache产品 ④ Cache使用方式 ⑤ 对于总体系统的提高 ⑥ 关于Sharding ⑦ Cache ...

  2. mysql客户端(Navicat)远程登录操作遇到问题1142 - XXX command denied to ×××

    新建的dbtest用户,访问新建立的TestDB数据库每次都提示1142错误(已经对数据库TestDB赋予了所有权限) 解决方法: Mysql命令: GRANT SELECT ON mysql.* T ...

  3. EasyUi---searchbox 条件查询

    前台UI参考代码: <script type="text/javascript" charset="utf-8"> $(function(){ /* ...

  4. *.ashx一般处理程序不能访问Session值的解决方法

    <%@ WebHandler Language="C#" Class="productHandler" %> using System; using ...

  5. 写给大忙人的JavaSE 8 - 学习

    前面有提到过lambda和函数式接口,但是JavaSE 8 除了这两个新特性之后还提供了很多有用的东西.例如Stream. 摸索了几天,终于弄明白Stream的应用了. 先推荐一篇文章:Java 8 ...

  6. 您可以从 Windows 命令行上运行 gcc、g++、ar、ranlib、dlltool 和其他一些 GNU 工具

    Windows 上的安装为了在 Windows 上安装 GCC,您需要安装 MinGW.为了安装 MinGW,请访问 MinGW 的主页 www.mingw.org,进入 MinGW 下载页面,下载最 ...

  7. bootstrap -- meta中的viewport指令

    在查看bootstrap教程中,碰到 <meta name="viewport" content="width=device-width, initial-scal ...

  8. linux -- gedit快捷键

    Shortcuts for tabs:Ctrl + Alt + PageDown     Switches to the next tab to the left.Ctrl + Alt + PageD ...

  9. .net FrameWork各个版本之间的发展[转]

    上个星期看到了.NET 4.0框架退休日期逐渐临近文章,发现自己一直在使用NET  FrameWork,身为一个NET程序员,里面大概的区别自己还是知道的,但是自己要说出个所以然来了,发现还是有点力不 ...

  10. c++ 转化

    atof(将字符串转换成浮点型数)相关函数atoi,atol,strtod,strtol,strtoul表头文件#include定义函数double atof(const char *nptr);函数 ...