I really didn't know what to call this question, neither what I could google for. I'm trying to understand the source code for the D3.js library and I've encountered two functions that I simply can't understand, due to the syntax that is new to me.

The first one is the number interpolator:

function d3_interpolateNumber(a, b) {
  b -= a = +a;
  return function(t) { return a + b * t; };
}

What's going on on the second line here? We're subtracting the value of b from the value of a and then...uhm, you lost me. How does this syntax work?

The other thing that confuses me, that I've seen in other places as well, is where the right-hand assignment of a variable consists of several variables separated by mas. As in:

var i = d3.interpolators.length, f;

What does this mean? These snippets are taken from .js and .js

I really didn't know what to call this question, neither what I could google for. I'm trying to understand the source code for the D3.js library and I've encountered two functions that I simply can't understand, due to the syntax that is new to me.

The first one is the number interpolator:

function d3_interpolateNumber(a, b) {
  b -= a = +a;
  return function(t) { return a + b * t; };
}

What's going on on the second line here? We're subtracting the value of b from the value of a and then...uhm, you lost me. How does this syntax work?

The other thing that confuses me, that I've seen in other places as well, is where the right-hand assignment of a variable consists of several variables separated by mas. As in:

var i = d3.interpolators.length, f;

What does this mean? These snippets are taken from https://github./mbostock/d3/blob/master/src/interpolate/number.js and https://github./mbostock/d3/blob/master/src/interpolate/interpolate.js

• javascript
• variables
• syntax

3 Answers 3

The first line you're asking about is just two assignments. It's equivalent to this:

a = +a;
b -= a;

The +a is using the unary plus operator to convert a string to a number. So we are converting a to a number and then subtracting that number from b (and reassigning the new value to b).

The second bit of syntax you're asking about is simply a list of variable declarations. For example:

var a, b, c; // Declares 3 variables, all initialised to undefined

That's equivalent to this:

var a;
var b;
var c;

In your example, one of the declarations in the list also includes an assignment. Any number of them can, so this is valid too:

var a, b = 1, c = true, d;

An assignment is also an expression, which returns the value that is assigned. So this:

b -= a = +a;

is the same as:

b -= (a = +a);

or:

a = +a;
b -= a;

If the right hand side would really be values separated by ma, i.e:

var i = (d3.interpolators.length, f);

then the ma operator returns the value of the last operand, so it would be the same as:

d3.interpolators.length;
var i = f;

However, without the parentheses the ma is a separator between declared variables, not the ma operator, so it's the same as:

var i = d3.interpolators.length;
var f;

The second line is

 b -= (a = +a);

Which means:

• set a to +a (conversion to a number). Return this value outside of the parentheses.
• Whatever value was returned, subtract it from b.

or

a=+a //converts a to an int
b-=a // or b=b-a

Remember, assignments return their value. So, alert(a=1) will alert 1.

On the other hand,

var i = d3.interpolators.length, f;

splits to:

var i = d3.interpolators.length;
var f;

This is just basically a way of saying "var applie to the following ma separated list"