Imposta un valore di parametro predefinito per una funzione JavaScript

Question

Vorrei che una funzione JavaScript avesse argomenti facoltativi su cui ho impostato un valore predefinito, che vengono utilizzati se il valore non è definito (e ignorati se il valore viene passato).In Ruby puoi farlo in questo modo:

def read_file(file, delete_after = false)
  # code
end

Funziona in JavaScript?

function read_file(file, delete_after = false) {
  // Code
}

Answer 1

Da ES6/ES2015, i parametri predefiniti sono nelle specifiche della lingua.

function read_file(file, delete_after = false) {
  // Code
}

funziona e basta.

Riferimento: Parametri predefiniti - MDN

I parametri funzione predefiniti consentono di inizializzare i parametri formali con valori predefiniti se nessun valore O non definito è passato.

Puoi anche simulare il default di nome parametri tramite destrutturazione:

// the `= {}` below lets you call the function without any parameters
function myFor({ start = 5, end = 1, step = -1 } = {}) { // (A)
    // Use the variables `start`, `end` and `step` here
    ···
}

Prima dell'ES2015,

Esistono molti modi, ma questo è il mio metodo preferito: ti consente di passare tutto ciò che desideri, incluso false o null.(typeof null == "object")

function foo(a, b) {
  a = typeof a !== 'undefined' ? a : 42;
  b = typeof b !== 'undefined' ? b : 'default_b';
  ...
}

Answer 2

function read_file(file, delete_after) {
    delete_after = delete_after || "my default here";
    //rest of code
}

Questo assegna a delete_after il valore di delete_after se non è un Falsey valore altrimenti si assegna il "my default here" stringa. Per maggiori dettagli, controlla indagine Doug Crockford della lingua e controlla la sezione sui Operatori .

Questo approccio non funziona se si desidera passare a un Falsey Valore cioè false, null, undefined, 0 o "". Se avete bisogno di Falsey i valori da passare in si avrebbe bisogno di utilizzare il metodo di Tom Ritter risposta .

Quando si tratta di una serie di parametri a una funzione, è spesso utile per consentire al consumatore di passare gli argomenti di parametro in un oggetto e quindi merge tali valori con un oggetto che contiene i valori predefiniti per la funzione

function read_file(values) {
    values = merge({ 
        delete_after : "my default here"
    }, values || {});

    // rest of code
}

// simple implementation based on $.extend() from jQuery
function merge() {
    var obj, name, copy,
        target = arguments[0] || {},
        i = 1,
        length = arguments.length;

    for (; i < length; i++) {
        if ((obj = arguments[i]) != null) {
            for (name in obj) {
                copy = obj[name];

                if (target === copy) {
                    continue;
                }
                else if (copy !== undefined) {
                    target[name] = copy;
                }
            }
        }
    }

    return target;
};

Per usare

// will use the default delete_after value
read_file({ file: "my file" }); 

// will override default delete_after value
read_file({ file: "my file", delete_after: "my value" }); 

Answer 3

trovo qualcosa di semplice come questo di essere molto più conciso e leggibile personalmente.

function pick(arg, def) {
   return (typeof arg == 'undefined' ? def : arg);
}

function myFunc(x) {
  x = pick(x, 'my default');
} 

Answer 4

In ECMAScript 6 si sarà effettivamente in grado di scrivere esattamente quello che hai:

function read_file(file, delete_after = false) {
  // Code
}

Questo imposterà delete_after per false se s non presente o undefined. È possibile utilizzare le funzioni ES6 come questo oggi con transpilers quali Babel .

Vedi l'articolo MDN per ulteriori informazioni .

Answer 5

Valori predefinito Parametro

Con ES6, si può fare forse uno degli idiomi più comuni in JavaScript riguarda l'impostazione di un valore predefinito per un parametro di funzione. Il modo in cui abbiamo fatto questo per anni dovrebbe essere abbastanza familiarità:

function foo(x,y) {
 x = x || 11;
 y = y || 31;
 console.log( x + y );
}
foo(); // 42
foo( 5, 6 ); // 11
foo( 5 ); // 36
foo( null, 6 ); // 17

Questo modello è più usato, ma è pericoloso quando passiamo valori come

foo(0, 42)
foo( 0, 42 ); // 53 <-- Oops, not 42

Perché? Perché il 0 is falsy, e così il x || 11 results in 11, non il passato direttamente a 0. Per risolvere questo Gotcha, alcune persone invece scrivere il controllo di più verbosely in questo modo:

