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 相关文章推荐
jquery判断RadioButtonList和RadioButton中是否有选中项示例
Sep 29 Javascript
js实现Select下拉框具有输入功能的方法
Feb 06 Javascript
详解AngularJS的通信机制
Jun 18 Javascript
JavaScript实现添加及删除事件的方法小结
Aug 04 Javascript
JavaScript常用本地对象小结
Mar 28 Javascript
JS 数字转换为大写金额的简单实例
Aug 04 Javascript
Validform表单验证总结篇
Oct 31 Javascript
jQuery ajax的功能实现方法详解
Jan 06 Javascript
html+javascript+bootstrap实现层级多选框全层全选和多选功能
Mar 09 Javascript
jQuery子选择器与可见性选择器实例分析
Jun 28 jQuery
JS实现骰子3D旋转效果
Oct 24 Javascript
40行代码把Vue3的响应式集成进React做状态管理
May 20 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
用户的详细注册和判断
2006/10/09 PHP
php 生成随机验证码图片代码
2010/02/08 PHP
thinkphp实现多语言功能(语言包)
2014/03/04 PHP
PHP使用xpath解析XML的方法详解
2017/05/20 PHP
php判断str字符串是否是xml格式数据的方法示例
2017/07/26 PHP
浅谈laravel-admin form中的数据,在提交后,保存前,获取并进行编辑
2019/10/21 PHP
javascript 兼容鼠标滚轮事件
2009/04/07 Javascript
JavaScript几种形式的树结构菜单
2010/05/10 Javascript
js实现简单的星级选择器提交效果适用于评论等
2013/10/18 Javascript
js每隔5分钟执行一次ajax请求的实现方法
2013/11/27 Javascript
解决jquery中美元符号命名冲突问题
2014/01/08 Javascript
你所未知的3种Node.js代码优化方式
2016/02/25 Javascript
前端js弹出框组件使用方法
2020/08/24 Javascript
vue 2.0封装model组件的方法
2017/08/03 Javascript
JavaScript 判断对象中是否有某属性的常用方法
2018/06/14 Javascript
深入理解令牌认证机制(token)
2019/08/22 Javascript
taro小程序添加骨架屏的实现代码
2019/11/15 Javascript
javascript实现一款好看的秒表计时器
2020/09/05 Javascript
基于Vant UI框架实现时间段选择器
2020/12/24 Javascript
Python实现自动添加脚本头信息的示例代码
2016/09/02 Python
Python操作Access数据库基本步骤分析
2016/09/19 Python
Selenium 模拟浏览器动态加载页面的实现方法
2018/05/16 Python
Python3 venv搭建轻量级虚拟环境的步骤(图文)
2019/08/09 Python
如何在windows下安装配置python工具Ulipad
2020/10/27 Python
python实现图片,视频人脸识别(opencv版)
2020/11/18 Python
纯CSS3打造动感漂亮时尚的扇形菜单
2014/03/18 HTML / CSS
乐高奥地利官方商店:LEGO Shop AT
2019/07/16 全球购物
过滤器的用法
2013/10/08 面试题
战友聚会邀请函
2014/01/18 职场文书
省三好学生申请材料
2014/01/22 职场文书
教师个人自我评价范文
2014/04/13 职场文书
国际经济与贸易专业求职信
2014/07/10 职场文书
求职简历自我评价怎么写
2015/03/10 职场文书
Java生成读取条形码和二维码的简单示例
2021/07/09 Java/Android
Springboot如何同时装配两个相同类型数据库
2021/11/17 Java/Android
PHP RabbitMQ消息列队
2022/05/11 PHP