Posts

Showing posts from November, 2011

Array extras and Objects

When Array extras landed in JavaScript 1.6 I had, probably together with other developers, one of those HOORRAYYY moment ... What many libraries and frameworks out there still implement, is this sort of universal each method that supposes to be compatible with both Arrays and Objects. A Bit Messed Up What I have never liked that much about these each methods is that we have to know in advance in any case if the object we are passing is an Array, an ArrayLike one, or an Object. In latter case, the callback passed as second argument will receive as second argument the key , and not the index , which simply means we cannot trust a generic callback unless this does not check per each iterated item the second argument type, or unless we don't care at all about the second argument. In any case I always found this a bad design. If we think about events, as example, it's totally natural to expect a single argument as event object and then we can act accordingly. This let us reuse c

THINK 7" IN WEBSTORE

Image
THINK / GATES OF STEEL 7" ON SALE IN THE WEB-STORE NOW REPRESS OF 200 BY KARMIC SWAMP RECORDS

About Felix's Style Guide

Image
Style guides are good as long as these are meaningful and a bit " open minded " because if one style is recognized as anti pattern then it must be possible to update/change it. The Felix's Node.js Style Guide is surely a meaningful one, but I hope it's open minded too. Why This Post Because I write node.js code as well sometimes and I would like to write code accepted by the community. Since developers may go too religious about guides I don't want explain all these points per each present or future node.js module I gonna write ... I post it once, I will eventually update it, but it's here and I can simply point at this any time. Style Guide Side Effect As happened before with the older one or the linter , a style guide may mislead developers and if they are too religious and unable to think about some point, the quality of the result code may be worse rather than better. I have talked about JSLint already too much in this blog so ... let's bring the top

JSONH New schema Argument

The freaking fast and bandwidth saver JSONH Project has finally a new schema argument added at the end of every method in order to make nested Homogeneous Collections automatically " packable ", here an example: var // nested objects b property // have same homogeneous collections // in properties c and d schema = ["b.c", "b.d"], // test case test = [ { // homogeneous collections in c and d b: { c: [ {a: 1}, {a: 2} ], d: [ {a: 3}, {a: 4} ] } }, { a: 1, // same h

On Complex Getters And Setters

A common use case for getters and setters is via scalar values rather than complex data. Well, this is just a programmer mind limit since data we could set, or get, can be of course much more complex: here an example function Person() {} Person.prototype.toString = function () { return this._name + " is " + this._age; }; // the magic identity configuration object Object.defineProperty(Person.prototype, "identity", { set: function (identity) { // do something meaningful this._name = identity.name; this._age = identity.age; // store identity for the getter this._identity = identity; }, get: function () { return this._identity; } }); With above pattern we can automagically update a Person instance name and age through a single identity assignment. var me = new Person; me.identity = { name: "WebReflection", age: 33 }; alert(me); // WebReflection is 33 While the example may not make muc

Differential Background Scrolling

A quick one about this technique quite common in Flash sites but rarely seen on Web. Have a look at the example first so you can understand what I am talking about ... got it ? What Is This About Let's say we have a background, a big massive graphic background surely not suitable for mobile phones, due data roaming, but maybe cool for desktop and fast ADSL. The background-size CSS property is able to let us decide if the image used as background should fit the whole element or only a portion of it. In this case the image should fit, by default, the whole height of the document with an auto width in order to let the browser adjust the scale. A differential scrolling is visible the moment we scroll the page ... please resize the window into a smaller one if you are in an HD monitor and start scrolling the page. At the very beginning, the default height of the image is 100%, as body background, and with some padding in order to let space for few important image parts such the header

WEDNESDAY

Image

Few JavaScript Patterns

Just to be clear and once again, JavaScript can emulate: classes public and public static methods or properties private and private static methods or properties public and private constants protected methods ... you name it ... // duck typing ( maybe all you need ) var me = {name: "WebReflection"}; // basic class function Person() {} Person.prototype.getName = function () { return this.name; }; Person.prototype.setName = function (name) { this.name = name; }; // module pattern + private properties / methods function Person(_name) { function _getName() { return _name; } return { getName: function () { // redundant, example only return _getName(); }, setName: function (name) { _name = name; } }; } // private shared methods via this var Person = (function () { function Person() {} function _getName () { return this.name; } function _setName (name) {

Function.prototype.notifier

There are way too many ways to stub functions or methods, but at the end of the day all we want to know is always the same: has that function been invoked ? has that function received the expected context ? which argument has been passed to that function ? what was the output of the function ? Update thanks to @bga_ hint about the output property in after notification, it made perfect sense The Concept For fun and no profit I have created a prototype which aim is to bring a DOM like interface to any sort of function or method in order to monitor its lifecycle: the "before" event, able to preventDefault() and avoid the original function call at all the "after" event, in order to understand if the function did those expected changes to the environment or to a generic input object, or simply to analyze the output of the previous call the "error" event, in case we want to be notified if something went wrong during function execution the "handlerer