function foo(x,y) {
 x = (x !== undefined) ? x : 11;
 y = (y !== undefined) ? y : 31;
 console.log( x + y );
}
foo( 0, 42 ); // 42
foo( undefined, 6 ); // 17

possiamo ora esaminare un bel sintassi utile aggiunti fino ad ES6 per semplificare l'assegnazione di valori di default per gli argomenti mancante:

function foo(x = 11, y = 31) {
 console.log( x + y );
}

foo(); // 42
foo( 5, 6 ); // 11
foo( 0, 42 ); // 42
foo( 5 ); // 36
foo( 5, undefined ); // 36 <-- `undefined` is missing
foo( 5, null ); // 5 <-- null coerces to `0`
foo( undefined, 6 ); // 17 <-- `undefined` is missing
foo( null, 6 ); // 6 <-- null coerces to `0`

x = 11 in una dichiarazione di funzione è più simile x !== undefined ? x : 11 rispetto alla x || 11 linguaggio molto più comune

Valore predefinito Espressioni

I valori Function predefiniti possono essere più di una semplice valori semplici come 31; essi possono essere qualsiasi espressione valida, anche un function call:

function bar(val) {
 console.log( "bar called!" );
 return y + val;
}
function foo(x = y + 3, z = bar( x )) {
 console.log( x, z );
}
var y = 5;
foo(); // "bar called"
 // 8 13
foo( 10 ); // "bar called"
 // 10 15
y = 6;
foo( undefined, 10 ); // 9 10

Come si può vedere, le espressioni valore predefinito sono pigramente valutati, che significa che sono solo funzionare se e quando sono necessari -. Cioè quando l'argomento di un parametro viene omesso o non è definito

Un'espressione valore predefinito può anche essere un'espressione chiamata di funzione inline - comunemente indicato come un (IIFE) Funzione Espressione immediatamente Invocato:

function foo( x =
 (function(v){ return v + 11; })( 31 )
) {
 console.log( x );
}
foo(); // 42

Answer 6

che la soluzione è il lavoro per me in js:

function read_file(file, delete_after) {
    delete_after = delete_after || false;
    // Code
}

Answer 7

Basta usare un confronto esplicito con indefinito.

function read_file(file, delete_after)
{
    if(delete_after === undefined) { delete_after = false; }
}

Answer 8

Come aggiornamento... con ECMAScript 6 puoi FINALMENTE imposta i valori predefiniti nelle dichiarazioni dei parametri della funzione in questo modo:

function f (x, y = 7, z = 42) {
  return x + y + z
}

f(1) === 50

Come riferito da - http://es6-features.org/#DefaultParameterValues

Answer 9

essere un lungo periodo di tempo C ++ sviluppatore (Rookie allo sviluppo web :)), quando sono arrivato in tutta questa situazione, ho fatto la parametrizzazione nella definizione della funzione, come è menzionato nella questione, come segue.

function myfunc(a,b=10)

Ma attenzione che non funziona in modo coerente tutti i browser. Per me ha funzionato su Chrome sul mio tavolo, ma non ha funzionato su Chrome su Android. Safer opzione, come molti hanno già detto è -

    function myfunc(a,b)
    {
    if (typeof(b)==='undefined') b = 10;
......
    }

Intenzione per questa risposta non è quello di ripetere le stesse soluzioni, ciò che altri hanno già detto, ma di informare che parametrizzazione nella definizione della funzione può funzionare su alcuni browser, ma non fare affidamento su di esso.

Answer 10

Mi raccomando la massima attenzione quando si utilizzano i valori dei parametri predefiniti in javascript. Si crea spesso bug se usato in combinazione con funzioni di ordine superiore come forEach, map e reduce. Ad esempio, si consideri questa riga di codice:

['1', '2', '3'].map(parseInt); // [1, NaN, NaN]

parseInt ha un secondo function parseInt(s, [ parametro opzionale radix =10]) ma mappa chiamate parseInt con tre argomenti: ( elemento , index e array ).

Vi suggerisco di separare i parametri obbligatori Formulario tuoi argomenti opzionali / default valutati. Se la funzione prende 1,2, o 3 parametri richiesti per i quali nessun valore di default ha un senso, renderli parametri posizionali alla funzione, eventuali parametri opzionali dovrebbero seguire come attributi nome di un singolo oggetto. Se la funzione prende 4 o più, forse ha più senso per la fornitura di tutti gli argomenti tramite gli attributi di un parametro singolo oggetto.

Nel tuo caso vorrei suggerire che si scrive la funzione deleteFile in questo modo: ( a cura per I commenti di instead ) ...

