Destrukční a funkční argumenty

Jazyk JavaScript těžil z několika opravdu úžasných nových funkcí za posledních několik let, včetně funkcí šipek, operátoru spreadu a výchozích hodnot argumentů funkcí. I když váš prohlížeč zatím nepodporuje navrhované doplňky syntaxe rozhraní JavaScript API, můžete je dnes využít pomocí nástroje jako Babel ve své aplikaci Node.js.

Jednou z mých oblíbených nových (ish) funkcí JavaScriptu je destrukce objektů. Pokud nejste obeznámeni s destrukcí JavaScriptu, v zásadě poskytuje kratší syntaxi pro extrahování hodnoty klíče objektu bez tečkové notace:

// A sample object
const myObject = { x: 1, y: 2 };

// Destructuring
const { x, y } = myObject;
// x is 1, y is 2

Základní syntaxe pro destrukci je poměrně jednoduchá, ale použití destrukcí s argumenty funkcí může být o něco obtížnější, když by tyto hodnoty argumentů měly mít výchozí hodnoty. Následuje funkce s argumenty s výchozími hodnotami:

function myFunction(text = "", line = 0, truncate = 100) {

    // With default values, we can avoid a bunch of:
    text = text || "";
    line = line || 0;
    truncate = truncate || 100;
}

Bez ohledu na jazyk, pokud funkce vyžaduje více než ~3 parametry, je pravděpodobně nejlepší předat název objektu options nebo config který obsahuje možné páry klíč/hodnota; ekvivalent by vypadal takto:

function myFunction(config) {

}

// Usage
myFunction({
    text: "Some value",
    line: 0,
    truncate: 100
})

Co když však chcete použít destrukturování v argumentech funkcí JavaScript? Následující podpis funkce by se stal:

function myFunction({ text, line, truncate }) {

}

Pokud chcete v konfiguraci funkce definovat výchozí hodnoty, použijte následující:

function myFunction({ 
  text = "", 
  line = 0, 
  truncate = 100 
} = {}) {

 // Even if the passed in object is missing a given key, the default is used!
}

Nastavení výchozího nastavení s = { } je důležité; bez výchozího nastavení by v následujícím příkladu došlo k chybě:

TypeError: Cannot destructure property `key` of 'undefined' or 'null'

Destrukturalizace je úžasná jazyková funkce, ale může vést ke zmatkům a dokonce k chybám. Doufejme, že základy uvedené v této příručce vám pomohou při navigaci pomocí destrukcí JavaScriptu s funkcemi!