what is the purpose of this javascript code structure?

Question

What is the purpose of this javascript code structure?:

var GivenArrayOfJobs = () => {
    var selectedJob: WorkerModels.JobDetailsResponseModel = {
        JobId: "25c63b12-9e37-4be0-a8af-4cf237766317",
        WorkerId: "56e63b12-9e37-4be0-a8af-4cf237766317"
    };
    return selectedJob;
}

Specifically, I'm not sure what the following syntax indicates or its advantage over a more traditional js implementation:

var GivenArrayOfJobs = () => {

Possible duplicate of [Arrow function vs function declaration / expressions: Are they equivalent / exchangeable?](http://stackoverflow.com/questions/34361379/arrow-function-vs-function-declaration-expressions-are-they-equivalent-exch) — Evan Davis, Mar 09 '16 at 18:42
This part doesn't look like legal syntax: `var selectedJob: WorkerModels.JobDetailsResponseModel = {...}` unless it's something new I've never seen before. — jfriend00, Mar 09 '16 at 18:43

score 3 · Answer 1 · answered Mar 09 '16 at 18:40

3

This syntax is called arrow functions and are new in ES2015 specification.

One obvious advantage is that there is slightly less code to write.

Also, arrow functions are lexically scoped and so if you use this inside and arrow function it is bound to the lexical container. In some scenarios this reduces the need to explicitly bind the context (e.g. .bind(this)).

In your example, there is not much difference (in scoping) because this is not used, but the syntax is (subjectively) a bit nicer.

answered Mar 09 '16 at 18:40

Davin Tryon

66,517
15
143
132

In this particular example, what is the advantage of the arrow function over a basic js variable like this: var GivenArrayOfJobs = selectedJob.WorkerModels.JobDetailsResponseModel = { JobId: "25c63b12-9e37-4be0-a8af-4cf237766317", WorkerId: "56e63b12-9e37-4be0-a8af-4cf237766317" }; – Greg Brattle Mar 09 '16 at 19:17

Rajaprabhu Aravindasamy · Answer 2 · 2016-03-09T18:41:43.370

It is Ecmascript 6 arrow function. It is very similar to anonymous functions except that it will bind its lexical scope into it automatically. And that bound scope cannot be modified via call/apply or any further .bind(obj)

Arrow function implementation:

var GivenArrayOfJobs = () => {
    selectedJob.WorkerModels.JobDetailsResponseModel = {
        JobId: "25c63b12-9e37-4be0-a8af-4cf237766317",
        WorkerId: "56e63b12-9e37-4be0-a8af-4cf237766317"
    };
    return selectedJob;
}

Anonymous function implementation:

var GivenArrayOfJobs = function(){
    selectedJob.WorkerModels.JobDetailsResponseModel = {
        JobId: "25c63b12-9e37-4be0-a8af-4cf237766317",
        WorkerId: "56e63b12-9e37-4be0-a8af-4cf237766317"
    };
    return selectedJob;
}.bind(this);

what is the purpose of this javascript code structure?

2 Answers2