Creating a dictionary type object with ES6 Symbols is easy. Yes we have Maps and WeakMaps but this is still interesting for a variety of reasons… Being able to use objects as keys in another object (dictionary) has many great uses…. So how do you use Symbols like this?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
let a ={ id: Symbol('key')},
b ={ id: Symbol('key')};
let dictionary ={[a.id]:'value by obj a',[b.id]:'value by obj b'};
console.log(dictionary[a.id]);
console.log(dictionary[b.id]);// outputs:// 'value by obj a'// 'value by obj b'
By using either object a or object b’s `id` symbol, our dictionary points to another value. This old AS3 snippet is similar:
I have so many little snippets like this laying around, at first I didn’t remember writing this when I found it the other day… then it slowly came back to me.
Looks like this is another one from the jQuery days:
<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"/><title></title><script src="http://code.jquery.com/jquery-latest.min.js"></script><script>
$(function(){// meaning: http://www.ichingfortune.com/hexagrams.php// starting hex: ䷀var flash = $('.flash'),
syms = $('.syms'),
num = $('.num'),
start = 0x4DC0,
total =64,
tick =0;for(var i =0; i < total; i++){
$('<div>',{
html:'&#x'+(start + i).toString(16)}).appendTo(syms);}
flash.html(syms.html());
flash.find('div').hide().first().show();
setInterval(function(){var index = tick % total,
curr = flash.children().eq(index)
.show()
.siblings().hide();
curr = syms.children().eq(index)
.css('color','red')
.siblings().css('color','black');
num.text(index +1);
tick++;},600);});</script><style>*{
font-family:"Helvetica Neue", Helvetica, sans-serif;}
.syms div {
position: relative;
float: left;
font-size: 3em;-webkit-transition: color 300ms ease-out;-ms-transition: color 300ms ease-out;-o-transition: color 300ms ease-out;
transition: color 300ms ease-out;}
.flash{
position: relative;
height: 6em;}
.flash div {
position: absolute;
left:0; top:0;
font-size: 6em;
color: red;-webkit-transform: rotate(90deg);-ms-transform: rotate(90deg);-o-transform: rotate(90deg);
transform: rotate(90deg);}</style></head><body><h2>i ching :<span class="num">1</span></h2><div class="flash"></div><div class="syms"></div></body></html>
The i-ching is a Chinese divinatory system - the “hexagrams” just look very cool, when I noticed they were available starting at `0×4DC0` I made this snippet… think ancient magic 8 ball.
Got a kick out of the story around this stuff… When Knuth shows the notation for surreal numbers I suddenly remembered a weird program I’d written awhile back.
OVM
I had been out drawing in my sketchbook one sunday (almost 2 years ago) and found myself creating a tiny little system of symbols:
A few days later I speed coded a version of the system. Apparently I had posted a screenshot on FB while I was working on it:
See if you can figure out how it works. I’m sure the code could be cleaned up a bit…
While OVM has little/nothing to do with Surreal Numbers - I’m glad the video reminded me it…