diff --git a/README.md b/README.md index 9231c622..ec4a8e4a 100644 --- a/README.md +++ b/README.md @@ -6258,38 +6258,51 @@ 350. ### Does javascript uses mixins - Mixin is a generic object-oriented programming term - is a class containing methods that can be used by other classes without a need to inherit from it. In JavaScript we can only inherit from a single object. ie. There can be only one `[[prototype]]` for an object. + JavaScript itself does not have a native concept of mixins. However, developers often implement mixins using various patterns and techniques. A mixin is essentially a way to combine and reuse code in different parts of your application. It's a form of object composition where you can mix in functionality from one or more objects into a new object. - But sometimes we require to extend more than one, to overcome this we can use Mixin which helps to copy methods to the prototype of another class. +One common way to implement mixins in JavaScript is through object composition. You can create functions or objects that encapsulate a specific set of behaviors and then mix them into other objects. - Say for instance, we've two classes `User` and `CleanRoom`. Suppose we need to add `CleanRoom` functionality to `User`, so that user can clean the room at demand. Here's where concept called mixins comes into picture. +Here's a simple example using object composition: ```javascript - // mixin - let cleanRoomMixin = { - cleanRoom() { - alert(`Hello ${this.name}, your room is clean now`); - }, - sayBye() { - alert(`Bye ${this.name}`); - }, - }; - - // usage: - class User { - constructor(name) { - this.name = name; - } - } - - // copy the methods - Object.assign(User.prototype, cleanRoomMixin); + // Define a mixin + const myMixin = { + sayHello() { + console.log("Hello from the mixin!"); + } + }; + + // Create an object and mix in the functionality + const myObject = { + name: "John" + }; + + Object.assign(myObject, myMixin); + + myObject.sayHello(); // Output: Hello from the mixin! + + // Define a mixin function + function myMixin(obj) { + obj.sayHello = function() { + console.log("Hello from the mixin!"); + }; + return obj; + } + + // Create an object and apply the mixin + const myObject = { + name: "John" + }; + + myMixin(myObject); + + myObject.sayHello(); // Output: Hello from the mixin! - // now User can clean the room - new User("Dude").cleanRoom(); // Hello Dude, your room is clean now! + ``` **[⬆ Back to Top](#table-of-contents)** +modern JavaScript also provides features like classes, which offer a way to achieve similar results through inheritance and composition. Additionally, libraries like lodash and frameworks like Vue.js provide utilities for mixin-like behavior. 351. ### What is a thunk function