JavaScript programming brain teaser

Днес Dustin Diaz постави в блога си интересна задача:

http://www.dustindiaz.com/programming-brain-teaser/

В  задачата е даден следния Javascript масив

var arr = ['a', 'b', 'c', 'c', 'd','e', 'e', 'e', 'e', 'e', 'f', 'e', 'f', 'e', 'f', 'a', 'a', 'a', 'f', 'f', 'f'];

Като от него трябва да се получи следния стринг:

a b c c d e e <span>e e e</span> f e f e f a a <span>a</span> f f <span>f</span>

Тъй като сутрин не съм много на активен успях набързо да напиша само това:

var open = false, str = '';
arr.forEach(function(item, i, a){
    if (a[i-1] != item)
        open = false;
    else if (!open)
        if (a[i-1] == item && a[i-2] == item){
            open = true;
            str += '<span>';
        }

    str += item;
    if (open && a[i+1] != item)
        str += '</span>';
    if (a[i+1])
        str += ' ';
});

update: Но след като видях 1-2 решения доста интересни решения (особено това на http://mykenta.blogspot.com/2008/07/dustin-diaz-programming-brain-teaser.html) си мисля че това може би е едно от най-оптимизираните решения:

arr.join(' ').replace(/(.) (\1)(( \1)+ ?)/g, function(m, g1, g2, g3){
    return g1 + ' ' + g1 + ' <span>' + g3.replace(/^\s+/, '').replace(/\s+$/, '') + '</span>';
}).replace(/\s+$/, '');

update: Това е най-доброто решени(май):
http://dmitry.baranovskiy.com/post/41419429