Установите значение параметра по умолчанию для функции JavaScript

Я хотел бы, чтобы функция JavaScript имела необязательные аргументы, для которых я установил значение по умолчанию, которые используются, если значение не определено (и игнорируется, если значение передается). В Ruby вы можете сделать это так:

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

Это работает в JavaScript?

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

Начиная с ES6 / ES2015 , параметры по умолчанию указаны в спецификации языка.

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

просто работает.

Ссылка: Параметры по умолчанию - MDN

Параметры функции по умолчанию позволяют формальным параметрам инициализироваться значениями по умолчанию, если не передано значение или неопределенное значение .

Вы также можете смоделировать именованные параметры по умолчанию с помощью деструктурирования :

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

До ES2015 ,

Есть много способов, но это мой предпочтительный метод - он позволяет вам передавать все, что вы захотите, включая false или null. ( 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
}

Это присваивает delete_afterзначение, delete_afterесли оно не является значением Falsey, в противном случае оно присваивает строку "my default here". Для более подробной информации, ознакомьтесь с обзором языка Дуга Крокфорда и ознакомьтесь с разделом «Операторы» .

Такой подход не работает , если вы хотите передать в falsey значение т false, null, undefined, 0или "". Если вы хотите, чтобы значения Falsey были переданы, вам нужно будет использовать метод в ответе Тома Риттера .

При работе с несколькими параметрами функции часто бывает полезно разрешить потребителю передавать аргументы параметра в объекте, а затем объединять эти значения с объектом, который содержит значения по умолчанию для функции.

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

использовать

// 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 pick(arg, def) {
   return (typeof arg == 'undefined' ? def : arg);
}

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

В ECMAScript 6 вы действительно сможете написать именно то, что у вас есть:

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

Это позволит установить , delete_afterчтобы , falseесли он с нет или undefined. Подобные функции ES6 вы можете использовать сегодня с такими транспортерами, как Babel .

См. Статью MDN для получения дополнительной информации .

Значения параметров по умолчанию

С ES6 вы можете сделать, пожалуй, одну из наиболее распространенных идиом, JavaScriptсвязанных с установкой значения по умолчанию для параметра функции. То, как мы делали это годами, должно выглядеть довольно знакомо:

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

Этот шаблон наиболее часто используется, но он опасен, когда мы передаем такие значения, как

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

Почему? Потому что 0 is falsy, и, следовательно x || 11 results in 11, непосредственно не передано в 0. Чтобы исправить эту ошибку, некоторые люди вместо этого напишут проверку более подробно так:

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

Теперь мы можем рассмотреть хороший полезный синтаксис, добавленный ES6с момента, чтобы упростить назначение значений по умолчанию отсутствующим аргументам:

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в объявлении функции больше похоже x !== undefined ? x : 11на гораздо более распространенную идиомуx || 11

Выражения значений по умолчанию

Functionзначения по умолчанию могут быть не просто простыми значениями, такими как 31; они могут быть любым допустимым выражением, даже 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

Как вы можете видеть, выражения значений по умолчанию лениво оцениваются, то есть они запускаются только в том случае, когда они необходимы, то есть когда аргумент параметра опущен или не определен.

Выражением значения по умолчанию может быть даже вызов встроенного выражения функции, обычно называемый выражением немедленного вызова функции (IIFE):

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

это решение работает для меня в JS:

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

Просто используйте явное сравнение с неопределенным.

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

Я настоятельно рекомендую соблюдать крайнюю осторожность при использовании значений параметров по умолчанию в javascript. Это часто создает ошибки при использовании в сочетании с функций высшего порядка , таких как forEach, mapи reduce. Например, рассмотрим эту строку кода:

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

У parseInt есть необязательный второй параметр function parseInt(s, [radix,=10]) но вызовы map parseIntс тремя аргументами: ( element , index и array ).

Я предлагаю вам отделить необходимые параметры от необязательных / значений по умолчанию. Если ваша функция принимает 1,2 или 3 обязательных параметра, для которых значение по умолчанию не имеет смысла, сделайте их позиционными параметрами для функции, любые необязательные параметры должны следовать как именованные атрибуты одного объекта. Если вашей функции требуется 4 или более, возможно, имеет смысл предоставить все аргументы через атрибуты одного параметра объекта.

В вашем случае я бы предложил написать функцию deleteFile следующим образом: ( отредактировано в соответствии 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);

Запуск приведенного выше фрагмента иллюстрирует опасности, скрывающиеся за значениями аргументов по умолчанию для неиспользуемых параметров.

