How to create an object with callable methods, but which I can also call like a function

I use d3.js a lot and have been thinking recently about their linearScale function.

It allows you to do this:

var x = d3.scaleLinear()
    .domain([10, 130])
    .range([0, 960]);

x(20); // 80
x(50); // 320

As far as I can tell:

• x holds the return value of d3.scaleLinear()
• x is object-like, because we can then call the methods 'range' and 'domain'
• x is also function-like, because we can call it like 'x(20)' and get a return value

I do not need to know anything specific about how d3 implements this, d3 is simply the first example that came to mind of an API that allows me to do this.

I am interested in implementing something similar myself in javascript and would like to know the necessary design pattern in its simplest form.

I have tried looking at the source code for d3, but there is a lot of extra functionality, and it's split over multiple files - which makes it hard for me to find what I'm looking for, especially when I don't know what that is. Any help would be much appreciated.