Everything is Permitted: Extending Built-ins

Everything is Permitted:
Extending Built-ins

Andrew Dupont
http://andrewdupont.net

Remy Sharp (ﬂickr.com/photos/remysharp)

“ There’s a whole lot of know-nothing advocacy
that’s still happening in the JS/webdev/design
world these days, and it annoys me to no end.
I’m not sure how our community got so religious
and fact-disoriented, but it has got to stop.”
Alex Russell

“If you use this book as a guide, by all means
leave the road when you wish. That is precisely
the use of a road: to reach individually chosen
points of departure. By all means break the
rules, and break them beautifully, deliberately
and well. That is one of the ends for which they
exist.”
Robert Bringhurst,
The Elements of Typographic Style

“Break any of these rules sooner than say
anything outright barbarous.”
George Orwell,
“Politics and the English Language”

“Commandments”
are no way to write code.

Alex (ﬂickr.com/photos/littlebirdfeet/)

@DonaldGlover
Donald Glover

Fuck what you heard, SHORTS ARE
DOPE. Just wear them right. Not mid leg
like you’re at a fuckin Creed concert.
30 Jul via Echofon

IN THE BEGINNING
(ca. 2005)

Object.prototype.extend = function(object) {
for (var property in object) {
this[property] = object[property];
}
return this;
};

var whiteHouse = { washington: 'adams' };
whiteHouse.extend({ adams: 'jefferson' });

for (var president in whiteHouse)
console.log(president);
//=> washington, adams, extend

Object.prototype is verboten
http://erik.eae.net/archives/2005/06/06/22.13.54/

You can do anything you want,
assuming it’s all your code

Object.prototype.extend
became
Object.extend

if (!Array.prototype.push) {
Array.prototype.push = function() {
var startLength = this.length;
for (var i = 0; i < arguments.length; i++)
this[startLength + i] = arguments[i];
return this.length;
};
}

Prototype 1.4 introduced
Enumerable

for...in loops on arrays
are usually dumb

JavaScript “Associative Arrays” Considered Harmful
http://is.gd/js_considered_harmful

Prototype 1.5 introduced
“Extended” elements

// Prototype 1.4
Element.addClassName('some_element', 'active');
Element.show();
$('some_element').setAttribute('title', 'Active item');

// Prototype 1.5
$('some_element').addClassName('active').show().
setAttribute('title', 'Active item');

@kangax
kangax

Also `typeof
document.querySelectorAll
('*').item` is 'string' in IE8. Well, that's
just silly.
16 Dec 08 via web

What’s wrong with extending the DOM
http://perfectionkills.com/whats-wrong-with-extending-the-dom/

Maintainable JavaScript: Don’t modify objects you don’t own
http://is.gd/zakas_maintainable_javascript

Social customs are a proven way
to manage shared property.

Ruby and JavaScript
are Smalltalk-inﬂuenced

Rails gave Ruby
Active Support

ActiveSupport::CoreExtensions::Numeric
1.day.ago
#=> Thu Apr 21 01:57:24 -0500 2011

(4.years + 12.days).from_now
#=> Mon May 04 01:58:30 -0500 2015

7.5.megabytes
#=> 7864320.0

Symbol#to_proc

result = names.map {|name| name.upcase }
# becomes...
result = names.map(&:upcase)

http://brockman.se/2004/method-references/

Prototype 1.4
Function.prototype.bind = function() {
var __method = this, args = $A(arguments), object = args.shift();
return function() {
return __method.apply(object, args.concat($A(arguments)));
};
};

Obviously,
there were ﬁghts along the way

“I only re-open a class after I’ve tried every other
option like subclassing, wrapping, etc. If nothing else
works or is too much effort for the modification, then
I document the hell out of my modification and try
desperately to localize the change so that it doesn't
hurt anyone else.”
Zed Shaw,
“The Chainsaw Infanticide Logger Manuever”
http://is.gd/chainsaw_infanticide

