jpcasa
12/21/2018 - 3:14 PM

JS Mixins

Mixin is a way properties are added to objects without using inheritance — Darren Jones

Mixins provide an alternate way of composing your application that isn’t explicitly covered in books on design patterns. — Steve Fenton

Mixins are a form of object composition, where component features get mixed into a composite object so that properties of each mixin become properties of the composite object. — Eric Elliot

README.md
content_copyfile_download
  • Rendered
  • Source

Let’s see a simple example of mixins:

// mixin_ex.js
const mydetails = {}
const  firstname = { firstname: "Nnamdi" }
const surname = { surname: "Chidume" }
const occupation = { occupation: "Software Developer" }
const nationality = { nationality: "Nigerian" }
log(mydetails)
Object.assign(mydetails,surname, firstname, occupation, nationality);
log(mydetails)

this logs:

$ node mixin_ex
{
}
{ 
    firstname: "Nnamdi", 
    surname: "Chidume", 
    occupation: "Software Developer", 
    nationality: "Nigerian" 
}

Object.assign is used to copy the values of properties from one or more objects to the desired object.

We see now that, Object.assign provides the basis in JavaScript for mixin properties between objects(objects without classes).

Object.assign(target, ...sources);