JS定义一个立即执行的可重用函数
我定义了一个函数表达式 testFun
var testFun = (function() { ... //函数内容})();
测试结果:虽然 testFun 函数有如愿在页面加载后立即被执行,但再次执行该函数却没有任何效果
testFun(); //在如上定义并立即执行后在其它地方调用该函数,没有效果
目标需求为,在定义一个函数表达式时让这个函数在该JS页面加载完毕后立即执行,而后其它函数需要使用该函数时仍然可以通过函数名 testFun 调用执行。
[注:本文斜体字为示例名称]
也许可以这么干
你也许会说,在定义后直接马上调用执行一次不就行了?就像下面这样:
var testFun = function() { ... //函数内容};testFun();//马上执行该函数
或者还可以这么干:
window.onload=testFun;//将函数应用赋给onload事件var testFun = function() { ... //函数内容};
没错,这是能达到目标效果。但是不太好看。毕竟JS支持声明定义后立即执行函数,为什么不能通过该立即执行函数的引用再次调用它呢?
定义后立即执行的函数表达式
首先,怎么让函数定义后立即执行呢?(注意下例代码中的括号)
方法1:
(function testFun(){ ... //函数内容}());
方法2:
(function testFun(){ ... //函数内容})();
方法3:
var testFun = function(){ ... //函数内容})();
以上方法均能令 testFun 函数在定义后立即被执行。
难以重用以上定义过的函数
如果在同一个JS文件中的其它位置运用以下代码是不会有任何效果的。
testFun();
用typeof测试一下当前的 testFun 是什么类型
alert(typeof(testFun)); //undefined
得到的结果居然是undefined,这是怎么回事呢?
如下例:
testFun = ( function() {...} )();//等价于function A() {...};testFun = A();
原因就是, testFun 定义后立即被执行了,执行完却没有返回值,所以 testFun 未定义(undefined)。
return this如何?
第一反应是,加一个return this试试?
testFun = ( function() { ... return this;})(); //该函数仍旧定义后立即被执行一次
在同一个JS文件的其它地方重新调用该函数
testFun();//没有效果
依旧没有任何效果,还是用typeof测试一下
alert(typeof(testFun)); //Object
为何return this后该“函数表达式”是一个Object而不是function呢?
这是因为return this的this指向的是window!
可行操作
其实,在定义立即执行函数的函数末尾加上 return arguments.callee;
即可达到理想效果,如以上方法3变更为
var testFun = function(){ ... //函数内容 return arguments.callee;})();
那么,这个arguments.callee是何方神圣呢?
arguments.callee
arguments.callee是一个指向正在执行的函数的指针。
这就不难理解上例中arguments.callee的作用了:指向被定义后被立即执行的函数本身并返回给testFun.
不过需要注意的是,在严格模式下,不能通过脚本访问argument.callee,访问这个属性会导致错误!
JS定义一个立即执行的可重用函数的更多相关文章
- Js定义一个表单并提交
Js定义一个表单 var form = $("<form>"); //定义一个form表单 form.attr('style', 'display:none'); // ...
- vue.js定义一个一级的路由 ----由浅入深
#### 定义一个路由- 实例化一个路由并设置路由映射表 - 实例化里面第一个参数 routes 路由映射表 - routes 里面参数 - path 路由的路径 - component 路由对应的组 ...
- js定义一个处理字符串的函数
//定义一个处理字符串的方法 function StringBuffer(str){ var arr = []; str = str || ''; arr.push(str); //追加字符串 thi ...
- 如何用python的装饰器定义一个像C++一样的强类型函数
Python作为一个动态的脚本语言,其函数在定义时是不需要指出参数的类型,也不需要指出函数是否有返回值.本文将介绍如何使用python的装饰器来定义一个像C++那样的强类型函数.接下去,先介绍 ...
- js生成一个不重复的ID的函数的进化之路
在MongoDB中的ObjectID,可以理解为是一个不会重复的ID,这里有个链接http://blog.csdn.net/xiamizy/article/details/41521025感兴趣可以去 ...
- JS 封装一个求n~m的求和函数
var a = 0; cc(2,10); function cc(n,m){ for(var i =n;i<(m+1);i++){ a = a + ...
- 如何定义一个高逼格的原生JS插件
插件的需求 我们写代码,并不是所有的业务或者逻辑代码都要抽出来复用.首先,我们得看一下是否需要将一部分经常重复的代码抽象出来,写到一个单独的文件中为以后再次使用.再看一下我们的业务逻辑是否可以为团队服 ...
- c#定义一个方法,根据存储过程名称和存储过程参数数组,执行对应的存储过程
定义一个根据存储过程名称和存储过程参数数组,执行对应的存储过程的方法.用SqlParameter[]代替存储过程需要的参数.这样就不用为每一个存储过程写一个方法了 1.首先定义一个ExcuteProc ...
- angular.js的ng-app 指令定义一个 AngularJS 应用程序。
<!DOCTYPE html> <html lang="en" ng-app> <head> <meta charset="UT ...
随机推荐
- 文本框JTextField,密码框JPasswordField
1.文本框JTextField public class Demo extends JFrame { public Demo() { setBounds(100, 100, 200, 120); se ...
- JavaScript模板代码总结
//中文input框对非中文的校验 var reg=/[^\u4E00-\u9FA5]/g; if (reg.test($("#jgqc").val())){ alert(&quo ...
- 线程本地变量ThreadLocal (耗时工具)【原】
线程本地变量类 package king; import java.util.ArrayList; import java.util.List; import java.util.Map; impor ...
- Study 3 —— 表格
表格基本格式: <table> <tr> <td></td> <td></td> </tr> <tr> ...
- bzoj千题计划305:bzoj2565: 最长双回文串(回文自动机)
https://www.lydsy.com/JudgeOnline/problem.php?id=2565 正着构造回文自动机 倒过来再构造一个回文自动机 分别求出以位置i开始的和结尾的最长回文串 # ...
- 简述get与post区别
get和post在HTTP中都代表着请求数据,其中get请求相对来说更简单.快速,效率高些. get对于请求数据和静态资源(HTML页面和图片),在低版本浏览器下都会缓存.高版本浏览器只缓存静态资源, ...
- 进度条QProgressBar
import sys from PyQt5.QtCore import Qt, QTimer from PyQt5.QtWidgets import QApplication, QWidget, QP ...
- sybench压测下模拟误truncate数据恢复
基本环境:官方社区版MySQL 5.7.21 Row+Gtid开启sysbench压测,使用mysqldump备份数据库,执行truncate操作,恢复数据到truncate前的时间点1.切换日志,记 ...
- 列式数据库~clickhouse 数据同步使用
一 简介:进一步了解clickhouse二 数据操 1 单机建表 create TABLE aaa ( id UInt32, uid UInt32, amount Float64, ...
- AJAX请求头Content-type
发送json格式数据 xhr.setRequestHeader("Content-type","application/json; charset=utf-8" ...