ホームページ  >  記事  >  ウェブフロントエンド  >  引数、呼び出し先、呼び出し元を理解して、JavaScript に適用する

引数、呼び出し先、呼び出し元を理解して、JavaScript に適用する

高洛峰
高洛峰オリジナル
2016-12-14 09:59:32967ブラウズ

arguments

このオブジェクトは、実行される関数とそれを呼び出す関数のパラメーターを表します。

[function.]arguments[n]
パラメータ関数: オプション。現在実行中の Function オブジェクトの名前。 n: オプション。 Function オブジェクトに渡されるパラメーター値の 0 から始まるインデックス。
説明

Argumentsは、関数呼び出し時に指定されたパラメータに加えて作成される隠しオブジェクトです。 Arguments は配列に似ていますが、配列と同じアクセス プロパティとメソッドを備えているため、arguments[n] を介してアクセスできるオブジェクトです。そして、配列の長さ属性 length を持ちます。また、引数オブジェクトには、関数宣言で定義したパラメータリストに限らず、実際に関数に渡されるパラメータが格納されており、明示的に作成することはできません。引数オブジェクトは関数の先頭でのみ使用できます。

<html>
<head><title>test-apply&call</title></head>
<body>
<script type="text/javascript">
//<![CDATA[
function ArgTest(a, b){
   var i, s = "The ArgTest function expected ";
   var numargs = arguments.length;arguments.length即为这个函数调用时所带的参数数量     // 获取被传递参数的数值。  //ArgTest(&#39;a&#39;,&#39;b&#39;):numargs=2, expargs=2
   var expargs = ArgTest.length;;ArgTest.length为函数规定的参数数量         // 获取期望参数的数值。//ArgTest(&#39;a&#39;,&#39;b&#39;,&#39;c&#39;):numargs=3, expargs=2
   if (expargs < 2)
      s += expargs + " argument. ";
   else
      s += expargs + " arguments. ";
   if (numargs < 2)
      s += numargs + " was passed.";
   else
      s += numargs + " were passed.";
   s += "/n/n"
   for (i =0 ; i < numargs; i++){      // 获取参数内容。
   s += " Arg " + i + " = " + arguments[i] + "/n";;arguments类似数组 可通过arguments[ ]进行取得各个参数值
   }
   return(s);                          // 返回参数列表。
}
window.document.write(ArgTest(&#39;aaa&#39;, &#39;bbbb&#39;,&#39;cccc&#39;,&#39;dddd&#39;));
//]]>
</script>

caller [Summoner]
現在の関数を呼び出した関数への参照を返します。
functionName.caller
functionName オブジェクトは、実行される関数の名前です。
説明
関数の場合、caller 属性は関数の実行時にのみ定義されます。関数がトップレベルから呼び出された場合、caller には null が含まれます。 caller 属性が文字列コンテキストで使用される場合、結果は functionName.toString と同じになります。つまり、関数の逆コンパイルされたテキストが表示されます。
次の例は、caller 属性の使用法を示しています。 // caller Demon {

function callerDemo() {
    if (callerDemo.caller) {
        var a= callerDemo.caller.toString();
          alert(a);
      } else {
          alert("this is a top function");
      }
}
function handleCaller() {
      callerDemo();
}

handleCaller(), returns function handleCaller() { callerDemo();} [つまり、callerDemo() は、それを呼び出す関数自体を返します。文字列形式]、callerDemo() が直接実行される場合、関数 anonymous(){callerDemo();}

callee

は、指定された Function オブジェクトの本体である実行中の Function オブジェクトを返します。 [function.]arguments.callee オプションの関数パラメータは、現在実行されている Function オブジェクトの名前です。 callee 属性の初期値は、実行中の Function オブジェクトであることに注意してください。 callee 属性は argument オブジェクトのメンバーであり、関数オブジェクト自体への参照を表します。これは、匿名関数の再帰や関数のカプセル化を保証するのに役立ちます。たとえば、次の例では、次の合計を再帰的に計算します。 1からnまでの自然数。そして、このプロパティ
は、関連する関数が実行されている場合にのみ使用できます。また、呼び出し先には長さ属性があり、検証にはこの方が適している場合があることにも注意してください。 argument.length は実際のパラメータの長さ、arguments.callee.length は仮パラメータの長さです。これから、呼び出し中の仮パラメータの長さが実際のパラメータの長さと一致しているかどうかを判断できます。例 //callee は自身を出力できます

function calleeDemo() {
      alert(arguments.callee);
}
//calleeDemo() 就返回calleeDemo() 函数本身的String形式:function calleeDemo() { alert(arguments.callee);}
//用于验证参数
function calleeLengthDemo(arg1, arg2) {
    if (arguments.length==arguments.callee.length) {
          window.alert("验证形参和实参长度正确!");
        return;
      } else {
          alert("实参长度:" +arguments.length);//实际使用calleeLengthDemo(arg1, arg2)函数所带的参数:calleeLengthDemo(&#39;a&#39;) 则实参为1
          alert("形参长度: " +arguments.callee.length);//calleeLengthDemo(arg1, arg2)函数所定义的参数数:2
      }
}
//递归计算
var sum = function(n){
  if (n <= 0)                       
  return 1;
  else
    return n + arguments.callee(n - 1)// arguments.callee调用当前正在执行的函数,即sum本身!
}比较一般的递归函数:var sum = function(n){
    if (1==n) return 1;
    else return n + sum (n-1);
}调用时:alert(sum(100));

関数には sum 自体への参照が含まれています。関数名は単なる変数名です。関数内で sum を呼び出すことは、
グローバル変数を呼び出すことと同じであり、それ以外の場合は正しく反映されません。この場合、callee を使用する方が良い方法です。

呼び出し先は自分自身を出力できます



call と apply

どちらも、関数を実行する別のオブジェクトにバインドする点が異なります。apply(thisArg,argArray); call(thisArg [,arg1,arg2. ..] ]);

つまり、すべての関数内の this ポインターは thisArg に割り当てられ、別のオブジェクトのメソッドとして関数を実行する目的を実現できます

argArray が有効な配列でない場合、または有効な配列である場合に適用する手順引数オブジェクトではない場合、TypeError が発生します。

argArray も thisArg も指定されていない場合は、Global オブジェクトが thisArg として使用され、
パラメータを渡すことはできません。
呼び出しの説明 call メソッドは、関数のオブジェクト コンテキストを初期コンテキストから thisArg で指定された新しいオブジェクトに変更できます。
thisArg パラメータが指定されていない場合は、Global オブジェクトが thisArg として使用されます。 関連ヒント: call と apply を使用して別の関数 (クラス) を適用した後、現在の
関数 (クラス) を適用する方法があります。別の関数(クラス)のメソッドやプロパティを持つことを「継承」と呼ぶこともあります。次の例を見てください: 継承のデモ

function base() {
    this.member = " dnnsun_Member";
    this.method = function() {
          window.alert(this.member);
      }
}
function extend() {
      base.call(this);
      window.alert(member);
      window.alert(this.method);
}

//extend() を呼び出した後、window.alert(member)=》dnnsun_Member; window.alert(this.method)=》function (){window.alert(this) .menber);}

上記の例からわかるように、extendは呼び出し後にbaseのメソッドとプロパティを継承できます。ちなみに、apply は JavaScript フレームワーク プロトタイプでクラスを定義するパターンを作成するために使用されます。実装コードは次のとおりです:


var Class = {
    create: function() {
    return function() {
      this.initialize.apply(this, arguments);
      }
    }

} 分析: コードの観点から見ると、オブジェクトには Create メソッドが 1 つだけ含まれています。 、関数を返す、それがカテゴリです。ただし、これは、initialize を呼び出すクラスの
コンストラクターでもあり、このメソッドは、クラスの作成時に定義される初期化関数です。このようにして、

はプロトタイプでクラス作成モードの例を実現できます: var vehicle=Class.create();


vehicle.prototype={
      initialize:function(type){
        this.type=type;
      }
      showSelf:function(){
          alert("this vehicle is "+ this.type);
      }
} var moto=new vehicle("Moto");
moto.showSelf();


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