パラメータ関連する特性(パラメータのデフォルト値と割当を構造化代入残りのパラメータ)についてES6 -03ための一連] ES6説明

【オリジナル】コード道路ワーカー

みなさん、こんにちは、ここでは道路の労働者が力を持っているコードがある、私はあなたがパワーある、ヤード道路労働者です。


今日は、コンテンツに関連するパラメータでES6をまとめます。
論文、メッセージ交換を追加へようこそ。
私たちはお互いから学び、一緒に進行してみましょう。

  • 1. ES6パラメータのデフォルト値(パラメータ非必須/オプション)

    ES6、関数のパラメータが設定されていないデフォルト値の前に、スマートな人々は、もちろんそれだけで期待初期値関数に与え与えるようになった判断により参加する別の方法があります。特に、この中に記載されています。

    読書:[手動デフォルトのパラメータ値は、ES5が実装] [ES5Parameter]

    ES6に、あなたは喜んで、パラメータのデフォルト値を設定することができます。以下ではdefaultParamInEnd機能では、age = 18デフォルト値を設定します。

    /* eg.0
    * set default value for parameters
    */
    //-------------------------------------------------
    
    const defaultParamInEnd = function(name, age = 18) {
        console.log(`name: ${name} -- age: ${age}`)
    }
    
    defaultParamInEnd("Coder Power")
    // name: Coder Power -- age: 18
    
    defaultParamInEnd("Coder Power", 32)
    // name: Coder Power -- age: 32
    
    //-------------------------------------------------

    上記の例では、デフォルト値が最後に設定されている、我々はCSharper複数のパラメータは、デフォルト値を有する従来の方法は、連続的に端部に配置されています。

    C# パラメータ設定のデフォルト値は、途中または不連続で許可されていない、オプションのパラメータは、必要なすべてのパラメータの後ろに配置する必要があります。

    そのjsデフォルト値(すなわち、非必須パラメータ)と、いない最後の場所にあるが、パラメータ?次の例では、我々は試してみてください。

```javascript
/* eg.1
* default value of parameters
*/
//-------------------------------------------------

const defaultParamInCenter = function(name, age = 18, gender) {
    console.log(` name: ${name} -- age: ${age} -- gender: ${gender}`)
}

defaultParamInCenter("Coder Power", undefined, "male")
// name: Coder Power -- age: 18 -- gender: male

defaultParamInCenter("Coder Power", null, "male")
// name: Coder Power -- age: null -- gender: male

//-------------------------------------------------
```

结果显示,非必需参数可以出现在中间位置(后面再跟有必需参数)。

注意在传值上还有以下区别:

- 当我们给带默认值的形参`age`传一个`undefined`的时候,函数里得到了默认值`18`;

- 而当我们传`null`的时候,函数里就没有得到默认值,而是`null`了。

建议在定义函数时还是将非必需参数写在最后,设默认值本身就是为了调用时方便,这样就不必为了凑数去传一个`undefined`,直接不传才是非必须参数设计的初衷。
  • 2.残りの構文オペレータは残りのパラメータ(RESTオペレータ構文)を取得します...

    ...両方が剩余操作符语法ある展开操作符语法、他の導入を行って、拡散演算子構文)

    /* eg.2
    * rest parameters
    */
    //-------------------------------------------------
    
    function restParams(name, ...other) {
        console.log(`name: ${name}`)
        console.log(`other: ${other}`)
    }
    
    restParams("Coder Power", 18, "male")
    // name: Coder Power
    // other: 18,male
    
    //-------------------------------------------------

    印字中の上記情報からother: 18,male見ることができる、other2つの値を置くが、つまり、残り二つのパラメータの値は、それ自身の受信されています。

    ない残りオペレータパラメータ構文場合は、それだけ正または値(第2パラメータのすなわち値)を受信することができます。道路の労働者は、このコードを理解することができると考えています。

    ...まず、それは置くと等価収集パラメータ、戻ってきます[ ]、配列を、次にとして働き展开操作符语法詰めコピーパラメータやっと同等の、other内部を。
    残りのパラメータ上を通過するように、または直接理解展开操作符语法パラメータ詰めother李。

    • 脳の洞窟について:演算子の構文は、引数の最後に行うことができない展開?
      JavaScriptの`` `
      / * eg.3
      • 最後に残りのパラメータの演算子ではない
        * /
        // ---------------------------------------- ---------

      関数restParamsNotInEnd(... someParams、性別){
      にconsole.log( other: ${other}
      はconsole.log( someParams: ${someParams}
      }

      restParamsNotInEnd(「コーダパワー」、18、「男性」)
      //にSyntaxError:残りのパラメータが最後の仮引数でなければなりません

      // ------------------------------------------------ -
      `` 结果报错了,异常信息显示残りのパラメータは、「最後の位置に配置する必要があります。

  • 3.解体割り当てられたパラメータ(分割代入)

    処理内容のための簡単な方法は、単にオブジェクトの個々のプロパティを使用して、パラメータを受け取った場合、完全なオブジェクトであり、解体だけで所望のコンテンツを取得することができ(またはすべての属性であってもよいです)。

    /* eg.4
    * Destructuring Assignment of parameters
    */
    //-------------------------------------------------
    
    const person = {
        name: "Coder Power",
        age: 18,
        gender: "male",
        mail: "[email protected]",
        sister: [
            {
                name: 'Emily',
                age: 22,
                gender: "female"
            },
            {
                name: 'Lucy',
                age: 15,
                gender: "female"
            }
        ],
        address: "avenue city province country"
    }
    
    function sayHello ({ name, age, birthday = 20101219 }) {
        console.log(`Hello! I'am ${ name }, ${ age } years old.`)
    }
    
    sayHello(person)
    // Hello! I'am Coder Power, 18 years old.
    
    //-------------------------------------------------
    実際には、{ }機能に書き込ま解体しないだけのパラメータで使用することができるが、同じ効果です。
    同じもモジュラー言及するバックに反映されている导入 import用途に。
    注意:
    • 割り当ての解体のパラメータは別名、解体その他のサポートエイリアスをサポートしていません。
    • しかし、あなたは、デフォルト値を割り当てることができます

      /* eg.4
      * default value for Destructuring Assignment of parameters
      */
      //-------------------------------------------------
      
      function sayHelloAgain ({ name, age, birthday = 19860101 }) {
          console.log(`Hello! I'am ${ name }, ${ age } years old.`)
          console.log(`Birthday: ${ birthday}`)
      }
      
      sayHelloAgain(person)
      // Hello! I'am Coder Power, 18 years old.
      // Birthday: 19860101
      
      //-------------------------------------------------

      上記の例印刷しbirthday、デフォルト値を。


使用される特性に言及していないここで導入に関連するパラメータ、上のES6含有量は、その後の記事で一枚ずつ導入されます。

虚偽と転送論文シェアを歓迎。あなたが行く前にコメントエリアもああメッセージを残すことができます

私は、あなたが助けることができる次のさよならを願っています。


おすすめ

転載: www.cnblogs.com/CoderMonkie/p/es6-function-parameter.html