ECMA Sugar - sgml/signature GitHub Wiki
// Template Literals
var box = jsx`
<${Box}>
${
shouldShowAnswer(user) ?
jsx`<${Answer} value=${false}>no</${Answer}>` :
jsx`
<${Box.Comment}>
Text Content
</${Box.Comment}>
`
}
</${Box}>
`;
// JSX
var box =
<Box>
{
shouldShowAnswer(user) ?
<Answer value={false}>no</Answer> :
<Box.Comment>
Text Content
</Box.Comment>
}
</Box>;
<script>
let counter = 0;
function increment() {
counter = counter + 1;
}
/** @param {MouseEvent} event */
function track(event) {
trackEvent(event);
}
</script>
<button on:click={increment} on:click={track}>Click me!</button>
var foo = {};
function main()
{
'use strict';
/* Initialize global state */
foo.bar = foo.bar || 0;
/* Initialize timer */
foo.bop = setInterval(foo.baz, 1000);
}
sleep =
function(timer)
{
'use strict';
clearInterval(timer);
timer = setTimeout(function(){main()}, 5000);
};
foo.baz =
function()
{
'use strict';
/* Update state */
foo.bar = Number(foo.bar + 1) || 0;
/* Log state */
console.log(foo.bar);
/* Check state and stop at 10 */
(foo.bar === 5) && sleep(foo.bop);
(foo.bar === 10) && clearInterval(foo.bop);
};
main();
Foo = function(message){
this.message = message;
}
Foo.prototype = new Error();
var dateString = "June 2013";
var foo = new Date(dateString);
if (dateString.match(/\s[0-31]\s/) === null)
{
Object.defineProperty(foo, 'getDate', {value: function(){return null} });
}
console.log(foo.getDate() );
- Template Literals: https://www.digitalocean.com/community/tutorials/understanding-template-literals-in-javascript
- Namespacing: http://2ality.com/2014/12/es6-symbols.html
- Tracing: http://2ality.com/2014/12/es6-proxies.html
- Type Coercion: http://2ality.com/2015/11/stage3-object-entries.html
- Overriding: http://2ality.com/2015/09/well-known-symbols-es6.html
- Overriding: http://2ality.com/2015/09/well-known-symbols-es6.html
- Unicode Escapes: http://2ality.com/2016/09/template-literal-revision.html
- Destructuring: http://2ality.com/2016/10/rest-spread-properties.html
- Iteration: http://2ality.com/2016/10/asynchronous-iteration.html
- Proper Tail-Calls: https://www.linkedin.com/pulse/tail-call-optimizations-es6-michael-clark
- Tail-Call Iteration: http://raganwald.com/2018/05/27/tail.html
- Require=>Import: https://www.npmjs.com/package/replace-require-with-import
- RegExp Lookbehind Assertions: https://www.bram.us/2018/01/30/whats-new-in-ecmascript2018/
- Template Literal Revision: https://js.checkio.org/blog/ecmascript-2018/
- Shared Memory: https://flaviocopes.com/es2017/#shared-memory-and-atomics
- ECMAScript-7: https://github.com/nzakas/understandinges6/blob/master/manuscript/B-ECMAScript-7.md
- globalThis: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/globalThis
- Nullish coalescing operator: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Nullish_coalescing
- Weakmaps come in Handy: https://macarthur.me/posts/when-a-weakmap-came-in-handy
- getters/setters and Proxies for Reactivity: https://vuejs.org/guide/extras/reactivity-in-depth.html#how-reactivity-works-in-vue
- Proxy and Reflect for Reactivity: https://jefrydco.id/en/blog/create-reactivity-system-vue-3-javascript/#reflect
- In-Depth Perspective on Webpack Bundling (Maps and WeakMaps): https://indepth.dev/posts/1482/an-in-depth-perspective-on-webpacks-bundling-process
- Metaprogramming: https://2ality.com/2014/12/es6-proxies.html