В качестве обновления ... с ECMAScript 6 вы можете НАКОНЕЦ установить значения по умолчанию в объявлениях параметров функции следующим образом:

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

f(1) === 50

На что ссылается - http://es6-features.org/#DefaultParameterValues

Будучи долгое время разработчиком C ++ (новичок в веб-разработке :)), когда я впервые столкнулся с этой ситуацией, я сделал назначение параметров в определении функции, как это упоминается в вопросе, следующим образом.

function myfunc(a,b=10)

Но учтите, что он не работает согласованно в разных браузерах. У меня это работало на Chrome на моем рабочем столе, но не работало на Chrome на Android. Более безопасный вариант, как многие упоминали выше, -

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

Намерение для этого ответа не состоит в том, чтобы повторить те же решения, которые уже упоминали другие, но чтобы сообщить, что присвоение параметров в определении функции может работать в некоторых браузерах, но не полагаться на это.

Всем, кто заинтересован в том, чтобы этот код работал в Microsoft Edge, не используйте значения по умолчанию в параметрах функций.

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

В этом примере Edge выдаст ошибку «Expecting ')'»

Чтобы обойти это использование

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

По состоянию на 08 августа 2016 года это все еще проблема

Согласно синтаксису

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

Вы можете определить значение по умолчанию формальных параметров. а также проверьте неопределенное значение с помощью функции 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!!!

Используйте это, если вы хотите использовать последний 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

Это называется default function parameters. Это позволяет формальным параметрам инициализироваться значениями по умолчанию, если не передано значение или неопределенное значение. ПРИМЕЧАНИЕ . Он не будет работать с Internet Explorer или более старыми браузерами.

Для максимально возможной совместимости используйте это:

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

Обе функции имеют одинаковое поведение, так как каждый из этих примеров полагается на тот факт, что переменная параметра будет иметь место, undefinedесли при вызове этой функции значение параметра не было передано.

ES6: Как уже упоминалось в большинстве ответов, в ES6 вы можете просто инициализировать параметр вместе со значением.

ES5: Большинство из приведенных ответов не достаточно хороши для меня, потому что бывают случаи, когда мне приходится передавать ложные значения, такие как 0, nullи undefinedфункции. Чтобы определить, является ли параметр неопределенным, потому что это значение, которое я передал вместо неопределенного из-за того, что оно вообще не было определено, я делаю это:

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

Здесь foo () - это функция, у которой есть параметр с именем argValue. Если мы ничего не передадим в вызов функции здесь, то будет вызвана функция throwIfNoValue () и возвращенный результат будет присвоен единственному аргументу argValue. Таким образом, вызов функции может использоваться как параметр по умолчанию. Что делает код более простым и читабельным.

Этот пример был взят отсюда

Если вы используете, ES6+вы можете установить параметры по умолчанию следующим образом:

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

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

Если вам нужен ES5синтаксис, вы можете сделать это следующим образом:

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

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

В приведенном выше синтаксисе используется ORоператор. ORОператор всегда возвращает первое значение , если это может быть преобразовано в trueслучае не возвращает righthandside значения. Когда функция вызывается без соответствующего аргумента, переменная параметра ( barв нашем примере) устанавливается undefinedна движок JS. undefinedЗатем преобразуется в false и, таким образом, ORоператор возвращает значение 0.

Да, использование параметров по умолчанию полностью поддерживается в ES6 :

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

или

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

но до ES5 вы могли бы легко сделать это:

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

Это означает, что если значение есть, используйте значение, в противном случае, используйте второе значение после ||операции, которая делает то же самое ...

Примечание: также существует большая разница между этими значениями, если вы передадите значение в ES6 на единицу, даже если это будет ложное значение, которое будет заменено новым значением, например, nullили ""... но ES5 будет заменено только одно, если только переданное значение это правда, потому что способ ||работает ...

Если по каким - то причинам вы не на ES6 и которые , используя lodashздесь является кратким способом по умолчанию параметров функции с помощью _.defaultToметода:

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>

Который установит значение по умолчанию, если текущее значение равно NaN , null или undefined

Звуки будущего

В будущем вы сможете «распространять» один объект на другой (в настоящее время по состоянию на 2019 г. НЕ поддерживается Edge !) - демонстрация того, как использовать это для хороших параметров по умолчанию независимо от порядка:

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

Ссылка MDN: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax

... между тем, что Edge поддерживает, это Object.assign () (IE нет, но я очень надеюсь, что мы можем оставить IE позади :))

Точно так же вы могли бы сделать

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

