2547

JavaScript 関数に、値が定義されていない場合に使用される (値が渡された場合は無視される) デフォルトを設定するオプションの引数を持たせたいと考えています。Ruby では次のようにできます。

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

これは JavaScript で動作しますか?

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

29 に答える 29

3473

ES6/ES2015から、デフォルトのパラメータは言語仕様にあります。

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

ただ動作します。

参照:デフォルトのパラメータ - MDN

既定の関数パラメーターを使用すると、値が渡されないか未定義の値が渡された場合に、仮パラメーターを既定値で初期化できます。

destructuring を介して、デフォルトの名前付きパラメーターをシミュレートすることもできます。

// 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';
  ...
}
于 2009-05-21T20:10:52.287 に答える
618 
function read_file(file, delete_after) {
    delete_after = delete_after || "my default here";
    //rest of code
}

偽の値でない場合、これはのdelete_after値に割り当てます。それ以外の場合は、文字列 を割り当てます。詳細については、言語に関する Doug Crockford の調査と Operators のセクションを参照してください。delete_after"my default here"

このアプローチは、偽の値、つまりfalse、null、undefined、0またはを渡したい場合には機能しません""。偽の値を渡す必要がある場合は、Tom Ritter's answer のメソッドを使用する必要があります。

関数に多数のパラメーターを処理する場合、コンシューマーがパラメーター引数をオブジェクトに渡してから、これらの値を関数のデフォルト値を含むオブジェクトとマージできるようにすると便利なことがよくあります。

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" });
于 2009-05-21T20:09:48.560 に答える
153

個人的には、このような単純なものの方がはるかに簡潔で読みやすいと思います。

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

function myFunc(x) {
  x = pick(x, 'my default');
}
于 2009-05-21T20:18:46.483 に答える
30

デフォルトのパラメータ値

JavaScriptES6 では、関数パラメーターのデフォルト値の設定に関連して、おそらく最も一般的なイディオムの 1 つを実行できます。私たちが何年もこれを行ってきた方法は、非常によく知られているはずです。

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 に渡されるわけではないため0 is falsy、x || 11 results in 11が直接渡されるわけではありません。

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
于 2016-10-15T17:58:14.600 に答える
11

undefined との明示的な比較を使用するだけです。

function read_file(file, delete_after)
{
    if(delete_after === undefined) { delete_after = false; }
}
于 2015-11-16T07:34:34.947 に答える
9

長年の C++ 開発者 (Web 開発の新人 :)) である私がこの状況に初めて遭遇したとき、次のように、質問で言及されているように、関数定義でパラメーターの割り当てを行いました。

function myfunc(a,b=10)

ただし、ブラウザ間で一貫して機能しないことに注意してください。私にとっては、デスクトップのクロムでは機能しましたが、アンドロイドのクロムでは機能しませんでした。多くの人が上で述べたように、より安全なオプションは -

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

この回答の意図は、他の人がすでに述べた同じ解決策を繰り返すことではありませんが、関数定義でのパラメーターの割り当てが一部のブラウザーで機能する可能性があるが、それに依存しないことを通知することです。

于 2016-05-19T06:40:08.083 に答える
8

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
}

2016 年 8 月 8 日現在、これはまだ問題です

于 2016-08-03T14:49:14.950 に答える
5 
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!!!
于 2018-06-08T08:55:11.290 に答える
3

何らかの理由で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の場合にデフォルトを設定します

于 2018-10-10T07:04:59.637 に答える
2

私の腕前も披露するために（笑）、上記の関数は以下のように引数に名前を付けなくても書くことができます：

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';
    ...
}
于 2019-12-19T08:39:04.180 に答える
0 
export const getfilesize = (bytes, decimals = 2) => {
    if (bytes === 0){ 
        return '0 Bytes';
    }else{
        const k = 1024;
        const dm = decimals < 0 ? 0 : decimals;
        const sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];
        const i = Math.floor(Math.log(bytes) / Math.log(k));
        return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i];

    }
}
于 2021-07-26T12:12:59.173 に答える
0

デフォルトのパラメーターを設定する別の方法は、引数を直接ではなく、引数のオブジェクト マップを使用することです。例えば、

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

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

このように、引数を拡張するのは簡単で、引数の長さの不一致について心配する必要はありません。

于 2019-06-13T09:26:15.587 に答える
-3

はい、これは 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
于 2016-07-19T11:59:31.997 に答える