Czy istnieje sposób na podanie nazwanych parametrów w wywołaniu funkcji w JavaScript?

Uważam, że funkcja nazwanych parametrów w języku C # jest dość przydatna w niektórych przypadkach.

calculateBMI(70, height: 175);

Czego mogę użyć, jeśli chcę tego w JavaScript?

Nie chcę tego:

myFunction({ param1: 70, param2: 175 });

function myFunction(params){
  // Check if params is an object
  // Check if the parameters I need are non-null
  // Blah blah
}

Tego podejścia już użyłem. Czy jest inny sposób?

Nie przeszkadza mi używanie żadnej biblioteki.

ES2015 i nowsze

W ES2015 destrukcji parametrów można użyć do symulacji nazwanych parametrów. Wymagałoby to od obiektu wywołującego przekazania obiektu, ale można uniknąć wszystkich kontroli wewnątrz funkcji, jeśli zostaną użyte również parametry domyślne:

myFunction({ param1 : 70, param2 : 175});

function myFunction({param1, param2}={}){
  // ...function body...
}

// Or with defaults, 
function myFunc({
  name = 'Default user',
  age = 'N/A'
}={}) {
  // ...function body...
}

ES5

Istnieje sposób, aby zbliżyć się do tego, co chcesz, ale opiera się on na Function.prototype.toString ^{wynikach [ES5]} , który jest w pewnym stopniu zależny od implementacji, więc może nie być kompatybilny z ^różnymi przeglądarkami.

Chodzi o to, aby parsować nazwy parametrów z reprezentacji ciągu funkcji, aby można było powiązać właściwości obiektu z odpowiednim parametrem.

Wywołanie funkcji mogłoby wtedy wyglądać

func(a, b, {someArg: ..., someOtherArg: ...});

gdzie ai bsą argumentami pozycyjnymi, a ostatni argument jest obiektem o nazwanych argumentach.

Na przykład:

var parameterfy = (function() {
    var pattern = /function[^(]*\(([^)]*)\)/;

    return function(func) {
        // fails horribly for parameterless functions ;)
        var args = func.toString().match(pattern)[1].split(/,\s*/);

        return function() {
            var named_params = arguments[arguments.length - 1];
            if (typeof named_params === 'object') {
                var params = [].slice.call(arguments, 0, -1);
                if (params.length < args.length) {
                    for (var i = params.length, l = args.length; i < l; i++) {
                        params.push(named_params[args[i]]);
                    }
                    return func.apply(this, params);
                }
            }
            return func.apply(null, arguments);
        };
    };
}());

Które byś użył jako:

var foo = parameterfy(function(a, b, c) {
    console.log('a is ' + a, ' | b is ' + b, ' | c is ' + c);     
});

foo(1, 2, 3); // a is 1  | b is 2  | c is 3
foo(1, {b:2, c:3}); // a is 1  | b is 2  | c is 3
foo(1, {c:3}); // a is 1  | b is undefined  | c is 3
foo({a: 1, c:3}); // a is 1  | b is undefined  | c is 3 

PRÓBNY

Istnieje kilka wad tego podejścia (zostałeś ostrzeżony!):

• Jeśli ostatnim argumentem jest obiekt, jest on traktowany jako „nazwany obiekt argumentu”
• Zawsze dostaniesz tyle argumentów, ile zdefiniowałeś w funkcji, ale niektóre z nich mogą mieć wartość undefined(która różni się od braku żadnej wartości). Oznacza to, że nie można użyć arguments.lengthdo sprawdzenia, ile argumentów zostało przekazanych.

Zamiast mieć funkcję tworzącą opakowanie, możesz również mieć funkcję, która akceptuje funkcję i różne wartości jako argumenty, takie jak

call(func, a, b, {posArg: ... });

lub nawet rozszerzyć Function.prototype, abyś mógł:

foo.execute(a, b, {posArg: ...});

Nie - podejście obiektowe jest odpowiedzią JavaScript na to. Nie ma z tym problemu, pod warunkiem, że twoja funkcja oczekuje obiektu, a nie oddzielnych parametrów.

Ta kwestia od jakiegoś czasu była moim wkurzeniem. Jestem doświadczonym programistą z wieloma językami. Jednym z moich ulubionych języków, z których miałem przyjemność korzystać, jest Python. Python obsługuje nazwane parametry bez żadnych sztuczek ... Odkąd zacząłem używać Pythona (jakiś czas temu) wszystko stało się łatwiejsze. Uważam, że każdy język powinien obsługiwać nazwane parametry, ale tak nie jest.

