JS - function Proxy

Poznajemy Proxy w JS i obchodzimy jeden z problemów funkcji partial z programowania funkcyjnego, jakim jest kolejność podawania argumentów. Do dzieła.

Ok, nasza prosta funkcja:

function func3(x, y, z){
    console.log("Arg1: ", x);
    console.log("Arg2: ", y);
    console.log("Arg3: ", z);
}

console.log(func3("a", "b", "c"));

// Arg1:  a 
// Arg2:  b 
// Arg3:  c

A teraz przypomnienie funkcji partial z programowania funkcyjnego:

const partialFunc3 = func3.bind(null, "a", "b");

partialFunc3("c");
// Arg1:  a 
// Arg2:  b 
// Arg3:  c 

partialFunc3("x");
// Arg1:  a 
// Arg2:  b 
// Arg3:  x

Null to oczywiście this binding, reszta to argumenty. Jak widać partial ma swoje ograniczenia, a jest nim kolejność przekazywania argumentów.

Ok, zróbmy proxy dla func3. Najpierw zaprezentuję handlera i zastanówmy się wspólnie co on robi:

const handler = {
    apply: function (target, thisArg, argumentsList) {
      return target(argumentsList[2], argumentsList[1], argumentsList[0]); 
    },
  };

Apply to się nazywa pułapka. Są różne pułapki (get, set, has – możemy się domyślić co robią). Całość (obiekt z pułapkami) nazywa się handler.

Co robi ten handler to się można domyślić – olewa thisArg i wywołuje funkcję z argumentami, ale poprzestawianymi.

Teraz wystarczy proxy utworzyć:

const handler = {
    apply: function (target, thisArg, argumentsList) {
      return target(argumentsList[2], argumentsList[1], argumentsList[0]); 
    },
  };

const func3reversed = new Proxy(func3, handler);

console.log(func3reversed("a", "b", "c"));

// Arg1:  c 
// Arg2:  b 
// Arg3:  a

Tym sposobem możemy mieć – na przykład – funkcję partial, która się nie przejmuje kolejnością argumentów. Bo partial jest bindowany na trzeci i drugi argument, a pierwszy sami podajemy:

const partialFunc3Reversed = func3reversed.bind(null, "c", "b");

partialFunc3Reversed("a");
// Arg1:  a 
// Arg2:  b 
// Arg3:  c 

partialFunc3Reversed("x");
// Arg1:  x 
// Arg2:  b 
// Arg3:  c

Proxy daje ogólnie ogromne możliwości. My tutaj tylko poznaliśmy jedną pułapkę, w dodatku proxy do funkcji robiliśmy. Jest czego się uczyć!

JS – function Proxy