// unsafe
function read_file(fileName, deleteAfter=false) {
    if (deleteAfter) {
        console.log(`Reading and then deleting ${fileName}`);
    } else {
        console.log(`Just reading ${fileName}`);
    }
}

// better
function readFile(fileName, options) {
  const deleteAfter = !!(options && options.deleteAfter === true);
  read_file(fileName, deleteAfter);
}

console.log('unsafe...');
['log1.txt', 'log2.txt', 'log3.txt'].map(read_file);

console.log('better...');
['log1.txt', 'log2.txt', 'log3.txt'].map(readFile);

L'esecuzione del frammento di codice illustra i pericoli in agguato dietro valori degli argomenti di default per i parametri non utilizzati.

Answer 11

Per chiunque sia interessato ad avere c'è lavoro codice Microsoft Edge, Non utilizzare valori predefiniti nei parametri di funzione.

function read_file(file, delete_after = false) {
    #code
}

In questo esempio bordo genera un errore "Expecting ')'"

Per ovviare a questo uso

function read_file(file, delete_after) {
  if(delete_after == undefined)
  {
    delete_after = false;
  }
  #code
}

A partire dal 8 Agosto 2016 questo è ancora un problema

Answer 12

Come per la sintassi

function [name]([param1[ = defaultValue1 ][, ..., paramN[ = defaultValueN ]]]) {
   statements
}

è possibile definire il valore di default di parametri formali. e controllare anche valore indefinito utilizzando typeof funzione.

Answer 13

function helloWorld(name, symbol = '!!!') {
    name = name || 'worlds';
    console.log('hello ' + name + symbol);
}

helloWorld(); // hello worlds!!!

helloWorld('john'); // hello john!!!

helloWorld('john', '(>.<)'); // hello john(>.<)

helloWorld('john', undefined); // hello john!!!

helloWorld(undefined, undefined); // hello worlds!!!

Answer 14

Usa questo se vuoi usare la versione più recente ECMA6 sintassi:

function myFunction(someValue = "This is DEFAULT!") {
  console.log("someValue --> ", someValue);
}

myFunction("Not A default value") // calling the function without default value
myFunction()  // calling the function with default value

È chiamato default function parameters.Consente di inizializzare i parametri formali con valori predefiniti se non viene passato alcun valore o non viene passato alcun valore.NOTA:Non funzionerà con Internet Explorer o browser meno recenti.

Per il massimo possibile Compatibilità Usa questo:

function myFunction(someValue) {
  someValue = (someValue === undefined) ? "This is DEFAULT!" : someValue;
  console.log("someValue --> ", someValue);
}

myFunction("Not A default value") // calling the function without default value
myFunction()  // calling the function with default value

Entrambe le funzioni hanno esattamente lo stesso comportamento poiché ciascuno di questi esempi si basa sul fatto che la variabile parametro sarà undefined se non è stato passato alcun valore di parametro quando si chiama quella funzione.

Answer 15

ES6:. Come già accennato nella maggior parte delle risposte, in ES6, si può semplicemente inizializzare un parametro con un valore

---

ES5: La maggior parte delle risposte date non sono abbastanza buono per me, perché ci sono occasioni in cui io possa avere a passare i valori Falsey quali 0, null e undefined a una funzione. Per determinare se un parametro non è definito, perché questo è il valore passai invece di indefinito a causa di non sono state definite in tutto quello che faccio questo:

function foo (param1, param2) {
   param1 = arguments.length >= 1 ? param1 : "default1";
   param2 = arguments.length >= 2 ? param2 : "default2";
}

Answer 16

function throwIfNoValue() {
throw new Error('Missing argument');
}
function foo(argValue = throwIfNoValue()) {
return argValue ;
}

Qui foo () è una funzione che ha un parametro chiamato argValue. Se non passiamo niente nella chiamata di funzione qui, allora la funzione throwIfNoValue () sarà chiamato ed il risultato restituito sarà assegnato al l'unico argomento argValue. Questo è come una chiamata di funzione può essere utilizzata come parametro di default. Il che rende il codice più semplice e leggibile.

Questo esempio è stato preso da qui

Answer 17

Se si utilizza ES6+ è possibile impostare i parametri di default nel seguente modo:

function test (foo = 1, bar = 2) {
  console.log(foo, bar);
}

test(5); // foo gets overwritten, bar remains default parameter

Se avete bisogno di sintassi ES5 si può fare nel seguente modo:

function test(foo, bar) {
  foo = foo || 2;
  bar = bar || 0;
  
  console.log(foo, bar);
}

test(5); // foo gets overwritten, bar remains default parameter

Nella sintassi sopra viene utilizzato l'operatore OR. L'operatore OR restituisce sempre il primo valore se questo può essere convertito in true se non restituisce il valore righthandside. Quando la funzione viene richiamata senza parametro corrispondente alla variabile parametro (bar nel nostro esempio) è impostato undefined dal motore JS. undefined viene poi convertito su false e quindi non l'operatore OR restituire il valore 0.

Answer 18

Se per qualche motivo lo sei non su ES6 e Sono utilizzando lodash ecco un modo conciso per impostare i parametri delle funzioni predefinite tramite _.defaultTo metodo:

var fn = function(a, b) {
  a = _.defaultTo(a, 'Hi')
  b = _.defaultTo(b, 'Mom!')

  console.log(a, b)
}

fn()                 // Hi Mom!
fn(undefined, null)  // Hi Mom!
fn(NaN, NaN)         // Hi Mom!
fn(1)                // 1 "Mom!"
fn(null, 2)          // Hi 2
fn(false, false)     // false false
fn(0, 2)             // 0 2

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.min.js"></script>

Che imposterà il valore predefinito se il valore corrente è NaN, nullo, O non definito

Answer 19

Sì, utilizzando parametri di default è pienamente supportato in ES6 :

function read_file(file, delete_after = false) {
  // Code
}

o

const read_file = (file, delete_after = false) => {
    // Code
}

, ma prima in ES5 si potrebbe facilmente fare questo:

function read_file(file, delete_after) {
  var df = delete_after || false;
  // Code
}

Il che significa che se il valore è lì, utilizzare il valore, in caso contrario, utilizzare il secondo valore dopo l'operazione || che fa la stessa cosa ...

Nota: anche c'è una grande differenza tra coloro se si passa un valore di ES6 uno anche il valore essere falsy, che verrà sostituito con il nuovo valore, qualcosa come null o "" ... ma ES5 uno solo sarà sostituito se solo il valore passato è truthy, è perché il modo in cui || lavorare ...

Answer 20

def read_file(file, delete_after = false)
  # code
end

Il codice seguente potrebbe funzionare in questa situazione, incluso ECMAScript 6 (ES6) e le versioni precedenti.

function read_file(file, delete_after) {
    if(delete_after == undefined)
        delete_after = false;//default value

    console.log('delete_after =',delete_after);
}
read_file('text1.txt',true);
read_file('text2.txt');

poiché il valore predefinito nelle lingue funziona quando il valore del parametro della funzione viene saltato durante la chiamata, in JavaScript viene assegnato a non definito.Questo approccio non sembra attraente a livello di programmazione, ma lo è retrocompatibilità.

Answer 21

Sì questo è indicato come parametro di default

parametri di funzionalità predefinite consentono parametri formali per essere inizializzati con valori di default se non viene passato alcun valore o non definito.

La sintassi:

function [name]([param1[ = defaultValue1 ][, ..., paramN[ = defaultValueN ]]]) {
   statements
}

Descrizione:

I parametri delle funzioni di default per indefinita Tuttavia, in situazioni potrebbe essere utile per impostare un valore predefinito diverso. Questo è dove i parametri di default possono aiutare.

In passato, la strategia generale per l'impostazione default era di verificare i valori di parametro nel corpo della funzione e assegnare un valore se sono indefiniti. Se nessun valore è fornito nella chiamata, il suo valore sarebbe indefinito. Si dovrà impostare un controllo condizionale per assicurarsi che il parametro non è definito

Con parametri predefiniti nella ES2015, il controllo nel corpo della funzione non è più necessaria. Ora si può semplicemente mettere un valore predefinito nella testa delle funzioni.

Esempio delle differenze:

// OLD METHOD
function multiply(a, b) {
  b = (typeof b !== 'undefined') ?  b : 1;
  return a * b;
}

multiply(5, 2); // 10
multiply(5, 1); // 5
multiply(5);    // 5


// NEW METHOD
function multiply(a, b = 1) {
  return a * b;
}

multiply(5, 2); // 10
multiply(5, 1); // 5
multiply(5);    // 5

Diverse Esempi di sintassi:

Imbottitura indefinito vs altri valori falsy:

Anche se il valore è impostato in modo esplicito quando si chiama, il valore dell'argomento num è quello di default.

function test(num = 1) {
  console.log(typeof num);
}

test();          // 'number' (num is set to 1)
test(undefined); // 'number' (num is set to 1 too)

// test with other falsy values:
test('');        // 'string' (num is set to '')
test(null);      // 'object' (num is set to null)

valutati in fase di chiamata:

