JSFiddle - React, Tailwind, and code Playground

by Chase Wilson

HTML

<ul id="catcher"></ul>

CSS

#catcher {border: 2px #ccc solid;padding: 20px;}

#catcher li {margin: 10px 0;}

JavaScript

(function(){
    var isFns = {
        isArray: function(){
            return typeof this=='array';
        },
        isObject: function(){
            return typeof this=='object';
        },
        isNumber: function(){
            return typeof this=='number';
        },
        isFunction: function(){
            return typeof this=='function';
        },
        isString: function(){
            return typeof this=='string';
        },
        isUndefined: function(){
            return typeof this=='undefined';
        }
    };
    Array.implement(isFns);
    Number.implement(isFns);
    Function.implement(isFns);
    String.implement(isFns);
})();

window.addEvent('domready',function(){
    var types = ['rad',3,'cool',2,function(){return '...';}];
    
    types.each(function(it){
        var msg = '"'+it+'" is ';
        msg += it.isNumber?'a <code>number</code>.':'not a <code>number</code>.  ';
        msg += 'It\'s a <code>'+$type(it)+'</code>.';
        
        new Element('li',{html:msg}).inject($('catcher'));
    });
});