Wiele osób mówi, aby po prostu użyć sztuczki „Przekaż obiekt”, aby nazwać parametry.

/**
 * My Function
 *
 * @param {Object} arg1 Named arguments
 */
function myFunc(arg1) { }

myFunc({ param1 : 70, param2 : 175});

I to działa świetnie, z wyjątkiem ..... jeśli chodzi o większość IDE dostępnych na rynku, wielu programistów korzysta z podpowiedzi typu / argumentów w naszym IDE. Osobiście używam PHP Storm (wraz z innymi IDE JetBrains, takimi jak PyCharm dla Pythona i AppCode dla Celu C)

Największy problem z użyciem sztuczki „Przekaż obiekt” polega na tym, że podczas wywoływania funkcji IDE daje ci wskazówkę dotyczącą jednego typu i to jest to ... Skąd mamy wiedzieć, jakie parametry i typy powinny wchodzić do obiekt arg1?

Więc ... sztuczka „Przekaż obiekt” nie działa dla mnie ... W rzeczywistości powoduje więcej problemów z koniecznością spojrzenia na docblock każdej funkcji, zanim dowiem się, jakich parametrów oczekuje funkcja ... Jasne, świetnie nadaje się do kiedy utrzymujesz istniejący kod, ale pisanie nowego kodu jest okropne.

Cóż, to jest technika, której używam ... Teraz mogą być z tym pewne problemy, a niektórzy programiści mogą powiedzieć mi, że robię to źle, i mam otwarty umysł, jeśli chodzi o te rzeczy ... Zawsze chętnie szukam lepszych sposobów wykonania zadania ... Jeśli więc jest problem z tą techniką, komentarze są mile widziane.

/**
 * My Function
 *
 * @param {string} arg1 Argument 1
 * @param {string} arg2 Argument 2
 */
function myFunc(arg1, arg2) { }

var arg1, arg2;
myFunc(arg1='Param1', arg2='Param2');

W ten sposób mam to, co najlepsze z obu światów ... nowy kod jest łatwy do napisania, ponieważ moje IDE daje mi wszystkie odpowiednie wskazówki argumentów ... A przy zachowaniu kodu później widzę nie tylko wartość przekazana do funkcji, ale także nazwa argumentu. Jedyny narzut, jaki widzę, to zadeklarowanie nazw argumentów jako zmiennych lokalnych, aby zapobiec zanieczyszczeniu globalnej przestrzeni nazw. Jasne, to trochę dodatkowego pisania, ale banalne w porównaniu do czasu potrzebnego na wyszukiwanie bloków dokumentów podczas pisania nowego kodu lub utrzymywania istniejącego kodu.

Jeśli chcesz wyjaśnić, jakie są parametry, zamiast wywoływania

someFunction(70, 115);

dlaczego nie wykonać następujących czynności

var width = 70, height = 115;
someFunction(width, height);

pewnie, to dodatkowy wiersz kodu, ale wygrywa pod względem czytelności.

Innym sposobem byłoby użycie atrybutów odpowiedniego obiektu, np .:

function plus(a,b) { return a+b; };

Plus = { a: function(x) { return { b: function(y) { return plus(x,y) }}}, 
         b: function(y) { return { a: function(x) { return plus(x,y) }}}};

sum = Plus.a(3).b(5);

Oczywiście dla tego wymyślonego przykładu jest on nieco bez znaczenia. Ale w przypadkach, w których wygląda funkcja

do_something(some_connection_handle, some_context_parameter, some_value)

to może być bardziej przydatne. Można go również połączyć z pomysłem „parametryzuj”, aby utworzyć taki obiekt z istniejącej funkcji w ogólny sposób. Oznacza to, że dla każdego parametru utworzyłby element członkowski, który może ewaluować do częściowo ocenionej wersji funkcji.

Pomysł ten jest oczywiście związany z Schönfinkeling aka Currying.

Jest inny sposób. Jeśli przekazujesz obiekt przez odniesienie, właściwości tego obiektu pojawią się w lokalnym zasięgu funkcji. Wiem, że to działa w przeglądarce Safari (nie sprawdziłem innych przeglądarek) i nie wiem, czy ta funkcja ma nazwę, ale poniższy przykład ilustruje jej użycie.

