A javascript design pattern for options with default values?

Question

// opt_options is optional function foo(a, b, opt_options) {   // opt_c, opt_d, and opt_e are read from 'opt_options', only c and d have defaults   var opt_c = 'default_for_c';   var opt_d = 'default_for_d';   var opt_e; // e has no default    if (opt_options) {     opt_c = opt_options.c || opt_c;     opt_d = opt_options.d || opt_d;     opt_e = opt_options.e;   } } 

The above seems awfully verbose. What's a better way to handle argument options with default parameters?

Answer 1

This uses jQuery.extend but could be interchanged with an object merger from your library of choice or Object.assign in ES6.

function Module(options){     var defaults = {         color: 'red'     };     var actual = $.extend({}, defaults, options || {});     console.info( actual.color ); }  var a = new Module(); // Red var b = new Module( { color: 'blue' } ); // Blue 

---

Edit: Now also in underscore or lodash!

function Module(options){     var actual = _.defaults(options || {}, {          color: 'red'     });     console.info( actual.color ); }  var a = new Module(); // Red var b = new Module( { color: 'blue' } ); // Blue 

---

In Javascript ES6 you can use Object.assign:

function Module(options = {}){     let defaults = {         color: 'red'     };     let actual = Object.assign({}, defaults, options);     console.info( actual.color ); } 

Answer 2

Using the ES2018 spread syntax for object properties:

const defaults = { a: 1, b: 2 };  const ƒ = (given = {}) => {   const options = { ...defaults, ...given };   console.log(options); }; 

Using ES6/ES2015 features, several more options are available.

Using destructuring assignment:

const { a = 1, b = 2 } = options; 

You can also use destructuring function parameters:

const ƒ = ({a = 1, b = 2, c = 3} = {}) => {    console.log({ a, b, c }); }; 

Using Object.assign:

options = Object.assign({}, defaults, options); 

No dependencies!