Created
April 30, 2014 19:16
-
-
Save pascalduez/11435781 to your computer and use it in GitHub Desktop.
Prototypal inheritance in Sass
This file contains 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
// ---- | |
// Sass (v3.3.7) | |
// Compass (v1.0.0.alpha.18) | |
// ---- | |
// Prototypal inheritance in Sass | |
// Disclaimer: might be totally contrived and useless... | |
// “It’s not about the destination, but the journey.” | |
// New operator | |
// Creates an instance of an objet that has a constructor function. | |
@function new($constructor, $args...) { | |
@if function-exists($constructor) { | |
@return call($constructor, $args...); | |
} | |
@return (); | |
} | |
// Get the prototype of `$object`. | |
@function prototype($object) { | |
@return map-get($object, __proto__); | |
} | |
// Set the prototype of `$object`. | |
@function setPrototypeOf($object, $constructor, $args...) { | |
$callee: new($constructor, $args...); | |
$prototype: ( | |
__proto__: map-merge( | |
(constructor: $constructor), | |
$callee | |
)); | |
@return map-merge(map-merge($object, $prototype), $callee); | |
} | |
// Test whether `$prototype` is prototype of `$object`. | |
@function isPrototypeOf($prototype, $object) { | |
@return $prototype == map-get(prototype($object), constructor); | |
} | |
// Get property `$property` of `$object`. | |
@function property($object, $property) { | |
@return map-get(map-remove($object, methods), $property); | |
} | |
// Test whether `$property` is a direct property of `$object`. | |
@function hasOwnProperty($property, $object) { | |
@return map-has-key($object, $property) | |
and not | |
map-has-key(map-get($object, __proto__), $property); | |
} | |
// Call method `$method` of `$object`. | |
@function method($object, $method) { | |
$args: (); | |
$props: map-get(map-get($object, methods), $method); | |
@each $prop in $props { | |
$args: append($args, property($object, $prop), comma); | |
} | |
@return call($method, $args...); | |
} | |
// A constructor. | |
@function Person($name) { | |
$this: ( | |
kind: "person", | |
name: $name | |
); | |
@return $this; | |
} | |
// A new object with `Person` as prototype. | |
@function Employee($name, $title) { | |
$this: ( | |
title: $title, | |
methods: ( | |
greet: (name, title), | |
foo: () | |
) | |
); | |
$this: setPrototypeOf($this, Person, $name); | |
@return $this; | |
} | |
// A method. | |
@function greet($name, $title) { | |
@return "Hi I'm #{$name}, working as a #{$title}"; | |
} | |
// Test | |
Sass { | |
$zack: new(Employee, "zack", "developer"); | |
zack: inspect($zack); | |
isPrototypeOf_Person: isPrototypeOf(Person, $zack); | |
hasOwnProperty_kind: hasOwnProperty(kind, $zack); | |
title: property($zack, title); | |
greet: method($zack, greet); | |
} |
This file contains 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
Sass { | |
zack: (title: "developer", methods: ((greet: (name, title), foo: ())), __proto__: ((constructor: Person, kind: "person", name: "zack")), kind: "person", name: "zack"); | |
isPrototypeOf_Person: true; | |
hasOwnProperty_kind: false; | |
title: "developer"; | |
greet: "Hi I'm zack, working as a developer"; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment