You Don't Know JS - Eval

in You Don't Know JS

Table of Contents

  1. Have you seen eval() written like this?
  2. Regular eval
  3. Global eval
  4. Back to the original topic

Recently I’ve been writing quite a bit of front-end stuff and seen quite a few tricks from other people’s libraries. It turns out JavaScript is a pretty wonky and fked up interesting language, which tempts me to write a series about it and this is the first one. This is by no means supposed to show how to write JS but just to show some “wacky” stuff.

Have you seen eval() written like this?

(0, eval)('something');
Are you fucking kidding me

Regular eval

Eval basically allows you to execute any script within the given context.

For example:

1
2
3
4
5
6
7
8
eval('console.log("123");');            // prints out 123

(function A() {
    this.a = 1;

    eval('console.log(this.a);');            // 1
})();

So far everything is normal: eval runs inside the current scope. this is pointed to the instance of A.

Global eval

Things get interesting when you do this:

1
2
3
4
5
6
7
8
var someVar = 'outer';

(function A() {
    this.someVar = 'inner';

    eval('console.log(someVar);');       // you may want 'outer' but this says 'inner'
})();

Well in this scenario eval cannot get the value of someVar in the global scope.

However ECMA5 says, if you change eval() call to indirect, in other words, if you use it as a value rather than a function reference, then it will evaluate the input in the global scope.

So this would work:

1
2
3
4
5
6
7
8
9
var someVar = 'outer';

(function A() {
    var geval = eval;
    this.someVar = 'inner';

    geval('console.log(someVar);');       // 'outer'
})();

Although geval and eval call the exact same function, geval is a value and thus it becomes an indirect call according to ECMA5.

Back to the original topic

So what the hell is (0, eval) then? Well a comma separated expression list evaluates to the last value, so it essentially is a shortcut to

var geval = eval;
geval(...);

0 is only a puppet here. It could be any value.

So much win

Comment and share

Why you should ditch Browserify and CommonJS in the http/2 world

in Frontend

Stop bundling in the http/2 world since it does it for you.

Modularization is a great idea

Back in the old days where there were no concept regarding frontend package management, we would lay out all the scripts in order in the html file, and hope for the best that they would somehow work together if order were right. This surely doesn’t work well with huge projects, but luckily back then JavaScripts weren’t so shiny anyways - UIs weren’t so cool and logic was much simpler. However, things do evolve. People soon noticed that this approach wouldn’t scale - cooperation across multiple teams becomes super tricky, if not impossible, and it doesn’t play well with DRY either.

Then people came up with a great idea of modularizing JS code (probably back in 2003?) the same way you would do for your beloved Java/C++ code libraries. And then there came the CommonJS definition concept by Kevin Dangoor back in 2009. Many people got to know this idea thanks to Node.js, and it works quite well, especially for server side code. Now you can easily use npm and build both the frontend and backend using the same tool very quickly, thanks to the JS community. Since people have the same interface for code modularization, team cooperation becomes much easier and projects gain benefit from much better encapsulation.

Continue reading

It's all about buffers: zero-copy, mmap and Java NIO

in OS

There are use cases where data need to be read from source to a sink without modification. In code this might look quite simple: for example in Java, you may read data from one InputStream chunk by chunk into a small buffer (typically 8KB), and feed them into the OutputStream, or even better, you could create a PipedInputStream, which is basically just a util that maintains that buffer for you. However, if low latency is crucial to your software, this might be quite expensive from the OS perspective and I shall explain.

What happens under the hood

Well, here’s what happens when the above code is used:

  1. JVM sends read() syscall.
  2. OS context switches to kernel mode and reads data into the input socket buffer.
  3. OS kernel then copies data into user buffer, and context switches back to user mode. read() returns.
  4. JVM processes code logic and sends write() syscall.
  5. OS context switches to kernel mode and copies data from user buffer to output socket buffer.
  6. OS returns to user mode and logic in JVM continues.
Continue reading

Get Started with Hexo Blogging System

in Hexo

You should read this if

  • You want to set up a personal blog
  • You know what Markdown is
  • You don’t want to set up a heavy Wordpress environment
  • You don’t want to set up any database just for the blog
  • You either don’t have a VPS or want to host blog content in some easy-to-reach place.
  • You still want a template/theme system.

Solution

Github Pages + Hexo (what this site uses)

Continue reading
Author's picture

Shawn Xu

Software Engineer in Bay Area