欢迎访问 生活随笔!

生活随笔

当前位置: 首页 >

javascript立即调用的函数表达式

发布时间:2023/12/10 45 豆豆
生活随笔 收集整理的这篇文章主要介绍了 javascript立即调用的函数表达式 小编觉得挺不错的,现在分享给大家,帮大家做个参考.

 1. 什么是自执行的匿名函数?

它是指形如这样的函数: (function {// code})();

2. 疑问
为什么(function {// code})();可以被执行, 而function {// code}();却会报错?

3. 分析
(1). 首先, 要清楚两者的区别:
(function {// code})是表达式, function {// code}是函数声明.
(2). 其次, js"预编译"的特点:
js在"预编译"阶段, 会解释函数声明, 但却会忽略表式.
(3). 当js执行到function() {//code}();时, 由于function() {//code}在"预编译"阶段已经被解释过, js会跳过function(){//code}, 试图去执行();, 故会报错;
当js执行到(function {// code})();时, 由于(function {// code})是表达式, js会去对它求解得到返回值, 由于返回值是一 个函数, 故而遇到();时, 便会被执行.

另外, 函数转换为表达式的方法并不一定要靠分组操作符(),我们还可以用void操作符,~操作符,!操作符……
如:

!function(){ alert("另类的匿名函数自执行"); }();

 

佚名函数()() (())
  (function() {alert('hello')} )();

 

(function(v) {alert(v)} )('hello');

 

 

  (function() {alert('hello')} ());

 

(function(v) {alert(v)} ('hello'));

 

 

 有名函数()() (())
(function fn() {alert('hello')} )();

 

(function fn() {alert('hello')} ());

 

对象函数()()  对象函数(())
({ init:function(){ alert('hello') } }).init();

 

({ init:function(){ alert('hello') } }.init());

 

对象内部() 不可这样调用
var foo = { fn: function (x) {return x % 2 != 0 ? 'yes' : 'no';}(1) }; alert(foo.fn); // 'yes'

 

var foo = { fn: function (x) {return x % 2 != 0 ? 'yes' : 'no';}(1) }; alert(foo.fn());

 

对象+","+函数+()“对象”可以为如下,自己可试
1, function () {alert('anonymous function is called'); }();

 

1、任意数字
2、特殊字符(!、~、- 、+)
3、void
4、true、false
当然这些也可以组合使用。
()应用,设计模式之单例模式 自定义对象
//()应用var Singleton = (function () {function init() {/*这里定义单例代码*/return {publicMethod: function () {alert('hello world');}};}return {getInstance: function () {return init();}};})();/*调用公有的方法来获取实例:*/Singleton.getInstance().publicMethod();

 

  var obj = {}; (function (q) {q.publish = function (str) {alert(str);}} (obj)); //提交obj全局对象 obj.publish('hello');//hello

 

(function (a) {a.publish = function (str) {alert(str);} } (window)); //window对象 publish('hello');

 

著名应用实例:jQuery 设计模式之迭代器模式 
  (function() { var jQuery = (function() {//构建jQuery对象var jQuery = function() {//实例init()return new jQuery.fn.init();};jQuery.fn = jQuery.prototype = { constructor: jQuery,init: function() {var match;}, jQuery: "1.7.1"};// 合并 init()的属性为jQuery.fn jQuery.fn.init.prototype = jQuery.fn;//返回jQuery return jQuery })(); //定义jQuery全局对象 window.jQuery = window.$ = jQuery; })(window);  //应用实例 alert($().jQuery);//1.7.1

 

var fn = (function () {var index = 0,data = [1, 2, 3, 4, 5],length = data.length;return { length: length,rewind: function () {index = 0;},current: function () {return data[index];}}; } ()); alert(fn.current());

 

根据参数选择执行对象 
  var fn=(function(){var obj={i1:function(){return 'a';}(),i2:function(){return 'b';}()};//json格式,可以无序排列var json={"1":"i1","2":"i2"};//array数组,有序排列// var ar=["i11","i12"]; return {init:function(i){return obj[json[i]];}}; })(); alert(fn.init(1));

 

  return {ini: function(X) { //声明一个函数,名称为iniX.__MSG_QS__ = {}; //为传进来的对象添加属性X.on = C; //为传进来的对象添加方法X.dm = G; //为传进来的对象添加方法return X}}

  

使用闭包:

(function($) {
  
// Code goes here
})(jQuery);

这是来自jQuery官方的插件开发规范要求,使用这种编写方式有什么好处呢?

a) 避免全局依赖。

b) 避免第三方破坏。

c) 兼容jQuery操作符'$'和'jQuery '

我们知道这段代码在被解析时会形同如下代码:

var jq = function($) {
  
// Code goes here
};
jq(jQuery);

 

  利用匿名函数绑定事件 var obj = document.getElementById("psd");obj.οnclick=(function(){return function(){alert('i');}})()

  

  1.佚名函数 function() { // }2.分组正则调用佚名函数 (function() { // })(); 3.定时调用佚名函数 setTimeout(function(){alert('msg'));4.佚名函数返回对象 var bird = (function() {return { type: pro,attack: func}; }()); 5.给佚名函数传弟参数,等价4 (function( bird ) {bird.type = "red";bird.attack = function() {}; }( window.bird = window.bird || {} ));

 

 

转载于:https://www.cnblogs.com/sntetwt/archive/2012/09/11/2679808.html

总结

以上是生活随笔为你收集整理的javascript立即调用的函数表达式的全部内容,希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错,欢迎将生活随笔推荐给好友。