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. PHP中动态增加属性到对象

    参见: <深入PHP 面向对象.模式与实践>(第三版) [ matt zandstra ] - 3.2章节,设置类中的属性(p17)

  2. http://www.casualarena.com/

    http://www.casualarena.com/ ———————————————————————————————————————————— 包括祖玛.台球.国际象棋等双人联机小游戏.

  3. 隐藏的Swiper显示后无法获取正确的宽度和高度

    今天在使用swiper的时候,元素默认是显示的时候没毛病,但是默认是隐藏的状态,再显示的时候发现滑动的时候宽度计算有误,如下图所示: 正确的显示如下: 隐藏的元素再次显示如下: 宽度计算有误 解决方案 ...

  4. javascript获取URL参数和参数值

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. WordCount示例深度学习MapReduce过程

    转自: http://blog.csdn.net/yczws1/article/details/21794873 . 我们都安装完Hadoop之后,按照一些案例先要跑一个WourdCount程序,来测 ...

  6. Java 经典问题

    九种基本类型及封装类 基本类型 boolean byte char short int long double void 二进制位数 1 8(一字节) 16(2字节) 16(2字节) 32(4字节) ...

  7. e646. 处理鼠标点击事件

    component.addMouseListener(new MyMouseListener()); public class MyMouseListener extends MouseAdapter ...

  8. nodejs基础 -- 交互式解析器(REPL)

    ------------类似在浏览器中调试js代码----------------------- Node.js REPL(交互式解释器) Node.js REPL(Read Eval Print L ...

  9. CentOS系统程序包管理器【rpm、yum】

    将编译好的文件打包成一个或有限的几个文件,可用于实现便捷的安装.卸载.升级.查询,校验等程序管理. centos常用的程序管理器有rpm和yum rpm: redhat package manager ...

  10. 【Java面试题】36 List、Map、Set三个接口,存取元素时,各有什么特点?

    List与Set都是单列元素的集合,它们有一个功共同的父接口Collection. Set里面不允许有重复的元素, 存元素:add方法有一个boolean的返回值,当集合中没有某个元素,此时add方法 ...