ES6 and Lambdas | Tiffany R. White Blog

ES6 and Lambdas

Reading time: 7 mins

I am taking the JavaScript ES6 course on Treehouse. I should have waited a bit, as I am still learning ES5. Eric Elliott made the case that newbies should be learning ES6 right now as it is the current standard. So I am diving in.

One of the things that has me excited are lambda functions. JavaScript calls them Arrow functions, but I like the traditional name better. So for this article, I will call them lambda functions.

Here is an example of a lambda function being used in ES6:

[javascript] ‘use strict’ var Person = function (data) { for (var key in data) { this[key] = data[key];
} this.getKeys = () => { return Object.keys(this); } }

var Alena = new Person({ name: ‘Alena’, role: ‘Teacher’ });

console.log(‘Alena's Keys:’, Alena.getKeys()); // ‘this’ refers to ‘Alena’

var getKeys = Alena.getKeys;

console.log(getKeys()); // ‘this’ refers to the node process [/javascript]

Here in the is a Person constructor object with a function that takes the parameter data. On this constructor is a method called getKeys that returns the object’s keys using a lambda function.

Below that, a new Person object is instantiated and we log the keys for the Alena object to the console.

The lambda function binds the function to the object, no matter where it is called.

If we were to take a look at the code before the writing the lambda function, it would look like this:

[javascript] ‘use strict’ var Person = function (data) { for (var key in data) { this[key] = data[key];
} this.getKeys = function () { return Object.keys(this); } }

var Alena = new Person({ name: ‘Alena’, role: ‘Teacher’ });

console.log(‘Alena's Keys:’, Alena.getKeys()); // ‘this’ refers to ‘Alena’

var getKeys = Alena.getKeys;

console.log(getKeys()); // ‘this’ refers to the node process [/javascript]

This code will throw an exception because we are calling the getKeys method outside of the Person constructor code block. This means it is out of scope.

More Lambdas

When code gets messy like this:

[javascript] ‘use strict’;

var Teacher = function (data) { this.name = data.name; this.greet = function (studentCnt) { let promise = new Promise(function (resolve, reject) { if (studentCnt === 0) { reject(‘Zero students in class’); } else { resolve(Hello to ${studentCnt} of my favorite students!); } }); return promise; } }

var Classroom = function (data) { this.subject = data.name; this.teacher = data.teacher; this.students = []; this.addStudent = function (data) { this.students.push(data); this.greet(); } this.greet = () => { this.teacher.greet(this.students.length).then( (function (classroom) { return function (greeting) { console.log(${classroom.teacher.name} says: , greeting); } })(this), function (err) { console.log(err); }) } }

var myTeacher = new Teacher({ name: ‘James’ }); var myClassroom = new Classroom({ name: ‘The Future of JavaScript’, teacher: myTeacher });

myClassroom.addStudent({ name: ‘Dave’ }); [/javascript]

it is a good idea to scrap the spaghetti code and write something with lambda or arrow functions, and use JavaScript Promises:

[javascript] ‘use strict’;

var Teacher = function (data) { this.name = data.name; this.greet = function (studentCnt) { let promise = new Promise(function (resolve, reject) { if (studentCnt === 0) { reject(‘Zero students in class’); } else { resolve(Hello to ${studentCnt} of my favorite students!); } }); return promise; } }

var Classroom = function (data) { this.subject = data.name; this.teacher = data.teacher; this.students = []; this.addStudent = function (data) { this.students.push(data); this.greet(); } this.greet = () => { this.teacher.greet(this.students.length).then( greeting => console.log(${this.teacher.name} says: , greeting); err => console.log(err); } }

var myTeacher = new Teacher({ name: ‘James’ }); var myClassroom = new Classroom({ name: ‘The Future of JavaScript’, teacher: myTeacher });

myClassroom.addStudent({ name: ‘Dave’ }); [/javascript]

You use Promises asynchronously with callback functions, handing those functions off to another scope. You must be careful that the promise can access its original scope, or it will throw an exception.

Web Dev CS 0134

I am taking the JavaScript ES6 course on Treehouse. I should have waited a bit, as I am still learning ES5. Eric Elliott made the case that newbies should be learning ES6 right now as it is the current standard. So I am diving in.

One of the things that has me excited are lambda functions. JavaScript calls them Arrow functions, but I like the traditional name better. So for this article, I will call them lambda functions.

Here is an example of a lambda function being used in ES6:

[javascript] ‘use strict’ var Person = function (data) { for (var key in data) { this[key] = data[key];
} this.getKeys = () => { return Object.keys(this); } }

var Alena = new Person({ name: ‘Alena’, role: ‘Teacher’ });

console.log(‘Alena's Keys:’, Alena.getKeys()); // ‘this’ refers to ‘Alena’

var getKeys = Alena.getKeys;

console.log(getKeys()); // ‘this’ refers to the node process [/javascript]

Here in the is a Person constructor object with a function that takes the parameter data. On this constructor is a method called getKeys that returns the object’s keys using a lambda function.

Below that, a new Person object is instantiated and we log the keys for the Alena object to the console.

The lambda function binds the function to the object, no matter where it is called.

If we were to take a look at the code before the writing the lambda function, it would look like this:

[javascript] ‘use strict’ var Person = function (data) { for (var key in data) { this[key] = data[key];
} this.getKeys = function () { return Object.keys(this); } }

var Alena = new Person({ name: ‘Alena’, role: ‘Teacher’ });

console.log(‘Alena's Keys:’, Alena.getKeys()); // ‘this’ refers to ‘Alena’

var getKeys = Alena.getKeys;

console.log(getKeys()); // ‘this’ refers to the node process [/javascript]

This code will throw an exception because we are calling the getKeys method outside of the Person constructor code block. This means it is out of scope.

More Lambdas

When code gets messy like this:

[javascript] ‘use strict’;

var Teacher = function (data) { this.name = data.name; this.greet = function (studentCnt) { let promise = new Promise(function (resolve, reject) { if (studentCnt === 0) { reject(‘Zero students in class’); } else { resolve(Hello to ${studentCnt} of my favorite students!); } }); return promise; } }

var Classroom = function (data) { this.subject = data.name; this.teacher = data.teacher; this.students = []; this.addStudent = function (data) { this.students.push(data); this.greet(); } this.greet = () => { this.teacher.greet(this.students.length).then( (function (classroom) { return function (greeting) { console.log(${classroom.teacher.name} says: , greeting); } })(this), function (err) { console.log(err); }) } }

var myTeacher = new Teacher({ name: ‘James’ }); var myClassroom = new Classroom({ name: ‘The Future of JavaScript’, teacher: myTeacher });

myClassroom.addStudent({ name: ‘Dave’ }); [/javascript]

it is a good idea to scrap the spaghetti code and write something with lambda or arrow functions, and use JavaScript Promises:

[javascript] ‘use strict’;

var Teacher = function (data) { this.name = data.name; this.greet = function (studentCnt) { let promise = new Promise(function (resolve, reject) { if (studentCnt === 0) { reject(‘Zero students in class’); } else { resolve(Hello to ${studentCnt} of my favorite students!); } }); return promise; } }

var Classroom = function (data) { this.subject = data.name; this.teacher = data.teacher; this.students = []; this.addStudent = function (data) { this.students.push(data); this.greet(); } this.greet = () => { this.teacher.greet(this.students.length).then( greeting => console.log(${this.teacher.name} says: , greeting); err => console.log(err); } }

var myTeacher = new Teacher({ name: ‘James’ }); var myClassroom = new Classroom({ name: ‘The Future of JavaScript’, teacher: myTeacher });

myClassroom.addStudent({ name: ‘Dave’ }); [/javascript]

You use Promises asynchronously with callback functions, handing those functions off to another scope. You must be careful that the promise can access its original scope, or it will throw an exception.

Web Dev CS 0134

I really want to see what the web development course has in store for me this semester. I wonder if we will use ES6. I doubt it, but I am hopeful.


Share

No Ads. No Sponsored Content. Ever.

I've decided that I no longer want to have sponsored posts on this blog. I also, though as tempting as it may sound, don't want ads; even if I got big enough for Carbon ads I don't want them. I want to post free, engaging content for beginning/junior devs. This means that I won't have Setapp posts or affiliates on this blog, though I will keep them on the Uses page. If you enjoy the content, buy me a coffee. Just click the button below.


Coffee Buy me a coffeeBuy me a coffee


Webmentions 0

No webmentions were found.

Newsletter