Last active
August 29, 2015 14:19
-
-
Save RinatMullayanov/f5ab4359aba599ae453a to your computer and use it in GitHub Desktop.
Mixins(примеси) From translate: http://habrahabr.ru/post/147901/, original article: https://javascriptweblog.wordpress.com/2011/05/31/a-fresh-look-at-javascript-mixins/
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var Circle = function() {}; | |
Circle.prototype = { | |
area: function() { | |
return Math.PI * this.radius * this.radius; | |
}, | |
grow: function() { | |
this.radius++; | |
}, | |
shrink: function() { | |
this.radius--; | |
} | |
}; | |
// or more short variant | |
var circleFns = { | |
area: function() { | |
return Math.PI * this.radius * this.radius; | |
}, | |
grow: function() { | |
this.radius++; | |
}, | |
shrink: function() { | |
this.radius--; | |
} | |
}; | |
function extend(destination, source) { | |
for (var k in source) { | |
if (source.hasOwnProperty(k)) { | |
destination[k] = source[k]; | |
} | |
} | |
return destination; | |
} | |
var RoundButton = function(radius, label) { | |
this.radius = radius; | |
this.label = label; | |
}; | |
extend(RoundButton.prototype, circleFns); | |
extend(RoundButton.prototype, buttonFns); | |
//etc. ... |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// adding caching | |
var asRectangle = (function() { | |
function area() { | |
return this.length * this.width; | |
} | |
function grow() { | |
this.length++; | |
this.width++; | |
} | |
function shrink() { | |
this.length--; | |
this.width--; | |
} | |
return function() { | |
this.area = area; | |
this.grow = grow; | |
this.shrink = shrink; | |
return this; | |
}; | |
})(); | |
var RectangularButton = function(length, width, label, action) { | |
this.length = length; | |
this.width = width; | |
this.label = label; | |
this.action = action; | |
}; | |
asRectangle.call(RectangularButton.prototype); | |
var button3 = new RectangularButton(4, 2, 'delete', function() {return 'deleted'}); | |
button3.area(); //8 | |
button3.grow(); | |
button3.area(); //15 |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var asCircle = function() { | |
this.area = function() { | |
return Math.PI * this.radius * this.radius; | |
}; | |
this.grow = function() { | |
this.radius++; | |
}; | |
this.shrink = function() { | |
this.radius--; | |
}; | |
return this; | |
}; | |
var asButton = function() { | |
this.hover = function(bool) { | |
bool ? mylib.appendClass('hover') : mylib.removeClass('hover'); | |
}; | |
this.press = function(bool) { | |
bool ? mylib.appendClass('pressed') : mylib.removeClass('pressed'); | |
}; | |
this.fire = function() { | |
return this.action(); | |
}; | |
return this; | |
}; | |
var Circle = function(radius) { | |
this.radius = radius; | |
}; | |
asCircle.call(Circle.prototype); | |
var circle1 = new Circle(5); | |
circle1.area(); //78.54 | |
// and more hard complex example with options | |
var asOval = function(options) { | |
this.area = function() { | |
return Math.PI * this.longRadius * this.shortRadius; | |
}; | |
this.ratio = function() { | |
return this.longRadius/this.shortRadius; | |
}; | |
this.grow = function() { | |
this.shortRadius += (options.growBy/this.ratio()); | |
this.longRadius += options.growBy; | |
}; | |
this.shrink = function() { | |
this.shortRadius -= (options.shrinkBy/this.ratio()); | |
this.longRadius -= options.shrinkBy; | |
}; | |
return this; | |
} | |
var OvalButton = function(longRadius, shortRadius, label, action) { | |
this.longRadius = longRadius; | |
this.shortRadius = shortRadius; | |
this.label = label; | |
this.action = action; | |
}; | |
asButton.call(OvalButton.prototype); | |
asOval.call(OvalButton.prototype, {growBy: 2, shrinkBy: 2}); | |
var button2 = new OvalButton(3, 2, 'send', function() {return 'message sent'}); | |
button2.area(); //18.84955592153876 | |
button2.grow(); | |
button2.area(); //52.35987755982988 | |
button2.fire(); //'message sent' |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// adding curry | |
Function.prototype.curry = function() { | |
var fn = this; | |
var args = [].slice.call(arguments, 0); | |
return function() { | |
return fn.apply(this, args.concat([].slice.call(arguments, 0))); | |
}; | |
} | |
var asRectangle = (function() { | |
function area() { | |
return this.length * this.width; | |
} | |
function grow(growBy) { | |
this.length += growBy, this.width +=growBy; | |
} | |
function shrink(shrinkBy) { | |
this.length -= shrinkBy, this.width -= shrinkBy; | |
} | |
return function(options) { | |
this.area = area; | |
this.grow = grow.curry(options['growBy']); | |
this.shrink = shrink.curry(options['shrinkBy']); | |
return this; | |
}; | |
})(); | |
asRectangle.call(RectangularButton.prototype, {growBy: 2, shrinkBy: 2}); | |
var button4 = new RectangularButton(2, 1, 'add', function() {return 'added'}); | |
button4.area(); //2 | |
button4.grow(); | |
button4.area(); //12 |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment