mixins javascript
let bird = {
name: "Donald",
numLegs: 2
};
let plane = {
model: "777",
numPassengers: 524
};
let flyMixin = function(obj) {
obj.fly = function() {
console.log("Flying, wooosh!");
}
};
flyMixin(bird);
flyMixin(plane);
bird.fly(); // "Flying, wooosh!"
plane.fly(); // "Flying, wooosh!"What is a Mixin?
/*
Mixins are Sass functions that group CSS declarations together.
We can reuse them later like variables.
We can create a mixin with @mixin ex: @mixin variable-name {}
we can create a mixin as a function show below and add parameters as well
After creating the mixin, we can use it in any class with @include command.
This approach simplifies the code.
*/
/****example-1****/
@mixin my-flex {
display:flex;
align-items:center;
justify-content:center;
}
/****example-2****/
$font-color: red;
@mixin my-font($font-color) {...}
/****HOW TO USE****/
div {
@include my-flex;
}Copyright © 2021 Codeinu
Forgot your account's password or having trouble logging into your Account? Don't worry, we'll help you to get back your account. Enter your email address and we'll send you a recovery link to reset your password. If you are experiencing problems resetting your password contact us
