Generic35's Blog

What is reactive extensions? It's the Javascript version of a library that has been commonly used for a few years in many other languages including C#. It's main construct is the Observable and the operators that can be applied to it. Why? Because Reactive Extensions is now common practice in Angular and React development, and in combination with a store, is now adding and altering the MVC that has been also very popular in web development in the last decade or so. In the next few posts, I will be writing about RxJS constructs, whit a focus on summarizing some common observable operators.

Generator functions definitions are prefixed with an asterisk and the function body contains one or more yield statement. Each time the generator is invoked, it will continue until the next yield statement, where it can return with or without a return value.

tag functions act as pre processors for a template literal. They receive a strings param, and each value is an paramter, which is usually gathered using the rest operator. They have been used for various implementation, including the JSX parser used by React to parse html.

New shorthands for properties having the same name as the variable assigned to them, concise properties. Shorthand for functions, concise functions, although the underlying function is anonymous therefore cannot be reference, for example in the case of recursion. Also computed property names allows the use of variables as property names, inside object literals, using square brackets. And template literals were added, the backtick operator used designate an interpolatable string where variables are surrounded by curly braces and preceded by a dollar sign.

Destructuring can be used to extract data with arrays or objects, in a declarative way, and is self documenting, allowing the next developer to read, to understand a lot about the intent of this line of code. It is particularly useful to extract data from an array, because the destructing pattern reveals the shape of the data, and the name of the variables used in the pattern show what is the important data we want to extract from this array, or multidimensional array. Note that it is possible to chain multiple destructring patterns, since each of them returns the original array. When destructuring objects, the destructuring pattern uses curly braces, with the source property name on the left, and target variable on the right. In the case the two are the same, in ES6, they don't need to be repeated. It is also possible to destructure nested objects, in this case a nested destructuring pattern would be provided.

These new operators, both represented by dot dot dot, has two purpose, to gather arguments, or spread them. One quick note about the gather operator, it is sometimes referred to as the 'rest' operator, not the verb resting, but rest as a noun. In the context of a function declaration, a ... before a variable with gather all the arguments in one variable. In the context of a function invocation, a ... operator would spread them out, as arguments passed in.

The purpose of const is to prevent reassignment of a variable. But it won't make it immutable, this can be done using Object.freeze.

The 'let' keyword was introduced in ES6 to help clarify intent. The 'var' keyword should keep a variable visible within it's block, only. But in fact, it was attached to the function it is declared in, via hoisting. Which means it could be accessed outside of it's block. The 'let' keyword was then introduced to make clear that a variable declared within a block, is only visible within this block. As opposed to 'var' who could be visible outside of that block.

MCSD: Microsoft Certified Solution Developer obtained March 2017