JS中超越现实的匿名函数用法实例分析

 更新时间:2019-06-25 03:00:55   作者:佚名   我要评论(0)

本文实例讲述了JS中超越现实的匿名函数用法。分享给大家供大家参考,具体如下:
一般函数:


function show1(name){
alert(name); //打印:zhangsan
}

本文实例讲述了JS中超越现实的匿名函数用法。分享给大家供大家参考,具体如下:

一般函数:

function show1(name){
    alert(name); //打印:zhangsan
  }
show1("zhangsan");

匿名函数:

var show2 = function (name) {
    alert(name); //打印:张三
  }
show2("张三");

上面2种定义函数的区别:

1.我们知道所有的function都会在window对象里

  function show1(name){
    alert(name); //打印:张三
  }
  window.show1("张三");

即使在函数定义之前调用

  window.show1("张三");
  function show1(name){
    alert(name); //打印:张三
  }

这是因为这种”有名字”的函数在JS引擎初始化的时候就加载到作用域里面

2.如果是匿名函数

  window.show2("李四");
  var show2 = function (name) {
    alert(name); //打印:李四
  }

控制台会打印:TypeError: window.show2 is not a function

二、如果我们需要合并上面2个函数

<script>
  function show(name) {
    return function () {
      alert(name); //内部函数是可以调用外层的变量的
    }
  }
  show("王五");
</script>

猜猜会打印什么?什么也没有,也不会报错。这是因为执行show()只是返回了一个函数本身,并没有执行这个函数。

show("王五")();

这样执行,就打印:王五

如果里面的函数也要传入变量

<script>
  function show(name) {
    return function (age) {
      alert(name); //打印:王五
      alert(age); //打印:18
    }
  }
  show("王五")(18);
</script>

<script>
  function show(name) {
    return function (name) {
      alert(name);
    }
  }
  show("王五")(18);
</script>

猜猜是打印“王五”还是“18”?只会打印“18”。

三、匿名函数的自执行

<script>
  (function (name) {
    alert(name);  //打印:哈哈
  })("哈哈")
</script>

以上是推荐的写法。

其他写法:

  -function (name) {
    alert(name);  //打印:哈哈
  }("哈哈")

  +function (name) {
    alert(name);  //打印:哈哈
  }("哈哈")

  !function (name) {
    alert(name);  //打印:哈哈
  }("哈哈")

  [function (name) {
    alert(name);  //打印:哈哈
  }("哈哈")]

  new function (name) {
    alert(name);  //打印:哈哈
  }("哈哈")

  ~function (name) {
    alert(name);  //打印:哈哈
  }("哈哈")

  void function (name) {
    alert(name);  //打印:哈哈
  }("哈哈")

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.jb51.net/code/HtmlJsRun测试上述代码运行效果。

更多关于JavaScript相关内容可查看本站专题:《JavaScript常用函数技巧汇总》、《javascript面向对象入门教程》、《JavaScript查找算法技巧总结》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

您可能感兴趣的文章:

  • js中匿名函数的N种写法
  • js中匿名函数的创建与调用方法分析
  • javascript 匿名函数的理解(透彻版)
  • 浅析Javascript匿名函数与自执行函数
  • 详谈JavaScript 匿名函数及闭包
  • Javascript中的匿名函数与封装介绍
  • Javascript中的回调函数和匿名函数的回调示例介绍
  • js匿名函数作为函数参数详解
  • JS自调用匿名函数具体实现
  • js自调用匿名函数的三种写法(推荐)
  • Javascript中匿名函数的多种调用方式总结

相关文章

  • JS中超越现实的匿名函数用法实例分析

    JS中超越现实的匿名函数用法实例分析

    本文实例讲述了JS中超越现实的匿名函数用法。分享给大家供大家参考,具体如下: 一般函数: function show1(name){ alert(name); //打印:zhangsan }
    2019-06-25
  • 使用Vue开发自己的Chrome扩展程序过程详解

    使用Vue开发自己的Chrome扩展程序过程详解

    前言 浏览器扩展程序是可以修改和增强 Web 浏览器功能的小程序。它们可用于各种任务,例如阻止广告,管理密码,组织标签,改变网页的外观和行为等等。 好消
    2019-06-25
  • javascript实现自由编辑图片代码详解

    javascript实现自由编辑图片代码详解

    当下我们项目中需要一个可自由编辑图片的功能,当图片可能出现需要频繁编辑,同时能满足发现裁剪不满意想要微调的时候,会发现如果我们处理图片按照平常的习惯
    2019-06-25
  • vue配置文件实现代理v2版本的方法

    vue配置文件实现代理v2版本的方法

    vue实现不同服务器代理,接上篇,虽然可实现多版本代理,但是每增加一种模式就需要重下新修改vue.config.js以及.env.dev.local,感觉很不智能,扩展性挺差。
    2019-06-25
  • Scala中正则表达式以及与模式匹配结合(多种方式)

    Scala中正则表达式以及与模式匹配结合(多种方式)

    正则表达式 //"""原生表达 val regex="""([0-9]+)([a-z]+)""".r val numPattern="[0-9]+".r val numberPattern="""\s+[0-9]+\s+""".r 说明:.r()方法简
    2019-06-25
  • Ajax请求时无法重定向的问题解决代码详解

    Ajax请求时无法重定向的问题解决代码详解

    前言 今天发现,当使用Ajax请求时,如果后台进行重定向到其他页面时是无法成功的,只能在浏览器地址栏输入才能够实现重定向。 Ajax默认就是不支持重定向的,它
    2019-06-25
  • 前端Electron新手入门教程详解

    前端Electron新手入门教程详解

    Electron 是什么 定义 Electron是一个能让你使用传统前端技术(Nodejs, Javascript, HTML, CSS)开发一个跨平台桌面应用的框架。这里所说的桌面应用指的是
    2019-06-25
  • 微信小程序开发注意指南和优化实践(小结)

    微信小程序开发注意指南和优化实践(小结)

    前言 转眼间已经参与过我厂好几个小程序的开发了,下面本妹子将开发中的那些注意点和各位小伙伴们分享下,妥妥的干货一枚。 一、WXML 不要换行写,有空格不行
    2019-06-25
  • vue elementUI使用tabs与导航栏联动

    vue elementUI使用tabs与导航栏联动

    不使用tabs标签页时,点击导航菜单,router-view映射相应的组件即可显示页面。但我们想在点击导航栏时在tabs中映射相应的组件,这就需要使用tabs组件 在sli
    2019-06-25
  • 深入浅解正则表达式在Java中的使用

    深入浅解正则表达式在Java中的使用

    介绍 &#8226;正则表达式一般用于字符串匹配, 字符串查找和字符串替换. 别小看它的作用, 在工作学习中灵活运用正则表达式处理字符串能够大幅度提高效率, 编
    2019-06-25

最新评论