Javascriptの閉パッケージ、プロトタイプ、匿名関数の旅を学ぶ

4261 ワード

ここではjavascriptの閉パッケージ、プロトタイプ、匿名関数について例を挙げて説明します.詳細は以下を参照してください.
一.>クローズドパッケージについて
クローズに必要な知識を理解する
1.変数の役割ドメイン
例1:

var n =99; //          
function readA(){
  alert(n); //      
}

readA();//この関数の実行
例2:

function readB(){
  var c = 9;
  function readC(){
    console.log(c); //ok c  
  }
  return readC;
}
alert(c); //error c is not defined.

note:関数内部で変数cを宣言する場合はvarを付けなければなりません.そうしないと、cはグローバル変数になります.
したがって、関数内にはグローバル変数が表示されますが、関数内のローカル変数は外部には表示されませんjsの役割ドメインはチェーン式で、親オブジェクトの変数は常にサブオブジェクトに表示されますが、子オブジェクトのオブジェクトは親オブジェクトに表示されません.関数内の内部変数を取得する場合は
そこで例3がある.

function readB(){
  var c = 9;
  function readC(){
    console.log(c);
  }
  return readC();
}
readB();

クローズドパッケージはこれに基づいて変形されたものに似ています

function readB(){
  var c = 9;
  function readC(){
    console.log(c);
  }
  return readC;
}
var res = readB();
res();

note:
1.親関数のステータスが保存されるため、閉パッケージは慎重に使用します.親関数の内部変数の値を勝手に変更しないでください
閉パッケージの理解
note:thisは、その関数が実行されたときに属するオブジェクトを指します.
例1:

var name = "The Window";

var object = {
  name : "My Object",

  getNameFunc : function(){  //  this (      )   object   , object          
    return function(){   //  this (      )       ,    window  ,   window
      return this.name;
    };
  }
};
console.log(object.getNameFunc()()); //the window 

例2:

var name = "The Window";

var object = {
  name : "My Object",

  getNameFunc : function(){
    var that = this;
    return function(){
      return that.name;
    };

  }
};
console.log(object.getNameFunc()());  //My Object

二.>匿名関数
匿名関数を直接定義して呼び出します.この形式はjqueryプラグインの定義でよく見られます.
1.関数のアルファベット量による.匿名関数を宣言してから実行します

( function(){
  console.log('excute self');
}) ();

2.優先式により、Javascript実行式は括弧の内側から外側になるので、括弧で宣言された関数を強制的に実行できます

(
  function () {
    alert(2);
  }
  ()
);

3.voidオペレータvoidオペレータでカッコで囲まれていない個別のオペランドを実行

void function(){ console.log('void') } ();

三.>prototypeについて
プロトタイプprototype
jsにおけるprotitypeを理解するには,まずjsのオブジェクト向け設計を理解する必要がある.

function People(name){
  this.name = name;

  console.log(this); //Window    object { name: 'xxx' }
  this.introduce = function(){  //      
    console.log(this.name);
  }
}
new People('leon').introduce();
//            ,         ,
//  function people  this      Window  
//     People();  this     Window  
//     new People('xx') , this     {name:'xx'}
//       ,  new ,        

インスタンスオブジェクトメソッドはnew People('leon')しかできません.introduce(); 使用前に初期化する必要があるため呼び出します
クラスのオブジェクトの静的メソッド

var People = {}; //       {}    function         People       
People.sayhi = function(to_who){
  console.log('hi '+ to_who);
}
People.sayhi('lee'); //       

プロトタイプメソッド

var People = function(){};       // People       function(){}      ,                
People.prototype.meet = function(meet_who) {
  console.log('I am '+this.name + ',going to meet ' + meet_who);
};
new People('lee').meet('xx');

プロトタイプメソッドはクラスのオブジェクトからのみ呼び出されます
 A.prototype = new B();
プロトタイプは継承のように見えますが、実はそうではありません.cloneのように正確です.
親クラスと子クラスに重複する属性が表示された場合は、近接原則をとり、1レベル1レベル上を検索できない場合は、親を呼び出す属性を指定する場合はcallメソッドを使用します.

extendClass.prototype = new baseClass();
var instance = new extendClass();
var baseinstance = new baseClass();
baseinstance.showMsg.call(instance);
obj1.func.call(obj);

以上の内容は、javascriptの閉パッケージ、プロトタイプ、匿名関数の旅を共有し、皆さんに役に立つことを願っています.