js的匿名函数使用介绍

 匿名函数的作用是创建一块封闭区域,外面不能够访问里面的变量和方法,下面为大家介绍下什么是匿名函数及其如何使用

1.匿名函数概述 
 
关于匿名函数的第一次认识还是在jquery源码里,打开jQuery首先看到的是 
代码如下:
(function( window, undefined ) {.......................})(window); 
 
这就是一个匿名函数,红色为参数,匿名函数的作用是创建一块封闭区域,外面不能够访问里面的变量和方法。 
 
既然不能访问,那怎么能调用jquery?这是因为jquery的匿名函数有这样两句话(蓝色字): 
代码如下:
(function( window, undefined ) { 
 
// Define a local copy of jQuery 
var jQuery = function( selector, context ) { 
// The jQuery object is actually just the init constructor 'enhanced' 
return new jQuery.fn.init( selector, context ); 
}, 
 
......... 
 
window.jQuery = window.$ = jQuery; 
 
})(window); 
 
原来在匿名函数里将jQuery传给了window,这也就是为什么参数的传递中要传递window,所以以后每次调用jquery其实是调用window的jQuery这个对象。 
 
由jquery调用自己里面的方法。外面是无法调用的,这样可以保证安全和不冲突。 
 
2.接着上面的话题,关于jQuery的插件 
 
