6

First time seeing something like this in Node.js for declaring functions. In short, the code is similar to this

'use strict';
const Actions = {
  ONE: 'one',
  TWO: 'two',
  THREE: 'three'
};
class FunMap {

  run(action) {
    const map = this;
    map[action]();
  }

  [Actions.ONE] () {
    console.log("Performing action one");
  }

  [Actions.TWO] () {
    console.log("Performing action two");
  }

  [Actions.THREE] () {
    console.log("Performing action three");
  }

}

var funMap = new FunMap();
funMap.run('one');
funMap.run('two');
funMap.run('three');

The above program will print

Performing action one
Performing action two
Performing action three

Is there a technical name for this type of function declaration in Node.js / Javascript?

How does this line put all these (functions declared by using the square brackets with a string constant) into property functions of the FunMap object?

const map = this;

Does the square brackets notation [] in a javascript class references the class itself?

joews
  • 29,767
  • 10
  • 79
  • 91
s-hunter
  • 24,172
  • 16
  • 88
  • 130

1 Answers1

11

The syntax with square brackets in the class is called computed property name. The expression inside the square brackets is evaluated, and the result's string value is used as the key.

The code inside the square brackets can't access the class itself, because it's evaluated before the class declaration.

Your example creates a class that looks like this:

class FunMap {

  run(action) {
    const map = this;
    map[action]();
  }

  one () {
    console.log("Performing action one");
  }

  two () {
    console.log("Performing action two");
  }

  three () {
    console.log("Performing action three");
  }

}

The run function uses square brackets in a different way - to look up a property by name. The line const map = this doesn't do anything special - the function would do the same thing like this:

run(action) {
  return this[action]();
}

this[action] means "get the property called action of this". That value is then called as a function with no arguments.

Computed property names were added in ES2015. The subscript syntax for getting an object by its name has been part of JavaScript since the beginning.

joews
  • 29,767
  • 10
  • 79
  • 91
  • Can I put anything else other than a string constant in the []? Is the answer to my last question a NO? Does the square brackets notation [] in a javascript class references the class itself? – s-hunter Nov 01 '17 at 16:23
  • You can put any expression in the brackets (try `["f" + 1] () { }`), and the answer is no - the code in the square brackets gets run before the class is defined. – joews Nov 01 '17 at 16:26
  • Does any expression in the brackets need to be returning a string? – s-hunter Nov 01 '17 at 16:39
  • No, but the result `toString` value will be used. Try out these in the Node console: `{ [1 + 2]: 3 }`, `{ [{}]: "object" }`, `{ [{ toString() { return "test" } }]: 3 }` – joews Nov 01 '17 at 16:59