An experiment with the console

An experiment with the console.markdown

An experiment with the console

Adding additional info to a console dump of an object.

A Pen by zardozcs on CodePen.

License.

index.html

h1#el
	|H3ll0, {World}
	|Check the console log, it's all happening there.

script.js

var clear = false;
// an object of stuff to debug
var Stuff = {
  _undefined: undefined,
  _null: null,
  _boolean: true,
  _integer: -123,
  _number: 12.34e+2,
  _NaN: NaN,
  _Infinity: Infinity,
  _string: "string",
  _Function: function () {},
  _RegExp: /regex/,
  _Array: [],
  _Object: {},
  _Date: new Date(),
  _window: window,
  _document: document,
  _Element: document.getElementById("el"),
  '-': '-'
};
// map data type to polish notation prefix
var PolishMap = {
  "undefined": "u",
  "object/null": "o",
  "boolean": "b",
  "number": "n",
  "string": "s",
  "function": "f",
  "RegExp": "r",
  "array": "a",
  "object": "o",
  "date": "d",
  "unknown": "x"
};
console.log("window", window);
console.log("body", document.body);
console.log("Stuff", Stuff);
console.dir(Stuff);

// get data types (augmented typeof) for object properties or simple type
function types (obj) {
  var key, Types = typeof obj;
  if ("object" === Types) {
    Types = {};
    for (key in obj) {
      Types[key] = typeof obj[key];
      if (null === obj[key]) {
        Types[key] += "/null";
      }
    }
  }
  else if ("array" === Types) {
  }
  return Types;
}

// get polish notation prefix for object keys or simple data type
function polish (obj) {
  var Types = types(obj), Polish = {}, key;
  if ("object" === typeof Types) {
    for (key in Types) {
      if (Types.hasOwnProperty(key)) {
        if (obj.hasOwnProperty(key)) {
          Polish[key] = ".";
        }
        else {
          Polish[key] = "^";
        }
        Polish[key] += PolishMap[Types[key]] || PolishMap.unknown;
      }
    }
  }
  else {
    Polish = PolishMap[Types] || PolishMap.unknown;
  }
  return Polish;
}

// show api of an object ordered by inheritance and data types
// members of object first  .n-property 
// inherited members later  ^n-inherited
function api (obj) {
  var API = {}, Polish, key;
  if ("object" === typeof obj) {
    Polish = polish(obj);
    for (key in Polish) {
      if (Polish.hasOwnProperty(key)) {
        API[Polish[key] + "-" + key] = obj[key];
      }
    }
  }
  else {
    API = polish(obj);
  }
  return API;
}

console.log("types(array)", types([1, false, "this"]));
console.log("types(object)", types(Stuff));
console.log("polish(string)", polish("what"));
console.log("polish(object)", polish(Stuff));
console.log("polish(element)", polish(Stuff._Element));
console.log("api(element)", api(Stuff._Element));
console.dir("api(d3(element))", api(d3.select("h1#el")[0]));

if (clear) {
	console.clear();
}
console.log("### ASSERT log if condition false ###");
console.log("IE10: (x) [object Object]");
console.assert(true === true, { assert: true });
console.assert(true === false, { assert: false });

if ("undefined" === typeof console.debug) { console.debug = console.log; }

console.log("### DEBUG alias for LOG ###");
console.log("IE10: (x) does not support method");
console.debug(true === true, { debug: true });

console.log("### DIR show/interact with object properties ###");
console.log("IE10: \"[object Object]\"");
console.dir(true === true, { dir: true });

scripts

<script src="//cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js"></script>

style.css

* { 
	background: black; 
	color: orange; 
	font-family: ProFontWindows, Consolas, Courier, Monospace, Fixed, Serif; 
	font-size: 24px; 
	font-weight: 1000;
}