#arrow functions

Since Functions are Objects, they can store properties just like any other object. This is useful for storing a bunch of function specific information. For example, a function can store its last call parameters. Which can be useful for replaying a function:

function sayMessage(title, name, suffix) { sayMessage.replay = () => sayMessage(...arguments); console.info(`Hello, ${title} ${name} ${suffix}!`); } sayMessage('King', 'Bob', 'The Magnificent'); // Hello, King Bob The Magnificent! sayMessage.replay(); // Hello, King Bob The Magnificent!

if you care to elaborate, what do you dislike about arrow functions?

1) If the problem is that the existing behavior for functions is occasionally confusing (which is true), I feel that adding a new syntax with different behavior is not exactly a perfect solution. Having two syntaxes* for functions with slightly different behavior is itself a confusing situation.

2)  While arrow functions fix some of the gotchas of old-style functions, that’s not the same thing as saying they don’t have gotchas. It’s just that we don’t know what the gotchas are**.

3) This is partly a matter of taste, but I find the new syntax significantly harder to parse visually. Not for compact functions defined inline as subroutines (they look fine, even better, in that case***), but that’s not the only way (or even the primary way, honestly) I see people use them. I say only “partly” a matter of taste, because, while my personal aversion is probably idiosyncratic, the “having two different syntaxes” thing is a problem here, too.

*Unlike other versions of new, improved syntax where the old way is only being kept around for compatibility purposes, like rest parameters replacing dumb tricks with the arguments object, you’ll still need to use the old-style function syntax for some things.

**In fairness, it’s reasonable to say that we expect the gotchas to be less common. But I expect there to be some.

***Even there, though, would it have killed them to use characters that weren’t already used in a bunch of short tokens? As of ES6, all of the following are valid JavaScript expressions meaning different things:

x = x * x;

x > x * x;

x == x * x; 

x >= x * x;

x => x * x;

x >> x * x;

There are no base library functions to do this in JavaScript. The simplist way is to provide the array to modify along with an object describing the key to value mappings. For example:

const cars = [ { id: 'miata', hp: 155, weight: 2400 }, { id: '4c', hp: 237, weight: 2465 }, { id: 'elice', hp: 217, weight: 2000 } ]; console.log(mapKeysArray(cars, { id: 'name', weight: 'pounds' })); // [ { hp: 155, name: 'miata', pounds: 2400 }, // { hp: 237, name: '4c', pounds: 2465 }, // { hp: 217, name: 'elice', pounds: 2000 } ]

To implement mapKeysArray, the key mapping just needs to be taken in reverse order with a object property loop for each array element (use the value for the new key and id for the key to extract from):

function mapKeysArray(arr, keySets) { return arr.map((element) => { for (const key in keySets) { element[keySets[key]] = element[key]; delete element[key]; } return element; }); }

Condensing Code with Arrow Functions

Arrow functions, introduced in ES6, are a game-changer in JavaScript. They provide a concise syntax for writing function expressions, especially for creating shorter and more readable callback functions.

New Post has been published on https://www.codesolutionstuff.com/top-10-es6-features/

Top 10 ES6 Features Every JavaScript Developer Must Know

New Post has been published on https://www.codesolutionstuff.com/javascripts-lambda-and-arrow-functions/

JavaScript's Lambda and Arrow Functions

There are three main advantages to arrow functions:

They are more concise

They allow for implicit returns

They get their "this" value from the context, this means it keeps the context from where it is defined

An implicit return means you don’t have to write the return keyword:

const animalNames = animals.map(animal => animal.name);

In this example we are using the implicit return in the function passed to array.prototype.map.

You could also do this:

const animalNames = animalNames.map(animal => { return animal.name });

If you are writing an inner function or declaring a variable inside your function you’ll want to take this approach. This is why the implicit return is also known as a one-liner syntax as generally you’ll use it on one line to make the code more concise.

Probably the most important thing to know about arrow functions is that they get their binding from the context. This means their

this

...value is going to point to whoever is the caller. Look at this example to help understand this:

https://jsbin.com/caxuceg/edit?html,js,console

Also, look at this more in-depth article on arrow functions: JavaScript: The beauty of arrow functions.

Examples

This one is using the Javascript ternary conditional operator.

See the Pen arrow functions by Matt Summers-Sparks (@msummers40) on CodePen.

This one involves chaining together multiple methods

Arrow Functions Explained | JavaScript Basics

We have already discussed about the latest standard of JavaScript which is ES6. Let and const was one of the most needed addition. If you have not already, you can read it here. Let us move on to another important concept in ES6 known as arrow functions.

Related: JavaScript Let and Const Explained

Functions in JavaScript

If you are familiar with programming, you must know what a function…