freeCodeCamp/curriculum/challenges/english/02-javascript-algorithms-and-data-structures/object-oriented-programming/use-a-mixin-to-add-common-behavior-between-unrelated-objects.english.md
SomeDer bfa5c26288 fix: use dfn instead of code tag (#36640)
* Use dfn tags

* remove misused <dfn> tags

* Revert "remove misused <dfn> tags"

This reverts commit b24968a96810f618d831410ac90a0bc452ebde50.

* Update curriculum/challenges/english/01-responsive-web-design/basic-html-and-html5/fill-in-the-blank-with-placeholder-text.english.md

Co-Authored-By: Randell Dawson <5313213+RandellDawson@users.noreply.github.com>

* Make "array" lowercase

Co-Authored-By: Randell Dawson <5313213+RandellDawson@users.noreply.github.com>

* Fix dfn usage

* Address last dfn tags
2019-10-27 12:45:37 -04:00

2.7 KiB

id, title, challengeType, forumTopicId
id title challengeType forumTopicId
587d7db2367417b2b2512b89 Use a Mixin to Add Common Behavior Between Unrelated Objects 1 301331

Description

As you have seen, behavior is shared through inheritance. However, there are cases when inheritance is not the best solution. Inheritance does not work well for unrelated objects like Bird and Airplane. They can both fly, but a Bird is not a type of Airplane and vice versa. For unrelated objects, it's better to use mixins. A mixin allows other objects to use a collection of functions.
let flyMixin = function(obj) {
  obj.fly = function() {
    console.log("Flying, wooosh!");
  }
};

The flyMixin takes any object and gives it the fly method.

let bird = {
  name: "Donald",
  numLegs: 2
};

let plane = {
  model: "777",
  numPassengers: 524
};

flyMixin(bird);
flyMixin(plane);

Here bird and plane are passed into flyMixin, which then assigns the fly function to each object. Now bird and plane can both fly:

bird.fly(); // prints "Flying, wooosh!"
plane.fly(); // prints "Flying, wooosh!"

Note how the mixin allows for the same fly method to be reused by unrelated objects bird and plane.

Instructions

Create a mixin named glideMixin that defines a method named glide. Then use the glideMixin to give both bird and boat the ability to glide.

Tests

tests:
  - text: Your code should declare a <code>glideMixin</code> variable that is a function.
    testString: assert(typeof glideMixin === "function");
  - text: Your code should use the <code>glideMixin</code> on the <code>bird</code> object to give it the <code>glide</code> method.
    testString: assert(typeof bird.glide === "function");
  - text: Your code should use the <code>glideMixin</code> on the <code>boat</code> object to give it the <code>glide</code> method.
    testString: assert(typeof boat.glide === "function");

Challenge Seed

let bird = {
  name: "Donald",
  numLegs: 2
};

let boat = {
  name: "Warrior",
  type: "race-boat"
};

// Add your code below this line






Solution

let bird = {
  name: "Donald",
  numLegs: 2
};

let boat = {
  name: "Warrior",
  type: "race-boat"
};
function glideMixin (obj) {
  obj.glide = () => 'Gliding!';
}

glideMixin(bird);
glideMixin(boat);