4
function drawLine(ctx, sX, sY, eX, eY, sRGB, fRGB, lWidth, capStyle)
{
    ctx.beginPath();
    ctx.moveTo(sX, sY);
    ctx.lineTo(eX, eY);
    ctx.lineWidth = lWidth||5;
    ctx.strokeStyle = 'rgb(49, 129, 48)';
    ctx.lineCap = 'round';
    ctx.stroke();
    ctx.closePath();
}

そして、次のように関数を呼び出したい:

drawLine(ctx, 50, 50, 100, 100, someStrokeStyle, someFillStyle, someCapStyle);

ご覧のとおり、lWidthパラメーターをスキップしました。lWidthがパラメーターとして渡されない場合でも、関数が引き続き機能するようにします。どうすればいいですか?someCapStyleAtm は が であると考えるかもしれませんlwidth

4

5 に答える 5

3

自分のように関数に渡す引数が大量にある場合は、オブジェクトを使用します。

function foo({param1: val1, parma2: val2}) {}

その場合、引数の数とそれらが表される順序に依存することはありません。

したがって、関数を書き直すことができます。

 function drawLine(drawObj)
{
    ctx.beginPath();
    ctx.moveTo(drawObj.sX, drawObj.sY);
    ctx.lineTo(drawObj.eX, drawObj.eY);
    ctx.lineWidth = drawObj.lWidth||5;
    ctx.strokeStyle = drawObj.sRGB;
    ctx.lineCap = drawObj.capStyle;
    ctx.stroke();
    ctx.closePath();
}
于 2013-03-19T11:09:32.767 に答える
2

引数を渡さない場合undefinedは、代わりに値が渡されるため、引数が渡されたかどうかを関数で確認してください。

if(typeof argument == "undefined") 
{ 
   argument = "default value";
}

を渡さないようにするには、その値として渡すlWidthだけですundefined

PS最善の方法は、単一の引数を使用することargsです。これは、現在のすべてのパラメーターをプロパティとして含むオブジェクトになります。

于 2013-03-19T11:07:26.177 に答える
2

必要なのは、関数を部分的に評価してdrawLine、定数値を に代入することlWidthです。これを行うJeeneというJavaScript ライブラリがあります。これはあなたがそれを使用する方法です:

function drawLine(ctx, sX, sY, eX, eY, sRGB, fRGB, lWidth, capStyle) {
    ctx.beginPath();
    ctx.moveTo(sX, sY);
    ctx.lineTo(eX, eY);
    ctx.lineWidth = lWidth || 5;
    ctx.strokeStyle = "rgb(49, 129, 48)";
    ctx.lineCap = "round";
    ctx.stroke();
    ctx.closePath();
}

Function.prototype.specialize = net.higherorder.jeene.Jeene.make();

var drawLine2 = drawLine.specialize({
    lWidth: null // or whatever value you want
});

次に、次のように使用drawLine2します。

drawLine2(ctx, 50, 50, 100, 100, someStrokeStyle, someFillStyle, someCapStyle);

これは特殊化と呼ばれ、非常に便利なパターンです。詳しくはこちらをお読みください: A Neighborhood of Infinity: The Three Projections of Doctor Futamura

于 2013-03-19T11:26:21.067 に答える
1

オプションのパラメーターは、パラメーター リストの最後に置くことができます。そうすれば、省略しても他のパラメーターには影響しません。

別のオプションは、定義したい属性を持つ単一のオブジェクトを渡すことです。

function drawLine(options) {
    options.ctx.beginPath();
    options.ctx.moveTo(options.sX, options.sY);
    options.ctx.lineTo(options.eX, options.eY);
    // etc.
 }
于 2013-03-19T11:07:04.203 に答える
1

Javascript で「関数のオーバーロード」を使用することはできませんが、目的を達成する方法を次に示します。

javascriptで関数をオーバーロードするには?

于 2013-03-19T11:09:32.927 に答える