JS 自执行函数原理及用法


Posted in Javascript onAugust 05, 2019

js自执行函数,听到这个名字,首先会联想到函数。接下来,我来定义一个函数:

function aaa(a,b){
  return sum = a + b
}

定义了一个名为aaa的函数,在里面可以计算两个数的和。如果想执行它,就必须得调用它,并且还得给它传参:

var aa = aaa(1,2)

这样就实现了一个函数的定义与调用,通过console.log我们可以看到sum实现了两个数的相加。

自执行函数是什么?自执行函数就是当它被定义出来,就会自动执行的函数。不需要调用,传参也很方便。就上面的函数,用自执行函数定义就是这样:

(function aaa(a,b){
  return sum = a + b
;})(1,2)

通过控制台可以发现sum实现了两个数的相加。

自执行函数有三种写法:

1.( function ( “ 参数 ” ) { " 函数方法 " ; } ) ( “ 给参数传的值 ” )

2.( function ( " 参数 " ) { “ 函数方法 ” ; } ( " 给参数传的值 " ) )

3.! function ( " 参数 " ) { " 函数方法 " ; } ( " 给参数传的值 " ) 

第三种!可以换作其他运算符或者void。

自执行函数是很自私的,它的内部可以访问全局变量。但是除了自执行函数自身内部,是无法访问它的。例:

function aaa(a1,b1){
  return sum1 = a1 + b1
},
(function bbb(a2,b2){
  return sum2 = a2 + b2
;}(),
console.log(aaa)
console.log(bbb)

这是一个函数与一个自执行函数,输出这两个函数会发现:函数aaa被全部打印出来,而bbb则报错。自执行函数相当于一个瓶口朝下的杯子,当定义它的时候,它会倾斜,把杯口露出来,吸收外面的新鲜空气;当它执行完毕,杯口不再外露,紧闭起来,与外界再无关联。

Javascript 相关文章推荐
js getElementsByTagName的简写方式
Jun 27 Javascript
js图片延迟加载的实现方法及思路
Jul 22 Javascript
js 判断计算字符串长度/判断空的简单方法
Aug 05 Javascript
2016年最热门的15 款代码语法高亮工具,美化你的代码
Jan 06 Javascript
javascript瀑布流式图片懒加载实例解析与优化
Feb 23 Javascript
基于angularjs实现图片放大镜效果
Aug 31 Javascript
Vue.js快速入门教程
Sep 07 Javascript
vue-ajax小封装实例
Sep 18 Javascript
ES6中Array.includes()函数的用法
Sep 20 Javascript
详解html-webpack-plugin用法全解
Jan 22 Javascript
在iFrame子页面里实现模态框的方法
Aug 17 Javascript
openlayers实现地图测距测面
Sep 25 Javascript
jQuery提示框插件SweetAlert用法分析
Aug 05 #jQuery
Nuxt.js实战和配置详解
Aug 05 #Javascript
Vue组件间通信 Vuex的用法解析
Aug 05 #Javascript
前后端常见的几种鉴权方式(小结)
Aug 04 #Javascript
vue的注意规范之v-if 与 v-for 一起使用教程
Aug 04 #Javascript
vue v-for 使用问题整理小结
Aug 04 #Javascript
在Vue项目中用fullcalendar制作日程表的示例代码
Aug 04 #Javascript
You might like
MyEclipse常用配置图文教程
2014/09/11 PHP
PHP获取QQ达人QQ信息的方法
2015/03/05 PHP
PHP数组内存利用率低和弱类型详细解读
2017/08/10 PHP
浅谈laravel5.5 belongsToMany自身的正确用法
2019/10/17 PHP
用jquery来定位
2007/02/20 Javascript
Javascript+XMLHttpRequest+asp.net无刷新读取数据库数据
2009/08/09 Javascript
也说JavaScript中String类的replace函数
2011/09/22 Javascript
javascript阻止浏览器后退事件防止误操作清空表单
2013/11/22 Javascript
深入解析JavaScript编程中的this关键字使用
2015/11/09 Javascript
JavaScript的Vue.js库入门学习教程
2016/05/23 Javascript
jQuery插件编写步骤详解
2016/06/03 Javascript
jQuery简单实现遍历单选框的方法
2017/03/06 Javascript
Vue波纹按钮组件制作
2018/04/30 Javascript
vue完成项目后,打包成静态文件的方法
2018/09/03 Javascript
Vue 页面状态保持页面间数据传输的一种方法(推荐)
2018/11/01 Javascript
JavaScript ES6常用基础知识总结
2019/02/09 Javascript
vue 插件的方法代码详解
2019/06/06 Javascript
layui的select联动实现代码
2019/09/28 Javascript
基于脚手架创建Vue项目实现步骤详解
2020/08/03 Javascript
[01:22:42]2014 DOTA2华西杯精英邀请赛 5 24 DK VS LGD
2014/05/26 DOTA
python显示生日是星期几的方法
2015/05/27 Python
Python的Django REST框架中的序列化及请求和返回
2016/04/11 Python
对python中raw_input()和input()的用法详解
2018/04/22 Python
使用python中的in ,not in来检查元素是不是在列表中的方法
2018/07/06 Python
Django框架搭建的简易图书信息网站案例
2019/05/25 Python
Python如何实现小程序 无限求和平均
2020/02/18 Python
css实例教程 一款纯css3实现的超炫动画背画特效
2014/11/05 HTML / CSS
css3加js做一个简单的3D行星运转效果实例代码
2017/01/18 HTML / CSS
过滤器的用法
2013/10/08 面试题
经贸韩语专业大学生职业规划
2014/02/14 职场文书
《小儿垂钓》教学反思
2014/02/23 职场文书
班级口号大全
2014/06/09 职场文书
解除施工合同协议书
2014/10/17 职场文书
政风行风整改报告
2014/11/06 职场文书
ThinkPHP5和ThinkPHP6的区别
2021/03/31 PHP
Spring IOC容器Bean的作用域及生命周期实例
2022/05/30 Java/Android