From d082571bd6776c2d65fd03aa2ad15c89d4c0b727 Mon Sep 17 00:00:00 2001 From: d8uv Date: Mon, 11 Mar 2013 13:51:26 -0700 Subject: [PATCH 1/2] Detecting and Creating Missing Functions rewrite MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit New solution, and greatly expanded discussion section to explain it. From:   unless Class::member     Class::member = contents To:   do -> Class::member ?= contents --- .../detecting-and-replacing-functions.md | 15 ++++++++++----- 1 file changed, 10 insertions(+), 5 deletions(-) diff --git a/chapters/metaprogramming/detecting-and-replacing-functions.md b/chapters/metaprogramming/detecting-and-replacing-functions.md index 6a99931..f8d81b5 100644 --- a/chapters/metaprogramming/detecting-and-replacing-functions.md +++ b/chapters/metaprogramming/detecting-and-replacing-functions.md @@ -9,12 +9,11 @@ You want to detect if a function exists and create it if it does not (such as an ## Solution -Use `::` to detect the function, and assign to it if it does not exist. +Use the existential assignment operator (`?=`) to assign a function to the classes' prototype (using the `::` shorthand), and wrap it all in a IIFE (`do ->`) to contain the variables. {% highlight coffeescript %} -unless Array::filter - Array::filter = (callback) -> - element for element in this when callback element +do -> Array::filter ?= (callback) -> + element for element in this when callback element array = [1..10] @@ -24,4 +23,10 @@ array.filter (x) -> x > 5 ## Discussion -Objects in JavaScript (and thus, in CoffeeScript) have a prototype member that defines what member functions should be available on all objects based on that prototype. In CoffeeScript, you can access the prototype directly via the `::` operator. +Objects in JavaScript (and thus, in CoffeeScript) have a prototype member that defines what member functions should be available on all objects based on that prototype. +In Coffeescript, you access this prototype using the `::` shortcut. So, if you want to add a filter function to the array class, you do `Array::filter = ...`. This will add the filter function to all arrays. + +However, we don't ever want to overwrite a prototype that we haven't created in the first place. For example, if `Array::filter` already exists in a fast native form in the browser, or a library maker has their own specific version of `Array::filter`, then you'll either replace the quick native version with a slow Javascript version, or you will break the library that depends on their own Array::shuffle. +What you need to do is only add the function if it doesn't already exist. That's where the existential assignment operator (`?=`) comes in. If we do `Array::filter ?= ...` instead, it will see if `Array::filter` already exists. If it does, then it will use the current version. If it doesn't, it will add yours. + +Finally, because the existential assignment operator--when compiled--creates a few variables, we clean up the code by wrapping it in an [Immediately-Invoked Function Expression (IIFE)](http://benalman.com/news/2010/11/immediately-invoked-function-expression/). This hides those internal-use-only variables from leaking outside. So, if the function we're writing already exists, it runs, does basically nothing, and exits, affecting absolutely none of your code. But, if the function we're writing *doesn't* exist, we send out only the function we're writing as a closure, so only the function you've made affects the code. The internal workings of `?=` are hidden either way. From e9076fec3027a267eb585c6ff94e414d445ff29e Mon Sep 17 00:00:00 2001 From: d8uv Date: Mon, 11 Mar 2013 18:11:19 -0700 Subject: [PATCH 2/2] Add annotated javascript of Polyfill pattern rewrite --- .../detecting-and-replacing-functions.md | 30 +++++++++++++++++++ 1 file changed, 30 insertions(+) diff --git a/chapters/metaprogramming/detecting-and-replacing-functions.md b/chapters/metaprogramming/detecting-and-replacing-functions.md index f8d81b5..4ba7b64 100644 --- a/chapters/metaprogramming/detecting-and-replacing-functions.md +++ b/chapters/metaprogramming/detecting-and-replacing-functions.md @@ -30,3 +30,33 @@ However, we don't ever want to overwrite a prototype that we haven't created in What you need to do is only add the function if it doesn't already exist. That's where the existential assignment operator (`?=`) comes in. If we do `Array::filter ?= ...` instead, it will see if `Array::filter` already exists. If it does, then it will use the current version. If it doesn't, it will add yours. Finally, because the existential assignment operator--when compiled--creates a few variables, we clean up the code by wrapping it in an [Immediately-Invoked Function Expression (IIFE)](http://benalman.com/news/2010/11/immediately-invoked-function-expression/). This hides those internal-use-only variables from leaking outside. So, if the function we're writing already exists, it runs, does basically nothing, and exits, affecting absolutely none of your code. But, if the function we're writing *doesn't* exist, we send out only the function we're writing as a closure, so only the function you've made affects the code. The internal workings of `?=` are hidden either way. + +### Example + +Below, we've compiled and annotated the coffeescript written in the solution above + +{% highlight javascript %} +// (function(){ ... })() is an IIFE, compiled in thanks to `do ->` +(function() { + + // This is from the `?=` operator, used to check if Array.prototype.filter (`Array::filter`) exists. + // If it does, we set it to itself, and return. If it doesn't, then we set it to the function, and return the function. + // The IIFE is only used to hide _base and _ref from the outside world. + var _base, _ref; + return (_ref = (_base = Array.prototype).filter) != null ? _ref : _base.filter = function(callback) { + + // `element for element in this when callback element` + var element, _i, _len, _results; + _results = []; + for (_i = 0, _len = this.length; _i < _len; _i++) { + element = this[_i]; + if (callback(element)) { + _results.push(element); + } + } + return _results; + + }; +// The end of the IIFE from `do ->` +})(); +{% endhighlight %}