let spec ={
get:(o, key)=>{return o[key]!=null? o[key]: o[key]= O();},
set:(o, key, v)=>{
o[key]= v;}};
let O =()=>{returnnew Proxy({}, spec);};
let dynamic = O();
dynamic.prop.creation='is interesting';
dynamic.prop.stuff.not.clear.what.this.could.be.used.for=123;// log out full structure
let f =(o)=>{for(let i in o){
console.log(o[i]);if(typeof o[i]==='object') f(o[i]);}};
f(dynamic);
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:
let rotX =0, rotY =0,
perspective =500,
depth,
currX, currY;// learned something like this at Andries Odendaal's www.wireframe.co.za function point3d(x, y, z){
let cosX = Math.cos(rotX),
cosY = Math.cos(rotY),
sinX = Math.sin(rotX),
sinY = Math.sin(rotY),
posX, posY, posZ;
posZ = z * cosX - x * sinX,
posX = z * sinX + x * cosX,
posY = y * cosY - posZ * sinY,
posZ = y * sinY + posZ * cosY;
depth =1/ (posZ / perspective +1);
currX = posX * depth;
currY = posY * depth;return[ currX, currY, depth ];}
Here’s is an example of it in action:
I’ve used this code many many times, it’s just easy to throw into any language and instantly get 3d points rendered in 2d. Here is a short video of a Java applet from 2003 called “Catch Env” that made use of it:
You’ll notice in that source, that I nested the equation to allow for local and global transformations. It was around that time that I learned the ins and outs of real 2D and 3D matrix transformation math… Ken Perlin’s classfiles from NYU were a real help when I was learning that stuff. I don’t think this was the exact file I was working with, but it was definitely on his site somewhere.
Before all that, during my junior year in college I created a 3d engine based off Odendaal’s code in Director (Lingo). Here is a video of some of the demos for it:
…and here is a strange screenshot from my personal website at the time:
Just an example of a powerful snippet and a gateway to learning matrix transformation math. When I first really dug in to html5 canvas - before WebGL was supported so widely - having this trick up my sleeve was great. As you can see in the below link, I used it more than a few times back then:
