Defina um valor de parâmetro padrão para uma função JavaScript

Eu gostaria que uma função JavaScript tivesse argumentos opcionais nos quais eu defini um padrão, que são usados ​​se o valor não for definido (e ignorados se o valor for passado). No Ruby, você pode fazer assim:

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

Isso funciona em JavaScript?

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

No ES6 / ES2015 , os parâmetros padrão estão na especificação do idioma.

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

simplesmente funciona.

Referência: Parâmetros Padrão - MDN

Os parâmetros de função padrão permitem que parâmetros formais sejam inicializados com valores padrão se nenhum valor ou indefinido for passado.

Você também pode simular parâmetros nomeados padrão através da desestruturação :

// 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
    ···
}

Antes do ES2015 ,

Existem várias maneiras, mas esse é o meu método preferido - ele permite que você passe o que quiser, incluindo falso ou nulo. ( typeof null == "object")

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

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

Isso atribui ao delete_aftervalor de delete_afterse não for um valor falsey, caso contrário, atribui a string "my default here". Para mais detalhes, consulte a pesquisa de Doug Crockford sobre o idioma e a seção Operadores .

Essa abordagem não funciona se você deseja passar em um falsey valor ou seja false, null, undefined, 0ou "". Se você precisar que os valores de falsey sejam passados, precisará usar o método na resposta de Tom Ritter .

Ao lidar com vários parâmetros para uma função, geralmente é útil permitir ao consumidor passar os argumentos dos parâmetros em um objeto e depois mesclar esses valores com um objeto que contém os valores padrão da função

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;
};

usar

// 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" }); 

Acho que algo simples como esse é muito mais conciso e legível pessoalmente.

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

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

No ECMAScript 6, você poderá escrever exatamente o que possui:

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

Isso será definido delete_aftercomo falsese não estiver presente ou undefined. Você pode usar recursos ES6 como este hoje com transpilers como Babel .

Consulte o artigo MDN para obter mais informações .

Valores de parâmetro padrão

Com o ES6, você pode fazer um dos idiomas mais comuns em JavaScriptrelação à configuração de um valor padrão para um parâmetro de função. A maneira como fizemos isso por anos deve parecer bastante familiar:

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

Esse padrão é mais usado, mas é perigoso quando passamos valores como

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

Por quê? Porque o 0 is falsy, e então o x || 11 results in 11, não o diretamente passado em 0. Para corrigir esse problema, algumas pessoas escrevem o cheque de maneira mais detalhada assim:

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

agora podemos examinar uma boa sintaxe útil adicionada a partir de ES6para simplificar a atribuição de valores padrão a argumentos ausentes:

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 em uma declaração de função é mais como x !== undefined ? x : 11 o idioma muito mais comumx || 11

Expressões de valor padrão

Functionvalores padrão podem ser mais do que valores simples como 31; eles podem ser qualquer expressão válida, até um 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

Como você pode ver, as expressões de valor padrão são avaliadas com preguiça, o que significa que só são executadas se e quando são necessárias - ou seja, quando o argumento de um parâmetro é omitido ou indefinido.

Uma expressão de valor padrão pode até ser uma chamada de expressão de função embutida - geralmente chamada de Expressão de Função Invocada Imediatamente (IIFE):

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

essa solução é trabalho para mim em js:

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

Basta usar uma comparação explícita com indefinido.

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

Eu recomendaria muito cuidado ao usar valores de parâmetro padrão em javascript. É muitas vezes cria erros quando usado em conjunto com as funções de ordem superior, como forEach, map, e reduce. Por exemplo, considere esta linha de código:

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

parseInt possui um segundo parâmetro opcional function parseInt(s, [radix,=10]) mas mapeia as chamadas parseIntcom três argumentos: ( elemento , índice e matriz ).

