function funções - Definir um valor de parâmetro padrão para uma função JavaScript




com parametro (18)

Eu gostaria que uma função JavaScript tivesse argumentos opcionais nos quais eu defini um padrão, que será usado se o valor não estiver definido. Em 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
}

Answers

Conforme a sintaxe

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

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


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

Como uma atualização ... com o ECMAScript 6, você pode FINALMENTE definir valores padrão em 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 mencionado por - http://es6-features.org/#DefaultParameterValues


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

Isto atribui a delete_after o valor de delete_after se não for um valor de falsey, caso contrário ele atribuirá a string "my default here" . Para mais detalhes, confira a pesquisa de Doug Crockford sobre o idioma e confira a seção sobre Operadores .

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

Ao lidar com um número de parâmetros para uma função, geralmente é útil permitir que o consumidor passe os argumentos do parâmetro em um objeto e, em seguida, mescle esses valores com um objeto que contenha os valores padrão para a 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" }); 

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, então a função throwIfNoValue () será chamada eo resultado retornado será atribuído ao único argumento argValue. É assim que uma chamada de função pode ser usada como um parâmetro padrão. O que torna o código mais simplificado e legível.

Este exemplo foi tirado daqui


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

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

Sim, isso é referido como um 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 undefined 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 os valores dos parâmetros no corpo da função e atribuir um valor se eles estivessem indefinidos. Se nenhum valor for fornecido na chamada, seu valor será indefinido. Você teria que definir uma verificação condicional para garantir que o parâmetro não seja indefinido

Com 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 no cabeçalho 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 versus outros valores falsos:

Mesmo que o valor seja definido explicitamente ao chamar, o valor do argumento num é o valor 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)

Avaliado no tempo de chamada:

O argumento padrão é avaliado no momento da chamada, portanto, diferente de outros idiomas, um novo objeto é criado sempre 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:

Params 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). Funções declaradas no corpo da função não podem ser referenciadas dentro de parâmetros padrão e lançam um ReferenceError (atualmente um TypeError no SpiderMonkey, veja bug 1022967). Os parâmetros padrão são sempre executados primeiro, as declarações de função 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 resultou 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

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

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

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

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

Isto irá definir delete_after para false se não estiver presente ou undefined . Você pode usar recursos do ES6 como este hoje com transpilers como o Babel .

Veja o artigo do MDN para mais informações .


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 boas o suficiente para mim porque há ocasiões em que posso ter que passar valores de falsey como 0 , null e undefined para uma função. Para determinar se um parâmetro é indefinido, porque esse é o valor que eu passei em vez de indefinido devido a não ter sido definido, eu faço isso:

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

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

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

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

Para contornar este uso

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

A partir de 08 de agosto de 2016, isso ainda é um problema


Use isto se você quiser usar a sintaxe mais recente do ECMA6 :

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 de 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 isto:

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 que cada um desses exemplos dependem do fato de que a variável de parâmetro será undefined se nenhum valor de parâmetro foi passado ao chamar essa função.


Sendo um desenvolvedor de C ++ muito antigo (Rookie to web development :)), quando me deparei com essa situação, fiz a atribuição de parâmetros na definição da função, como é mencionado na pergunta, como segue.

function myfunc(a,b=10)

Mas cuidado, pois não funciona de forma consistente em todos os navegadores. Para mim funcionou no Chrome no meu desktop, mas não funcionou no Chrome no Android. Opção mais segura, como muitos mencionaram acima é -

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

A intenção para essa resposta é não repetir as mesmas soluções, o que outras pessoas já mencionaram, mas informar que a atribuição de parâmetros na definição da função pode funcionar em alguns navegadores, mas não confie nela.


Valores de parâmetro padrão

Com o ES6, você pode fazer, talvez, uma das expressões mais comuns em JavaScript se relacionar com a definiçã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 x || 11 results in 11 , não o diretamente em 0. Para consertar essa pegadinha, algumas pessoas vão escrever o cheque de forma mais grosseira 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 sintaxe útil útil adicionada a partir do ES6 para 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 parecido com x !== undefined ? x : 11 x !== undefined ? x : 11 que o idioma muito mais comum x || 11 x || 11

Expressões de valor padrão

Valores padrão de Function podem ser mais do que valores simples como 31; eles podem ser qualquer expressão válida, até mesmo uma 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 preguiçosamente, o que significa que elas só serão executadas se e quando forem necessárias - ou seja, quando o argumento de um parâmetro for omitido ou for indefinido.

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

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

Eu recomendaria extremamente cuidado ao usar valores de parâmetro padrão no javascript. Geralmente cria erros quando usado em conjunto com 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 uma segunda function parseInt(s, [ parâmetro opcional function parseInt(s, [ radix =10]) mas mapeia as chamadas parseInt com três argumentos: ( element , index e array ).

Eu sugiro que você separe seus parâmetros obrigatórios a partir de seus argumentos valiosos opcionais / padrão. Se a sua função tiver 1,2 ou 3 parâmetros obrigató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 leva 4 ou mais, talvez faça mais sentido fornecer todos os argumentos via atributos de um único parâmetro de objeto.

No seu caso eu sugiro que você escreva sua função deleteFile assim:

// 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 = false } = options || {}; // if null
  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 snippet acima ilustra os perigos ocultos por trás dos valores de argumentos padrão para parâmetros não utilizados.


Se você estiver usando o ES6+ poderá definir os 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 da sintaxe ES5 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 operador OR é usado. O operador OR sempre retorna o primeiro valor, se puder ser convertido para true se não retornar o valor righthandside. Quando a função é chamada sem argumento correspondente, a variável de parâmetro ( bar em nosso exemplo) é definida como undefined pelo mecanismo JS. undefined É então convertido para false e, portanto, o operador OR retorna o valor 0.


Eu sei que já existem muitas soluções, mas acho que esse script pequeno e simples pode ser útil para demonstrar o conceito:

// makeSequencer will return a "sequencer" function
var makeSequencer = function() {
    var _count = 0; // not accessible outside this function
    var sequencer = function () {
        return _count++;
    }
    return sequencer;
}

var fnext = makeSequencer();
var v0 = fnext();     // v0 = 0;
var v1 = fnext();     // v1 = 1;
var vz = fnext._count // vz = undefined






javascript function parameters default-parameters