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


Posted in Javascript onJune 21, 2019

本文实例讲述了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.3water.com/code/HtmlJsRun测试上述代码运行效果。

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

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

Javascript 相关文章推荐
爱恋千雪-US-AscII加密解密工具(网页加密)下载
Jun 06 Javascript
js 操作符实例代码
Oct 24 Javascript
Javascript中常见的校验如域名、手机、邮箱等等
Jan 02 Javascript
jquery实现初次打开有动画效果的网页TAB切换代码
Sep 06 Javascript
JS实现自定义简单网页软键盘效果代码
Nov 05 Javascript
JS实现的DIV块来回滚动效果示例
Feb 07 Javascript
Vue.js bootstrap前端实现分页和排序
Mar 10 Javascript
基于JS实现移动端左滑删除功能
Jul 28 Javascript
基于Bootstrap表单验证功能
Nov 17 Javascript
JSON字符串操作移除空串更改key/value的介绍
Jan 05 Javascript
vue实现压缩图片预览并上传功能(promise封装)
Jan 10 Javascript
如何利用Node.js与JSON搭建简单的动态服务器
Jun 16 Javascript
微信小程序实现圆形进度条动画
Nov 18 #Javascript
JavaScript迭代器的含义及用法
Jun 21 #Javascript
js事件触发操作实例分析
Jun 21 #Javascript
微信小程序实现下拉刷新动画
Jun 21 #Javascript
vue elementUI使用tabs与导航栏联动
Jun 21 #Javascript
Ajax请求时无法重定向的问题解决代码详解
Jun 21 #Javascript
vue配置文件实现代理v2版本的方法
Jun 21 #Javascript
You might like
高亮度显示php源代码
2006/10/09 PHP
PHP中addslashes()和stripslashes()实现字符串转义和还原用法实例
2016/01/07 PHP
深入认识JavaScript中的函数
2007/01/22 Javascript
一段多浏览器的&quot;复制到剪贴板&quot;javascript代码
2007/03/27 Javascript
jQuery EasyUI API 中文文档 - NumberBox数字框
2011/10/13 Javascript
js对象与打印对象分析比较
2013/04/23 Javascript
javascript实现数字验证码的简单实例
2014/02/10 Javascript
浅析jquery的js图表组件highcharts
2014/03/06 Javascript
jquery带动画效果幻灯片特效代码
2015/08/27 Javascript
快速掌握Node.js事件驱动模型
2016/03/21 Javascript
JS代码实现table数据分页效果
2016/05/26 Javascript
js获取页面引用的css样式表中的属性值方法(推荐)
2016/08/19 Javascript
arcgis for js 修改infowindow样式的方法
2016/11/02 Javascript
AngularJS+bootstrap实现动态选择商品功能示例
2017/05/17 Javascript
Angular数据绑定机制原理
2018/04/17 Javascript
Vuex 使用及简单实例(计数器)
2018/08/29 Javascript
webpack 3.X学习之多页面打包的方法
2018/09/04 Javascript
微信小程序自定义toast组件的方法详解【含动画】
2019/05/11 Javascript
[07:47]DOTA2国际邀请赛采访专栏:探访Valve总部
2013/08/08 DOTA
[01:34]2014DOTA2展望TI 剑指西雅图VG战队专访
2014/06/30 DOTA
[58:29]DOTA2-DPC中国联赛 正赛 Phoenix vs XG BO3 第一场 1月31日
2021/03/11 DOTA
python3.3使用tkinter开发猜数字游戏示例
2014/03/14 Python
在scrapy中使用phantomJS实现异步爬取的方法
2018/12/17 Python
django认证系统 Authentication使用详解
2019/07/22 Python
关于python导入模块import与常见的模块详解
2019/08/28 Python
python如何查看网页代码
2020/06/07 Python
经理秘书找工作求职信
2013/12/19 职场文书
物流合作计划书
2014/01/10 职场文书
道德模范先进事迹
2014/02/14 职场文书
应聘教师自荐书
2014/06/16 职场文书
2014年高中教师工作总结
2014/12/19 职场文书
保管员岗位职责
2015/02/14 职场文书
2015年度个人工作总结报告
2015/10/24 职场文书
创业计划书之网吧
2019/10/10 职场文书
PyTorch 如何设置随机数种子使结果可复现
2021/05/12 Python
Go获取两个时区的时间差
2022/04/20 Golang