JS で apply と binding を使用して、動的な数のパラメータを関数または class_javascript スキルに渡します

10 年間ブログを書かなかったことを記念して、最初のブログ投稿をとても興味深いヒントから始めましょう -___-

ES5 では、関数を呼び出すときに、渡されるパラメータが他の関数や条件に基づいて生成されている場合、つまり、渡されるパラメータの数が不明な場合、元の関数は変わらないでください。次に何をすべきでしょうか？

(もちろん、この記事で説明した状況を回避できる場合は、パラメータをオブジェクトや配列に変更するなど、回避を試みてください。)

ほとんどの人は、申請することでこの問題を完全に解決できることを知っているかもしれません:

Apply は、call と同様に、最初のパラメーターを関数の呼び出しオブジェクトとして使用します。つまり、呼び出し関数の this ポインターが最初のパラメーターとして書き換えられます。それがオブジェクト メソッドでない場合は、これを無視できます。 null の Can を渡します。

違いは、次のパラメータにあります。 apply は呼び出し元の関数に渡されるすべてのパラメータを配列に置き、 call は元の関数と同様にそれらを順番に追加します。

配列であるため、他の関数や論理的判断に基づいて配列を生成すると、動的な数のパラメーターを渡すという目的を達成できます。

しかし、new でオブジェクトを作成するときに動的パラメータを渡す必要があるという問題に遭遇しました。これは数年に一度しか遭遇しません。

ES6 を使用していて、rest パラメーターがある場合、上記の問題はいずれも問題になりません。なお、配列 args の前にドットを 3 つ追加するのは構文エラーではなく、ES6 が提供する残りのパラメータの記述方法です。...args を args 配列内の角括弧を削除した後の文字に置き換えると理解できます。

しかし、ES5 ではそれを実現する方法は本当にないのでしょうか?結局のところ、ES6 のほとんどは糖衣構文であり、babel などのツールを使用して ES5 にコンパイルできます。質問がある場合は、babel でコンパイルして結果を確認してみましょう:

最後の行を見てショックを受けたと思いますが、心配しないで、このコードを分析してみましょう。まず、それを分析して 3 つのステップで見てみましょう:

1. concat を使用して null とパラメーターを配列に接続すると、[null, 1, 2, 3] が得られることは間違いありません。

2. 計算してみましょう。最初のパラメーター Foo は、ネイティブ バインド メソッドを呼び出す関数を置き換えます。つまり、Foo.bind(null,) のパラメーターとして渡されます。 1、2、3);

3. バインド メソッドの最初のパラメータは apply と call に似ており、this ポインタを変更します。後続のパラメータは、関数のデフォルトのプリセット先頭引数の値を埋め込むことができます。つまり、bind が実行された後です。最初の括弧内で、3 つのパラメーター値が注入された Foo クラスを取得します。これを FooWithArgs と呼びます。

最後に、 new FooWithArgs(); を実行するときに、パラメーターを渡す必要はありません。 new Foo(1, 2, 3);

と同等