xDict!

by very

HTML

<script src="http://plaintext.bplaced.net/js/xdict-compiled.js"></script>
<h1>xDict!</h1><br>
<var>xDict</var> is an empty, immutable and sorted dictionary. Let's grab a copy.
<code>dict = xDict</code><br>
Now let's add some entries
<code>dict = dict.put("hello", "world");
dict = dict.put("foo", "bar");
dict = dict.put("window", window)</code><br>
And overwrite an entry.
<code>dict = dict.put("foo", "newbar")</code><br>
Whenever we want to make a copy of a dictionary we just have to put it into another variable.
<code>dict2 = dict</code><br>
Now even if we remove an entry from the original <var>dict</var>, <var>dict2</var> isn't altered.
<code>dict.remove("hello");
dict2</code><br>
But of course <var>dict</var> isn't altered also.
<code>dict</code><br>
That's  because all the dictionaries are immutable. Thus we always have to keep  the return value if we use a method which adds or removes entries. But  those are few.<br><br>
<h1>Use!</h1><br>
Let's take a look at some other useful methods.
<code>dict.get("hello")</code>
<code>dict.keysForValue("newbar")</code>
<code>dict.size()</code>
<code>dict.isEmpty()</code>
<code>dict.clear();</code><br>
The last method (<var>clear</var>) is kind of silly. It just returns an empty dictionary.<br><br>
<code>dict.keyForValue(window)</code><br>
<var>keyForValue</var> returns the first key which is mapped to the given value.<br><br>
But what if we had several keys for the same value?
<code>dict = dict.put("silly", "world");
dict.keyForValue("world")</code><br>
It returns "hello" because that's the first key for the value "world" in our <em>sorted</em> dictionary. If we wanted to know all the keys we would use <var>key<strong>s</strong>ForValue</var> (note the extra s in the methods name).
<code>dict.keysForValue("world")</code><br>
The method returns a simple array with all the requested keys.<br><br>
<h1>Access!</h1><br>
There are several methods to acces the keys, values and entries (key &...

CSS

h1 {
    font-size: 150%;
}

code {
    display: block;
    background-color: #9AFF9A;
    border: 1px solid #66CDAA;
    white-space: pre;
    margin-left: 20px;
    padding: 5px;
    text-indent: -1.8em;
    padding-left: 2.5em;
}

code:before {
    content: ">> ";
}

result {
    display: block;
    background-color: #7AC5CD;
    margin-top: 5px;
    margin-left: 0px;
    margin-right: 10px;
    white-space: pre;
    padding: 0em;
    text-indent: 0em;
}

result.error {
    background-color: #FF3434;
}

result.console {
    background-color: #8AD5DD;
}

em {
    font-style: italic;
}

strong {
    font-weight: bold;
}

var {
    background-color: #EEEEEE;
    font-family: monospace;
    border: 1px dashed #BBBBBB;
}

keyword {
    color: #0000EF;
}

JavaScript

var codeNodes = document.getElementsByTagName("code");
var len = codeNodes.length;
for (var i = 0; i < len; i++) {
    process(codeNodes[i]);
}

function process(codeNode) {
    var codeText = codeNode.textContent;
    codeNode.innerHTML = codeText.replace(/\b(break|case|catch|continue|default|delete|do|else|false|finally|for|function|if|in|instanceof|new|null|return|switch|this|throw|true|try|typeof|var|void|while|with)\b/g, "<keyword>$1</keyword>");
    var resultValue, node, consoleText = "";
    var errorOccurred = false;

    var oldPrint = print;
    print = function(text) {
        consoleText += text;
    };
    try {
        resultValue = evaluate(codeText);
    } catch (e) {
        resultValue = e;
        errorOccurred = true;
    }
    print = oldPrint;
    
    if (consoleText.length > 0) {
        node = document.createElement("result");
        node.className = "console";
        node.appendChild(document.createTextNode(consoleText));
        codeNode.appendChild(node);
    }
    if (typeof resultValue !== "undefined") {
        node = document.createElement("result");
        if (errorOccurred) {
            node.className = "error";
        }
        node.appendChild(document.createTextNode(String(resultValue)));
        codeNode.appendChild(node);
    }
}

function evaluate() {
    return eval(arguments[0]);
}