Sugiro que você separe os parâmetros necessários dos argumentos com valor opcional / padrão. Se sua função usa 1,2 ou 3 parâmetros necessários para os quais nenhum valor padrão faz sentido, torne-os parâmetros posicionais para a função, quaisquer parâmetros opcionais devem seguir como atributos nomeados de um único objeto. Se sua função precisar de 4 ou mais, talvez faça mais sentido fornecer todos os argumentos por meio de atributos de um único parâmetro de objeto.

No seu caso, sugiro que você escreva sua função deleteFile assim: ( editada instead pelos comentários ) ...

// 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);

A execução do trecho acima ilustra os perigos ocultos por trás dos valores de argumento padrão para parâmetros não utilizados.

Como uma atualização ... com o ECMAScript 6, você pode FINALMENTE definir valores padrão nas declarações de parâmetros de função da seguinte forma:

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

f(1) === 50

Conforme referenciado por - http://es6-features.org/#DefaultParameterValues

como desenvolvedor C ++ há muito tempo (iniciante no desenvolvimento da Web :)), quando me deparei com essa situação, fiz a atribuição de parâmetros na definição de função, como mencionado na pergunta, como segue.

function myfunc(a,b=10)

Mas lembre-se de que ele não funciona de maneira consistente nos navegadores. Para mim, funcionou no chrome no meu desktop, mas não funcionou no chrome no android. A opção mais segura, como muitos mencionaram acima, é -

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

A intenção desta resposta não é repetir as mesmas soluções, o que outros já mencionaram, mas informar que a atribuição de parâmetros na definição de função pode funcionar em alguns navegadores, mas não depende dela.

Para qualquer pessoa interessada em que o código funcione no Microsoft Edge, não use padrões nos parâmetros de função.

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

Nesse exemplo, o Edge lançará um erro "Esperando ')'"

Para contornar esse uso

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

Em 08 de agosto de 2016, este ainda é um problema

Conforme a sintaxe

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

você pode definir o valor padrão dos parâmetros formais. e também verifique o valor indefinido usando a função typeof .

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!!!

Use isso se desejar usar a ECMA6sintaxe mais recente :

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

É chamado default function parameters. Permite que parâmetros formais sejam inicializados com valores padrão se nenhum valor ou indefinido for passado. NOTA : Ele não funciona com o Internet Explorer ou navegadores mais antigos.

Para máxima compatibilidade possível, use o seguinte:

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

Ambas as funções têm exatamente o mesmo comportamento de cada um desses exemplos, com base no fato de que a variável de parâmetro será undefinedse nenhum valor de parâmetro foi passado ao chamar essa função.

ES6: Como já mencionado na maioria das respostas, no ES6, você pode simplesmente inicializar um parâmetro junto com um valor.

ES5: A maioria das respostas dadas não são bons o suficiente para mim, porque há ocasiões em que eu possa ter de passar valores Falsey tais como 0, nulle undefinedpara uma função. Para determinar se um parâmetro é indefinido porque esse é o valor que eu passei em vez de indefinido por não ter sido definido de maneira alguma, faço isso:

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

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

Aqui foo () é uma função que possui um parâmetro chamado argValue. Se não passarmos nada na chamada de função aqui, a função throwIfNoValue () será chamada e o resultado retornado será atribuído ao único argumento argValue. É assim que uma chamada de função pode ser usada como parâmetro padrão. O que torna o código mais simplificado e legível.

Este exemplo foi retirado daqui

Se você estiver usando, ES6+poderá definir parâmetros padrão da seguinte maneira:

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

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

Se você precisar de ES5sintaxe, poderá fazê-lo da seguinte maneira:

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

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

Na sintaxe acima, o ORoperador é usado. O ORoperador sempre retorna o primeiro valor, se puder ser convertido em, truecaso contrário, ele retornará o valor do lado direito. Quando a função é chamada sem argumento correspondente, a variável de parâmetro ( barem nosso exemplo) é configurada undefinedpelo mecanismo JS. undefinedÉ então convertido para false e, assim, o ORoperador retorna o valor 0.