以下是我写的分页控件的部分代码: 
代码如下:
;(function ($) { 
 
$.fn.tabing = function (arg) { 
instance = new Plugin(this, arg); 
}; 
var instance = null; 
function Plugin(element){ 
this._tabs = $(element); 
 
this._tabli = $("a[href*='#']",this._tabs); 
this._tabDiv = this._tabs.siblings().filter("div[id*='tab']"); 
this.init(); 

Plugin.prototype = { 
init: function(){ 
this._tabli.addClass("unselected"); 
this._tabli.eq(0).addClass("selected"); 
this._tabDiv.css("display","none"); 
this._tabDiv.eq(0).css("display","block"); 
this._tabli.each(function(){ 
$(this).bind("click",function(){ 
for(var i = 0;i<instance._tabDiv.length;i++){ 
instance._tabDiv.eq(i).css("display","none"); 

instance._tabDiv.filter("#"+$(this).attr("href").split('#')[1]).css("display","block"); 
}); 
}) 


 
})(jQuery); 
 
注意红色的字,其实jQuery插件也是在写匿名函数,这样保证每个插件的独立性,要不怎么叫插件,红色的字$.fn.tabing说明在这个插件里面有个tabing给了jquery的fn, 
 
这样外面的jquery对象就可以直接调用tabing,这也是插件与外界的唯一接触。 
 
3. 说完了jquery插件对匿名函数的使用,再说一下window的匿名函数 
 
其实jquery本身就是window的匿名函数,即第一点,那我们怎么写window的匿名函数呢? 
 
即写了匿名函数后,在函数里面有个与window交互的接口,例如下面: 
代码如下:
(function(){ 
function getObjByID(id){ 
return document.getElementById(id); 

function __addClass(id,className,classValue){ 
$(id).style.className=classValue; 

window.addClass=__addClass; 
})(); 
 
同样是看红色的字,这样在该匿名函数外就可以调用addClass(),但无法调用getObjByID()。 
 
4.匿名函数也会在解析的时候执行 
 
如下: 
代码如下:
function Video() { }; 
function Movie() { }; 
 
var _video = new Video(); 
_video.size = 3; 
_video.toString = function () { 
return "video"; 
}; 
_video.getName = function () { 
return "VideoXXX"; 
}; 
var _movie = new Movie(); 
(function (parent, child) { 
for (var ele in parent) { 
if (!child[ele]) //在child不包含该属性或者方法的时候,才会拷贝parent的一份 
child[ele] = parent[ele]; 

})(_video, _movie); //匿名函数调用的方式 
 
alert(_movie.size); //3 
alert(_movie.toString()); //[object Object] 
alert(_movie.getName()); //VideoXXX 
 
 

时间: 2024-09-14 12:40:02

js的匿名函数使用介绍的相关文章

js的匿名函数使用介绍_基础知识

1.匿名函数概述 关于匿名函数的第一次认识还是在jquery源码里,打开jQuery首先看到的是 复制代码 代码如下: (function( window, undefined ) {.......................})(window); 这就是一个匿名函数,红色为参数,匿名函数的作用是创建一块封闭区域,外面不能够访问里面的变量和方法. 既然不能访问,那怎么能调用jquery?这是因为jquery的匿名函数有这样两句话(蓝色字): 复制代码 代码如下: (function( win

JS中匿名函数嵌套匿名函数

问题描述 JS中匿名函数嵌套匿名函数 求详细说明为什么其中test=3明白 然后匿名函数中的匿名函数怎么调用 如果还有fn(4) fn(5) 为什么传入的都是b的值 解决方案 执行完fn(2)后,fn对应的function变了,变成 function(b){ console.log(test+b); } 所以后面fn(3),fn(4),fn(n)都是执行function(b)这个函数 解决方案二: 执行完fn(2)后,fn对应的function变了,变成 function(b){ console

js中匿名函数的创建与调用方法分析_javascript技巧

本文实例分析了js中匿名函数的创建与调用方法.分享给大家供大家参考.具体实现方法如下: 匿名函数就是没有名字的函数了,也叫闭包函数(closures),允许 临时创建一个没有指定名称的函数.最经常用作回调函数(callback)参数的值,很多新手朋友对于匿名函数不了解.这里就来分析一下. function 函数名(参数列表){函数体;} 如果是创建匿名函数,那就应该是: function(){函数体;} 因为是匿名函数,所以一般也不会有参数传给他. 为什么要创建匿名函数呢?在什么情况下会使用到匿

js中匿名函数的创建与调用方法分析

 匿名函数就是没有名字的函数了,也叫闭包函数(closures),允许 临时创建一个没有指定名称的函数.最经常用作回调函数(callback)参数的值,很多新手朋友对于匿名函数不了解.这里就来分析一下. function 函数名(参数列表){函数体;} 如果是创建匿名函数,那就应该是: function(){函数体;} 因为是匿名函数,所以一般也不会有参数传给他. 为什么要创建匿名函数呢?在什么情况下会使用到匿名函数.匿名函数主要有两种常用的场景,一是回调函数,二是直接执行函数. 回调函数,像a

js中匿名函数的创建与调用方法

  function 函数名(参数列表){函数体;} 如果是创建匿名函数,那就应该是: function(){函数体;} 因为是匿名函数,所以一般也不会有参数传给他. 为什么要创建匿名函数呢?在什么情况下会使用到匿名函数.匿名函数主要有两种常用的场景,一是回调函数,二是直接执行函数. 回调函数,像ajax的异步操作,就需要回调函数.这里就不详解.关于直接执行函数,我看一个例子就明白了: 代码如下   <script language="javascript"> var a

js笔记:匿名函数

;(function(){ alert('啥也没做');})(); 会弹框. 这是个匿名函数.最前面的分号可以去掉,仅仅是在代码压缩时防止出错. 该函数可以拆解成非匿名函数: var a= function(){ alert('啥也没做');} ;(a)(); 去掉分号和括号,拆解的函数实际是: a(); 分号后面的那个包含a的括号其实按道理也是可以去掉的,但是语法解析器会报错: ;function(){ alert('啥也没做');}(); VM243:2 Uncaught SyntaxErr

js中匿名函数的N种写法_javascript技巧

匿名函数没有实际名字,也没有指针,怎么执行滴? 其实大家可以看看小括号的意义就应该可以理解.小括号有返回值,也就是小括号内的函数或者表达式的返回值,所以说小括号内的function返回值等于小括号的返回值,不难理解 (function(){})()可以将没有名字的函数执行了把- 关于匿名函数写法,很发散~ 最常见的用法: 复制代码 代码如下: (function() { alert('water'); })(); 当然也可以带参数: 复制代码 代码如下: (function(o) { alert

JS匿名函数类生成方式实例分析_javascript技巧

本文实例讲述了JS匿名函数类生成方式.分享给大家供大家参考,具体如下: <script type="text/javascript"> var Book = (function() { // 私有静态属性 var numOfBooks = 0; // 私有静态方法 function checkIsbn(isbn) { if(isbn == undefined || typeof isbn != 'string') { return false; } return true;

匿名函数、闭包、lambda表达式、Block

C#有lambda.匿名函数,js有匿名函数.闭包,OC中有block,看到这是不是心中有一万个草泥马在跑,不过它们这些都是换汤不换药,不同语言名字不一样. 从功能性上说lambda和closure(或是OC中的blocks)是一个东西,只是不同语言的不同称呼罢了,它们都是匿名函数.若匿名函数捕获了一个外部变量,那么它就是一个closure. 为什么会有这个东东呢? 使用它们一般会有两个好处:简洁.捕获变量. 1.简洁 比如一个方法只在这一处使用,我们就没有必要创建方法然后调用,我们可以直接在其