“Don't slip a concrete dildo into someone's box of Fruit
Loops. They won't be happy with your Morning
Breakfast Surprise. Put the concrete dildo in a
clearly labeled box, with instructions. Then when
someone encounters a problem (‘Hey, something is
screwing me here. Maybe it's the concrete dildo?’) at
least they know to ask.”
The Higgs Bozo
http://is.gd/concrete_dildo

“In my mind, in Ruby < 2.0, there’s a category of library
which is ‘provide a number of useful core
extensions.’ The three major ones are ActiveSupport,
Extlib and Facets. In general, applications need to
choose one, but not more of these libraries to avoid
conflicts.”
Yehuda Katz
http://is.gd/cQar9O

Make it obvious when you’re deﬁning core extensions.
module SomeLibrary
module CoreExtensions
module Object
def foo
# ...
end
end
end
end

class Object
include SomeLibrary::CoreExtensions::Object
end

Make core extensions as atomic as possible.
require 'active_support/core_ext/numeric/bytes'

3.megabytes
#=> 3145728

3.days.ago
# NoMethodError: undefined method `days' for 3:Fixnum

If you must monkey-patch, do so seamlessly.
Don’t break the old method’s contract.

class Array
alias_method :foo_original :foo

def foo(arg)
puts "Adding advice to the 'foo' method"
foo_original(arg)
end
end

Only one library gets the privilege
to extend built-ins.

Libraries I require will o en decide for themselves
which core extensions will be used.
{}.blank?
# NoMethodError: undefined method `blank?' for {}:Hash

require 'rails'
{}.blank?
#=> true

Can we extend built-ins
safely right now?

ES5 to the rescue?
Object.defineProperty(Object.prototype, 'extend',
{
writable: true,
configurable: true,
enumerable: false,
value: function() {
for (var i = 0, len = arguments.length, source; i < len; i++) {
source = arguments[i];
for (var property in source) {
if (source.hasOwnProperty(property))
this[property] = source[property];
}
}
}
}
);

var whiteHouse = { washington: 'adams' };

for (var president in whiteHouse)
console.log(president);
//=> washington, adams

But wait…

var whiteHouse = { extend: 'adams' };

// TypeError: Property 'extend' of object #<Object>
// is not a function

And also…

console.log(extend);
//=> [Function]

Object.prototype is still verboten

If you extend other built-ins,
consider turning oﬀ enumerability.

node-time
https://github.com/TooTallNate/node-time

var time = require('time');

var date = new Date();
date.setTimeZone('America/Chicago');

console.log(date.toString());
console.log(date.getTimezone());
console.log(date.getTimezoneAbbr());

Output:
Tue Apr 26 2011 02:45:21 GMT-0500 (CDT)
America/Chicago
CDT

We’ll be needing ES5 polyfills
“A polyfill … is a piece of code (or plugin) that
provides the technology that you, the
developer, expect the browser to provide
natively.”
Remy Sharp
http://remysharp.com/2010/10/08/what-is-a-polyfill/

if (!Object.keys) {
Object.keys = function(object) {
if (object !== Object(object))
throw new TypeError('Object.keys called on non-object');

var results = [];
for (var property in object) {
if (object.hasOwnProperty(property))
results.push(property);
}

return results;
};
}

if (!Function.prototype.bind) {
Function.prototype.bind = function(object) {
var slice = Array.prototype.slice,
args = slice.call(arguments, 1),
self = this;

var nop = function() {};
var bound = function() {
return self.apply(
this instanceof nop ? this : (object || {}),
args.concat(slice.call(arguments))
);
};

nop.prototype = self.prototype;
bound.prototype = new nop();
return bound;
};
}

Prototype 1.7.1
will have spec compliance
for all methods deﬁned by ES5.

Will we be able to
extend built-ins safely someday?

“[W]e present classboxes, a module system for object-
oriented languages that allows method addition and
replacement. Moreover, the changes made by a
classbox are only visible to that classbox (or
classboxes that import it), a feature we call local
rebinding.”
So ware Composition Group,
University of Bern
http://scg.unibe.ch/research/classboxes

A classbox-like system called “reﬁnements”
has been proposed for Ruby 2.0.

module TimeExtensions
refine Numeric do
def minutes; self * 60; end
end
end

2.minutes #=> NoMethodError

using TimeExtensions
2.minutes #=> 120

Could we have classboxes
in JavaScript?

Strawman: Scoped Object Extensions

module NumericExtensions {
export extension Time = Number.prototype {
days: function() {},
/* ... */

ago: function() {},
fromNow: function() {}
}
}

function setExpiringCookie(key, value) {
import NumericExtensions.Time;
var expires = (3).days().fromNow();
setCookie(key, value, expires);
}

(3).days().fromNow();
//=> TypeError: Object 3 has no method 'days'

Everything is Permitted: Extending Built-ins

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Similar to Everything is Permitted: Extending Built-ins

Similar to Everything is Permitted: Extending Built-ins (20)

More from Andrew Dupont

More from Andrew Dupont (6)

Recently uploaded

Recently uploaded (20)

Everything is Permitted: Extending Built-ins