Sim, o uso de parâmetros padrão é totalmente suportado no ES6 :

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

ou

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

mas antes no ES5, você poderia fazer isso facilmente:

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

O que significa que, se o valor estiver lá, use o valor, caso contrário, use o segundo valor após || operação, que faz a mesma coisa ...

Nota: também há uma grande diferença entre aqueles que se você passar um valor para o ES6, mesmo que o valor seja falso, que será substituído por um novo valor, algo como nullou ""... mas o ES5 apenas será substituído se apenas o valor passado é verdade, é porque a maneira de ||trabalhar ...

Se, por algum motivo, você não estiver no ES6 e estiver usando lodashaqui, é uma maneira concisa de padronizar os parâmetros de função por meio do _.defaultTométodo:

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>

O que definirá o padrão se o valor atual for NaN , nulo ou indefinido

Sons do futuro

No futuro, você poderá "espalhar" um objeto para outro (atualmente a partir de 2019 NÃO é suportado pelo Edge !) - demonstração de como usá-lo para boas opções padrão, independentemente da ordem:

function test(options) {
    var options = {
       // defaults
       url: 'defaultURL',
       some: 'somethingDefault',
       // override with input options
       ...options
    };
    
    var body = document.getElementsByTagName('body')[0];
    body.innerHTML += '<br>' + options.url + ' : ' + options.some;
}
test();
test({});
test({url:'myURL'});
test({some:'somethingOfMine'});
test({url:'overrideURL', some:'andSomething'});
test({url:'overrideURL', some:'andSomething', extra:'noProblem'});

Referência MDN: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax

... enquanto isso, o Edge DOES suporta Object.assign () (o IE não, mas realmente espero que possamos deixar o IE para trás :))

Da mesma forma, você poderia fazer

    function test(options) {
        var options = Object.assign({
           // defaults
           url: 'defaultURL',
           some: 'somethingDefault',
        }, options); // override with input options
        
        var body = document.getElementsByTagName('body')[0];
        body.innerHTML += '<br>' + options.url + ' : ' + options.some;
    }
    test();
    test({});
    test({url:'myURL'});
    test({some:'somethingOfMine'});
    test({url:'overrideURL', some:'andSomething'});
    test({url:'overrideURL', some:'andSomething', extra:'noProblem'});

EDIT: Devido aos comentários sobre as constopções - o problema de usar opções constantes no restante da função não é que você não possa fazer isso, é apenas que não pode usar a variável constante em sua própria declaração - você teria para ajustar a nomeação de entrada para algo como

function test(input_options){
   const options = {
     // defaults
     someKey:    'someDefaultValue',
     anotherKey: 'anotherDefaultValue',

     // merge-in input options
     ...input_options
   };

   // from now on use options with no problem
}

Apenas para mostrar minhas habilidades também (lol), a função acima pode ser escrita mesmo sem ter nomeado argumentos como abaixo:

ES5 e acima

function foo() {
    a = typeof arguments[0] !== 'undefined' ? a : 42;
    b = typeof arguments[1] !== 'undefined' ? b : 'default_b';
    ...
}

ES6 e acima

function foo(...rest) {
    a = typeof rest[0] !== 'undefined' ? a : 42;
    b = typeof rest[1] !== 'undefined' ? b : 'default_b';
    ...
}

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

O código a seguir pode funcionar nessa situação, incluindo o ECMAScript 6 (ES6), bem como as versões anteriores.

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');

como o valor padrão em idiomas funciona quando o valor do parâmetro da função é ignorado ao chamar, no JavaScript ele é atribuído como indefinido . Essa abordagem não parece atraente programaticamente, mas tem compatibilidade com versões anteriores .

Sim, isso é chamado de parâmetro padrão

Os parâmetros de função padrão permitem que parâmetros formais sejam inicializados com valores padrão se nenhum valor ou indefinido for passado.