L'argomento di default viene valutata al momento della chiamata, in modo a differenza di alcuni altri linguaggi, un nuovo oggetto viene creato ogni volta che la funzione viene chiamata.

function append(value, array = []) {
  array.push(value);
  return array;
}

append(1); //[1]
append(2); //[2], not [1, 2]


// This even applies to functions and variables
function callSomething(thing = something()) {
 return thing;
}

function something() {
  return 'sth';
}

callSomething();  //sth

I parametri di default sono disponibili per i parametri di default successivi:

Parametri già incontrato sono a disposizione di parametri di default successivi

function singularAutoPlural(singular, plural = singular + 's',
                        rallyingCry = plural + ' ATTACK!!!') {
  return [singular, plural, rallyingCry];
}

//["Gecko","Geckos", "Geckos ATTACK!!!"]
singularAutoPlural('Gecko');

//["Fox","Foxes", "Foxes ATTACK!!!"]
singularAutoPlural('Fox', 'Foxes');

//["Deer", "Deer", "Deer ... change."]
singularAutoPlural('Deer', 'Deer', 'Deer peaceably and respectfully \ petition the government for positive change.')

Funzioni definite all'interno del corpo della funzione:

Introdotto nel Gecko 33 (Firefox 33 / Thunderbird 33 / SeaMonkey 2.30). Funzioni dichiarate nel corpo della funzione non possono essere riferiti dentro i parametri di default e lanciare un ReferenceError (attualmente un TypeError in SpiderMonkey, vedi bug 1.022.967). parametri di default vengono sempre eseguite per prime, le dichiarazioni di funzione all'interno del corpo della funzione valutare successivamente.

// Doesn't work! Throws ReferenceError.
function f(a = go()) {
  function go() { return ':P'; }
}

I parametri senza default dopo parametri di default:

Prima di Gecko 26 (Firefox 26 / Thunderbird 26 / SeaMonkey 2.23 / Firefox OS 1.2), il seguente codice ha determinato uno SyntaxError. Questo è stato risolto in bug 777.060 e funziona come previsto nelle versioni successive. I parametri sono ancora impostati da sinistra a destra, sovrascrivendo i parametri di default, anche se ci sono i parametri più tardi senza valori di default.

function f(x = 1, y) {
  return [x, y];
}

f(); // [1, undefined]
f(2); // [2, undefined]

destrutturato PARAMETRI con assegnazione valore di default:

È possibile utilizzare l'assegnazione valore di default con l'assegnazione della notazione destrutturazione

function f([x, y] = [1, 2], {z: z} = {z: 3}) {
  return x + y + z;
}

f(); // 6

Answer 22

Solo un approccio diverso per impostare params di default è quello di utilizzare la mappa oggetto di argomenti, invece di argomenti direttamente. Ad esempio,

const defaultConfig = {
 category: 'Animals',
 legs: 4
};

function checkOrganism(props) {
 const category = props.category || defaultConfig.category;
 const legs = props.legs || defaultConfig.legs;
}

In questo modo, è facile per estendere gli argomenti e non preoccuparsi di lunghezza di argomento non corrispondente.

Answer 23

La risposta è sì. In realtà, ci sono molte lingue che sostengono i parametri di default. Python è uno di loro:

def(a, enter="Hello"):
   print(a+enter)

Anche se questo è il codice Python 3 a causa delle parentesi, parametri di default a funzioni lavorano anche in JS.

Per esempio, e nel tuo caso:

function read_file(file, deleteAfter=false){
  console.log(deleteAfter);
}

read_file("test.txt");

Ma a volte non si ha realmente bisogno di parametri di default.

Si può solo definire la giusta variabile dopo l'inizio della funzione, in questo modo:

function read_file(file){
  var deleteAfter = false;
  console.log(deleteAfter);
}

read_file("test.txt");

In entrambi i miei esempi, restituisce la stessa cosa. Ma a volte in realtà potrebbero essere utili, come nei progetti molto avanzati.

Quindi, in conclusione, i valori dei parametri di default possono essere utilizzati in JS. Ma è quasi la stessa cosa come la definizione di un diritto variabile dopo l'inizio della funzione. Tuttavia, a volte sono ancora molto utile. Come avete può notare, i valori dei parametri predefiniti prendere 1 meno riga di codice che il modo standard che sta definendo il parametro di destra dopo l'avvio se la funzione.

Answer 24

Sì, questo funzionerà in Javascript. Si può anche fare questo:

function func(a=10,b=20)
{
    alert (a+' and '+b);
}

func(); // Result: 10 and 20

func(12); // Result: 12 and 20

func(22,25); // Result: 22 and 25