ホームページ  >  記事  >  ウェブフロントエンド  >  js_基礎知識でわかる匿名関数の使い方入門

js_基礎知識でわかる匿名関数の使い方入門

WBOY
WBOYオリジナル
2016-05-16 17:09:511163ブラウズ
1. 匿名関数の概要

私が匿名関数について初めて知ったのは、jQuery を開いて最初に目にしたのは
コードをコピーします コードは次のとおりです:
(function( window, unknown) {...... .... ......})(window);

これは red をパラメータとする匿名関数です。その機能は閉じた領域を作成することです。 、内部の変数と変数には外部のメソッドからアクセスできません。

アクセスできないので、jqueryを呼び出すにはどうすればよいですか?これは、jquery の匿名関数に次の 2 つの文 (青いテキスト) があるためです:

コードをコピー コードは次のとおりです:
(function( window, unknown ) {

// jQuery のローカル コピーを定義します
var jQuery = function( selector, context ) {
// jQuery オブジェクトは実際には init コンストラクターが「強化された」だけです。 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 インスタンス = null; ._tabs = $(要素);
this._tabli = $("a[href*='#']",this._tabs); ).filter("div[id* ='tab']");
this.init();
Plugin.prototype = {
init: function(){
this._tabli.addClass("未選択" );
this._tabli.eq(0).addClass("選択済み");
this._tabDiv.css("表示","なし"); >this._tabDiv.eq(0) .css("表示","ブロック");
this._tabli.each(function(){
$(this).bind("クリック",function( ){
for(var i = 0;iinstance._tabDiv.eq(i).css("display","none");
instance._tabDiv.filter( "#" $(this).attr("href").split('#')[1]).css("display","block"); );
})
}
}

})(jQuery);


実際には、jQuery プラグインに注目してください。 in は、各プラグインの独立性を保証する匿名関数も書き込みます。それ以外の場合は、プラグインと呼ばれます。赤い文字 $.fn.tabing は、このプラグインに jquery の fn へのタブがあることを示します。

このようにして、外部の jquery オブジェクトはタブを直接呼び出すことができます。これがプラグインと外部の世界との間の唯一の接続でもあります。


3. jquery プラグインによる匿名関数の使用について説明した後、ウィンドウの匿名関数について説明します。


実際、jquery 自体は匿名です。 window の関数、つまり最初の点です。では、window の無名関数をどのように書くのでしょうか?

匿名関数を作成した後、次のような関数内のウィンドウと対話するためのインターフェイスが存在します:



コードをコピー


コードは次のとおりです:
(function(){
function getObjByID(id){
return document.getElementById(id);
}
関数 __addClass( id,className,classValue){
$(id).style.className=classValue;
の解析中に匿名関数も実行されます。




コードをコピー


コードは次のとおりです:

関数 Video() { };

var _video = 新しい Video(); .toString = function () {
return "ビデオ";
_video.getName = function () {
return "VideoXXX"; new Movie();
(function (parent, child) {
for (var ele inparent) {
if (!child[ele]) //子にこの属性またはメソッドが含まれていない場合、親のコピーをコピーします
child[ele] =parent[ele];
}
})(_video, _movie); //匿名関数

alert の呼び出し方法_movie.size); //3
alert(_movie.toString()); //[オブジェクト オブジェクト]
alert(_movie.getName()); //VideoXXX


3 つのアラートにはすべて結果があり、匿名関数が内部で実行されたことを示しています。
声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。