ECMASCRIPT6 function default Parameters _javascript tips

Every new feature in the language update is extracted from millions of developers ' requirements, which can be used to reduce programmer pain and convenience.

That's what we always write.

function calc (x, y) {
  x = x | | 0;
  y = y | | 0;
  To does with X, y
  //return x/y
}

Simply put, X,y provides a default value of 0, x, y with value 0来. It is calculated as the actual value.

Also like defining an Ajax

function ajax (URL, async, dataType) {
  async = Async!== false
  DataType = DataType | | ' JSON '
  //...
}

I use native JS package a simple Ajax function, url required, async and datatype optional, that is not filled with the default synchronization request and return JSON format data.

Define a rectangular class again

function Rectangle (width, height) {
  this.width = width |
  This.height = Height | | (a)

When new does not pass any arguments, a rectangle with a default width of 200*300 is also created.

Whether it is a calc,ajax function or a rectangle class, we all need to do the default value in the function body, if the language itself processing not happy? ES6 provides this attribute (Default Parameters), and the following is the Calc,ajax,rectangle overridden with the new ES6 feature.

Function Calc (x=0, y=0) {
  //...
  Console.log (x, y)
}
Calc ();//0 0
Calc (1, 4);//1 4
 
function ajax (URL, async=true, datatype= "JSON") {
   // ...
  Console.log (URL, async, dataType)
}
Ajax ('.. /user.action '); // .. /user.action true JSON
Ajax (' .... /user.action ', false); // .. /user.action false JSON
Ajax (' .... /user.action ', False, ' XML '); // .. /user.action false XML
 
function Rectangle (width=200, height=300) {
  this.width = width;
  this.height = height;
}
var r1 = new Rectangle (); 200*300 's Rectangle
var r2 = new Rectangle (100);//100*300 rectangle
var r3 = new Rectangle (100, 500);//100*500 Rectangle

As you can see, ES6 moves the default value section from braces to parentheses, and reduces the "| |" operation, the body of the function has been thin. The default value of the parameter, it should be in the definition of the parameters of the place, so that looks a lot simpler. O (∩_∩) o

The default parameters can be defined in any location, such as the middle definition of a

function ajax (URL, async=true, success) {
  //...
  Console.log (URL, async, success)
}

Defines a default parameter Async,url and success are required to pass the middle argument to the undefined

Ajax ('.. /user.action ', Undefined, function () {
   
})

Note that instead of taking undefined to null, even if NULL = undefined, after null, the async in the function body is null is not true.

The following points need to be noted:

1. When the default parameters are defined, the length property of the function is reduced, that is, several default parameters are not included in the calculation of length

Function Calc (x=0, y=0) {
  //...
  Console.log (x, y)
}
function ajax (URL, async=true, datatype= "JSON") {
  //...
  Console.log (URL, async, dataType)
}
Console.log (calc.length);//0
Console.log (ajax.length);//1

2. Cannot declare default value again with let and Const, VAR can

function Ajax (url=). /user.action ", Async=true, Success) {
  var url = ';//Allow let
  async = 3;///error
  Const SUCCESS = function () {} ; Error
}

Another interesting thing is that the default parameter can be not a value type, it can be a function call

function Getcallback () {return
  function () {
    //return code
  }
}
 
function ajax (URL, async, success= Getcallback ()) {
  //...
  Console.log (URL, async, success)
}

You can see here the parameter success is a function call, and if the third argument is not passed when invoking Ajax, the Getcallback function is executed, which returns a new function assignment to success. This is a very powerful feature that gives programmers a lot of imagination to play with space.

For example, you can use this attribute to force a parameter to be specified and the error will not be transmitted.

function throwif () {
  throw new Error (' less parameters ');
}
 
function Ajax (Url=throwif (), Async=true, success) {return
  URL;
}
Ajax (); Error: Less parameters are passed

The above mentioned is the entire content of this article, I hope you can enjoy.