Chociaż w praktyce nie sądzę, że oferuje to jakąkolwiek wartość funkcjonalną poza techniką, której już używasz, jest nieco czystsza semantycznie. I wciąż wymaga przekazania odwołania do obiektu lub dosłowności do obiektu.

function sum({ a:a, b:b}) {
    console.log(a+'+'+b);
    if(a==undefined) a=0;
    if(b==undefined) b=0;
    return (a+b);
}

// will work (returns 9 and 3 respectively)
console.log(sum({a:4,b:5}));
console.log(sum({a:3}));

// will not work (returns 0)
console.log(sum(4,5));
console.log(sum(4));

Próbując Node-6.4.0 (process.versions.v8 = „5.0.71.60”) i Node Chakracore-v7.0.0-pre8, a następnie Chrome-52 (V8 = 5.2.361.49), zauważyłem, że nazwane parametry są prawie zaimplementowano, ale ta kolejność ma nadal pierwszeństwo. Nie mogę znaleźć tego, co mówi standard ECMA.

>function f(a=1, b=2){ console.log(`a=${a} + b=${b} = ${a+b}`) }

> f()
a=1 + b=2 = 3
> f(a=5)
a=5 + b=2 = 7
> f(a=7, b=10)
a=7 + b=10 = 17

Ale zamówienie jest wymagane !! Czy to standardowe zachowanie?

> f(b=10)
a=10 + b=2 = 12

Wywołanie funkcji fz nazwanymi parametrami przekazanymi jako obiekt

o = {height: 1, width: 5, ...}

w zasadzie nazywa swoją kompozycję, w f(...g(o))której używam składni rozprzestrzeniania ig jest mapą „wiążącą” łączącą wartości obiektów z ich pozycjami parametrów.

Mapa powiązań jest właśnie brakującym składnikiem, który może być reprezentowany przez tablicę jej kluczy:

// map 'height' to the first and 'width' to the second param
binding = ['height', 'width']

// take binding and arg object and return aray of args
withNamed = (bnd, o) => bnd.map(param => o[param])

// call f with named args via binding
f(...withNamed(binding, {hight: 1, width: 5}))

Zwróć uwagę na trzy oddzielone składniki: funkcję, obiekt z nazwanymi argumentami i powiązanie. To oddzielenie pozwala na dużą elastyczność w korzystaniu z tej konstrukcji, gdzie powiązanie można dowolnie dostosować w definicji funkcji i dowolnie rozszerzyć w czasie wywołania funkcji.

Na przykład możesz chcieć skrócić heighti widthjako hi wwewnątrz definicji funkcji, aby była krótsza i bardziej przejrzysta, podczas gdy nadal chcesz wywoływać ją z pełnymi nazwami dla jasności:

// use short params
f = (h, w) => ...

// modify f to be called with named args
ff = o => f(...withNamed(['height', 'width'], o))

// now call with real more descriptive names
ff({height: 1, width: 5})

Ta elastyczność jest również bardziej użyteczna w programowaniu funkcjonalnym, w którym funkcje można dowolnie przekształcać, gubiąc oryginalne nazwy parametrów.

Pochodzące z Pythona to mnie wkurzyło. Napisałem prosty wrapper / proxy dla węzła, który akceptuje zarówno obiekty pozycyjne, jak i słowa kluczowe.

https://github.com/vinces1979/node-def/blob/master/README.md

Wbrew powszechnemu przekonaniu, nazwane parametry można zaimplementować w standardowym oldskulowym JavaScript (tylko dla parametrów boolowskich) za pomocą prostej, zgrabnej konwencji kodowania, jak pokazano poniżej.

function f(p1=true, p2=false) {
    ...
}

f(!!"p1"==false, !!"p2"==true); // call f(p1=false, p2=true)

Ostrzeżenia:

• Kolejność argumentów musi być zachowana - ale wzorzec jest nadal użyteczny, ponieważ pokazuje, który faktyczny argument jest przeznaczony dla którego parametru formalnego, bez konieczności grepowania dla podpisu funkcji lub używania IDE.

• Działa to tylko w przypadku wartości logicznych. Jestem jednak pewien, że można opracować podobny wzorzec dla innych typów przy użyciu unikalnej semantyki koercji typów JavaScript.