default parameters | Chinese Rule of Eight

ref – https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Default_parameters

function test(num = 1) {

console.log(typeof num);

}

// undefined and empty are treated the same. the compiler will see it as empty and use the default values

test(); // 'number' (num is set to 1)

test(undefined); // 'number' (num is set to 1 too)

// test with other falsy values, the compiler will see it as defined values. Thus, use them

test(''); // 'string' (num is set to '')

test(null); // 'object' (num is set to null)

Evaluated at runtime

The default argument gets evaluated at call time.

function append(value, array = []) {

array.push(value);

return array;

}

append(1); //[1]

append(2); //[2], not [1, 2]

we can even assign functions to it:

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

with call, argument list, and default parameters

// declare function for a variable to reference

function go() {

return ':P';

}

then we declare a function with defaults.

The 1st param a references 1st param.
We then have 2nd param b, which defaults to 5.
3rd param c copies over from 2nd param.
d param references go function
e references the ‘this’ object, whatever it is pointing.
f references the default argument list
g references the ‘this’ object, and then access its property ‘value’

function withDefaults(a, b = 5, c = b, d = go(), e = this,

f = arguments, g = this.value) {

console.log(`a is referencing param1: ${a}`);

console.log(`b references ${b}`);

console.log(`c references ${c}`);

console.log(`d references function go(), which returns ${d}`);

console.log(`e = this:`);

console.log(e);

console.log(`f[0] = ${f[0]}`);

console.log(g);

return [a, b, c, d, e, f, g];

}

We call the function like so:

1	let a = withDefaults.call({value: '=^_^='}, 6680);

using call, we provide the first object as the ‘this’ object for withDefaults function. the integer 6680 is the 1st parameter.
thus, just from this knowledge:

a will be 6680
e is the {value: ‘=^_^=’}

We then look at the 2nd param which is b = 5.
third is c = b, which means c is 5.
param 4 is d referencing the returned string of function go().
param 5 e reference the this object, which is supplied by our call function’s 1st parameter.
Hence e references {value: ‘=^_^=’}

f references the basic argument list
finally, g references the this object’s value property.

output:

a is referencing param1: 6680
b references 5
c references 5
d references function go(), which returns 😛
e = this:
{ value: ‘=^_^=’ }
f = [object Arguments]
=^_^=

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

return x + y + z;

}

console.log(f([4,4], {z:8})); // 16