🔸default parameter
🚧 under construction -> previous parameters
JS ⟩ object ⟩ function ⟩ parameter ⟩ default parameter
🚧
const a = 3; // ❗this one is NEVER referenced in h0 ~ h3 below
const obj = {a}; // { a: 3 }
// ---------------------------------------------------------------------------
// ⛔ "default value" 與 "paremeter name" 沒辦法用「同一個名字」❗
// ---------------------------------------------------------------------------
function h0({a} = {a: a}) { return a } // ⛔ ReferenceError: Cannot access 'a' before initialization
function h1({a} = {a}) { return a } // ⛔ ReferenceError: Cannot access 'a' before initialization
function h2({a} = { }) { return a } // ❗ a = undefined (by default)
function h3({a} ) { return a } // ❗
function h4({a=a} = {}) { return a } // ⛔ ReferenceError: Cannot access 'a' before initialization
// this one is OK.
function g ({a} = {a: 0}) { return a } // ✅const {log} = console;
const a = 3; // ❗this one is NEVER referenced in h0 ~ h4 below
const obj = {a}; // { a: 3 }
// ---------------------------------------------------------------------------
// ⛔ "default value" 與 "paremeter name" 沒辦法用「同一個名字」❗
// ---------------------------------------------------------------------------
function h0({a} = {a: a}) { return a } // ⛔ ReferenceError: Cannot access 'a' before initialization
function h1({a} = {a}) { return a } // ⛔ ReferenceError: Cannot access 'a' before initialization
function h2({a} = {} ) { return a } // ❗ a = undefined (by default)
function h3({a} ) { return a } // ❗
function h4({a=a} = {}) { return a } // ⛔ ReferenceError: Cannot access 'a' before initialization
// this one is OK.
function g ({a} = {a: 0}) { return a } // ✅
// ⭐ default value + previous parameters + object destructuring
function f1({x=1, y=x+2}={}) { return x+y }
function f2(x=1, {y=x+3}={}) { return x+y }
// ⭐ default value + previous parameters
function f3(x=1, y=x+2) { return x+y }
// ⭐ default value
function f4(x=1, g = (t) => 2*t){ return x + g(x) }
// log
// ---------------------------------------------------------------------------
;[
f1(), // 4: x=1, y=3, x+y=4
f2(), // 5: x=1, y=4, x+y=5
f3(), // 4: x=1, y=3, x+y=4
f3(2), // 6: x=2, y=4, x+y=6
f4(), // 3: x=1, x + 2*x = 3
f4(2), // 6: x=2, x + 2*x = 6
f4(2, (x) => x / 3), // 2.6666666666666665: x = 2, return x + x/3
g(), // 0
h2(), // undefined❗
h3(1), // undefined❗
].forEach(x => log(x));
// ❗ log expressios that throw
// ---------------------------------------------------------------------------
[
`f1({y: x + 5})`, // ⛔ [ReferenceError] x is not defined
`f2({y: x + 5})`, // ⛔ [ReferenceError] x is not defined
`h0()`, // ⛔ [ReferenceError] Cannot access 'a' before initialization
`h1()`, // ⛔ [ReferenceError] Cannot access 'a' before initialization
`h3()`, // ⛔ [TypeError] Cannot destructure property 'a' of 'undefined'
`h4()`, // ⛔ [ReferenceError] Cannot access 'a' before initialization
].forEach(exprStr => {
try { log(eval(exprStr)) }
catch (e) { log(`⛔ [${e.constructor.name}]`, e.message); }
});// Clock
class Clock {
// usage:
// • const clock = new Clock()
// • const clock = new Clock({template: 'h:m:s'})
// ⭐️ default parameter (by object destructuring)
constructor({ template = 'h:m:s' } = {}) {
this.template = template;
}
// ex: "16:43:03"
render() {
let date = new Date();
let [h, m, s] = [
date.getHours(), date.getMinutes(), date.getSeconds()
].map(x => `${x}`.padStart(2, '0'));
let output = this.template
.replace('h', h)
.replace('m', m)
.replace('s', s);
console.log(output);
}
stop() {
clearInterval(this.timer);
}
start() {
this.render();
this.timer = setInterval(() => this.render(), 1000);
}
}
const clock = new Clock();
// const clock = new Clock({ template: '_:m:s' });
clock.start();Last updated