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 GloverFuck what you heard, SHORTS AREDOPE. Just wear them right. Not mid leglike you’re at a fuckin Creed concert.30 Jul via Echofon

Code has social customs.

IN THE BEGINNING (ca. 2005)

Prototype 1.1

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 verbotenhttp://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.4Element.addClassName(some_element, active);Element.show();$(some_element).setAttribute(title, Active item);// Prototype 1.5$(some_element).addClassName(active).show(). setAttribute(title, Active item);

This was slow in IE

@kangax kangaxAlso `typeofdocument.querySelectorAll(*).item` is string in IE8. Well, thatsjust silly.16 Dec 08 via web

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

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

Who owns built-ins?

We all do.

Social customs are a proven way to manage shared property.

Case in point: RUBY

Ruby and JavaScriptare Smalltalk-inﬂuenced

Rails gave RubyActive 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_procresult = names.map {|name| name.upcase }# becomes...result = names.map(&:upcase)

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

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

EcmaScript 5.1 Speciﬁcation

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 doesnt hurt anyone else.”Zed Shaw,“The Chainsaw Infanticide Logger Manuever”http://is.gd/chainsaw_infanticide

“Dont slip a concrete dildo into someones box of Fruit Loops. They wont 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 its the concrete dildo?’) at least they know to ask.”The Higgs Bozohttp://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 Katzhttp://is.gd/cQar9O

Lessons learned by Rubyists:

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/bytes3.megabytes#=> 31457283.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

Unsolved problems:

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 {}:Hashrequire rails{}.blank?#=> true

Can we extend built-ins safely right now?

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

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 };whiteHouse.extend({ adams: jefferson });for (var president in whiteHouse) console.log(president);//=> washington, adams

But wait…var whiteHouse = { extend: adams };whiteHouse.extend({ adams: jefferson });// 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.

What about Node?

node-timehttps://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/ChicagoCDT

What about the browser?

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; };}

Let’s start with bind.

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

Will we be able toextend built-ins safely someday?

The future:CLASSBOXES

“[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 Bernhttp://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 Extensionsmodule 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

SOMEDAY

Questions?

http://lanyrd.com	188
https://twitter.com	4
http://www.techgig.com	3
http://translate.googleusercontent.com	3
http://us-w1.rockmelt.com	2
http://twitter.com	2

Everything is Permitted: Extending Built-ins

by Andrew Dupont

Accessibility

Categories

Upload Details

Usage Rights

6 Embeds 202

Statistics

Everything is Permitted: Extending Built-ins Presentation Transcript