Sintaxe:

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

Descrição:

Parâmetros de funções padrão para indefinidos No entanto, em situações, pode ser útil definir um valor padrão diferente. É aqui que os parâmetros padrão podem ajudar.

No passado, a estratégia geral para definir padrões era testar valores de parâmetros no corpo da função e atribuir um valor se eles não estiverem definidos. Se nenhum valor for fornecido na chamada, seu valor será indefinido. Você precisaria definir uma verificação condicional para garantir que o parâmetro não seja indefinido

Com os parâmetros padrão no ES2015, a verificação no corpo da função não é mais necessária. Agora você pode simplesmente colocar um valor padrão na cabeça da função.

Exemplo das diferenças:

// 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

Exemplos de sintaxe diferentes:

Preenchimento indefinido vs outros valores falsos:

Mesmo se o valor for definido explicitamente ao chamar, o valor do argumento num será o padrão.

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)

Avaliada no momento da chamada:

O argumento padrão é avaliado no momento da chamada, portanto, diferente de outros idiomas, um novo objeto é criado toda vez que a função é chamada.

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

Os parâmetros padrão estão disponíveis para os parâmetros padrão posteriores:

Os parâmetros já encontrados estão disponíveis para parâmetros padrão posteriores

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.')

Funções definidas dentro do corpo da função:

Introduzido no Gecko 33 (Firefox 33 / Thunderbird 33 / SeaMonkey 2.30). As funções declaradas no corpo da função não podem ser consultadas dentro dos parâmetros padrão e geram um ReferenceError (atualmente um TypeError no SpiderMonkey, consulte o bug 1022967). Os parâmetros padrão são sempre executados primeiro, as declarações de funções dentro do corpo da função são avaliadas posteriormente.

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

Parâmetros sem padrões após os parâmetros padrão:

Antes do Gecko 26 (Firefox 26 / Thunderbird 26 / SeaMonkey 2.23 / Firefox OS 1.2), o código a seguir resultava em um SyntaxError. Isso foi corrigido no bug 777060 e funciona como esperado em versões posteriores. Os parâmetros ainda são definidos da esquerda para a direita, substituindo os parâmetros padrão, mesmo se houver parâmetros posteriores sem padrões.

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

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

Parâmetro destruído com atribuição de valor padrão:

Você pode usar a atribuição de valor padrão com a notação de atribuição de desestruturação

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

f(); // 6

Uma abordagem diferente para definir parâmetros padrão é usar o mapa de objetos de argumentos, em vez de argumentos diretamente. Por exemplo,

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

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

Dessa forma, é fácil estender os argumentos e não se preocupar com a incompatibilidade de comprimento dos argumentos.

A resposta é sim. De fato, existem muitos idiomas que suportam parâmetros padrão. Python é um deles:

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

Embora esse seja o código Python 3 devido aos parênteses, os parâmetros padrão nas funções também funcionam em JS.

Por exemplo, e no seu caso:

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

read_file("test.txt");

Mas às vezes você realmente não precisa de parâmetros padrão.

Você pode apenas definir a variável logo após o início da função, assim:

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

read_file("test.txt");

Nos dois exemplos, ele retorna a mesma coisa. Mas, às vezes, eles realmente podem ser úteis, como em projetos muito avançados.

Portanto, em conclusão, os valores padrão dos parâmetros podem ser usados ​​em JS. Mas é quase o mesmo que definir uma variável logo após o início da função. No entanto, às vezes eles ainda são muito úteis. Como você deve ter notado, os valores padrão dos parâmetros têm 1 linha a menos de código do que a maneira padrão que define o parâmetro logo após o início da função.

EDIT: E isso é super importante! Isso não funcionará no IE. Veja a documentação . Portanto, com o IE, você deve usar o método "definir variável no topo da função". Parâmetros padrão não funcionarão no IE.

Sim, isso funcionará em Javascript. Você também pode fazer isso:

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