РЕДАКТИРОВАТЬ: Из-за комментариев относительно constопций - проблема с использованием константных опций в остальной части функции на самом деле не в том, что вы не можете сделать это, просто в том, что вы не можете использовать постоянную переменную в ее собственном объявлении - вы должны иметь настроить ввод имени на что-то вроде

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
}

Просто чтобы продемонстрировать мои навыки тоже (смеется), вышеприведенная функция может быть написана даже без именованных аргументов, как показано ниже:

ES5 и выше

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

ES6 и выше

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

Следующий код может работать в этой ситуации, включая ECMAScript 6 (ES6), а также более ранние версии.

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

так как значение по умолчанию в языках работает, когда значение параметра функции пропускается при вызове, в JavaScript оно присваивается неопределенному . Этот подход не выглядит привлекательным программно, но имеет обратную совместимость .

Да, это упоминается как параметр по умолчанию

Параметры функции по умолчанию позволяют формальным параметрам инициализироваться значениями по умолчанию, если не передано значение или неопределенное значение.

Синтаксис:

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

Описание:

Параметры функций по умолчанию имеют значение undefined Однако в ситуациях может быть полезно установить другое значение по умолчанию. Здесь параметры по умолчанию могут помочь.

В прошлом общая стратегия установки значений по умолчанию заключалась в проверке значений параметров в теле функции и назначении значения, если они не определены. Если в вызове не указано значение, его значение будет неопределенным. Вы должны установить условную проверку, чтобы убедиться, что параметр не неопределен

С параметрами по умолчанию в ES2015 проверка в теле функции больше не требуется. Теперь вы можете просто поместить значение по умолчанию в заголовок функции.

Пример различий:

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

Различные примеры синтаксиса:

Заполнение не определено против других ложных значений:

Даже если значение установлено явно при вызове, значение аргумента num является значением по умолчанию.

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)

Оценивается во время разговора:

Аргумент по умолчанию оценивается во время вызова, поэтому, в отличие от некоторых других языков, каждый раз при вызове функции создается новый объект.

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

Параметры по умолчанию доступны для последующих параметров по умолчанию:

Уже найденные параметры доступны для последующих параметров по умолчанию

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

Функции, определенные внутри тела функции:

Представлено в Gecko 33 (Firefox 33 / Thunderbird 33 / SeaMonkey 2.30). Функции, объявленные в теле функции, нельзя ссылать в параметрах по умолчанию и генерировать ReferenceError (в настоящее время TypeError в SpiderMonkey, см. Ошибку 1022967). Параметры по умолчанию всегда выполняются первыми, объявления функций внутри тела функции оцениваются позже.

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

Параметры без значений по умолчанию после параметров по умолчанию:

До Gecko 26 (Firefox 26 / Thunderbird 26 / SeaMonkey 2.23 / Firefox OS 1.2) следующий код приводил к ошибке SyntaxError. Это было исправлено в ошибке 777060 и работает, как и ожидалось, в более поздних версиях. Параметры по-прежнему устанавливаются слева направо, перезаписывая параметры по умолчанию, даже если есть более поздние параметры без значений по умолчанию.

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

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

Разрушенный параметр с присвоением значения по умолчанию:

Вы можете использовать присвоение значений по умолчанию с обозначением присвоения деструктурирования

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

f(); // 6

Еще один подход к установке параметров по умолчанию - использовать объектную карту аргументов, а не аргументы напрямую. Например,

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

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

Таким образом, аргументы можно легко расширять и не беспокоиться о несоответствии длины аргумента.

Ответ - да. На самом деле, есть много языков, которые поддерживают параметры по умолчанию. Python является одним из них:

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

Хотя это код Python 3 из-за круглых скобок, параметры по умолчанию в функциях также работают в JS.

Например, и в вашем случае:

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

read_file("test.txt");

Но иногда вам не нужны параметры по умолчанию.

Вы можете просто определить переменную сразу после запуска функции, например так:

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

read_file("test.txt");

В обоих моих примерах возвращается одно и то же. Но иногда они действительно могут быть полезны, как в очень продвинутых проектах.

Итак, в заключение, значения параметров по умолчанию могут быть использованы в JS. Но это почти то же самое, что и определение переменной сразу после запуска функции. Однако иногда они все еще очень полезны. Как вы могли заметить, значения параметров по умолчанию занимают на 1 строку кода меньше стандартного способа, который определяет параметр сразу после запуска функции.

РЕДАКТИРОВАТЬ: И это супер важно! Это не будетработать в IE. Смотрите документацию . Так что с IE вы должны использовать метод «определить переменную в верхней части функции». Параметры по умолчанию не будут работать в IE.

Да, это будет работать в Javascript. Вы также можете сделать это:

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