In this article we take a look at one of the refactoring techniques named as Inline Function originally known as Inline Method. We will see how to apply these techniques in Javascript code since the original methodology is language agnostic. This is second in the series of articles exploring various refactoring techniques by Martin Fowler.  Table of Contents Javascript Refactoring Series: Inline Function Motivation Mechanics Check that the function is not polymorphic Find all calls to the function Replace each call with the function body.

In this article we take a look at one of the refactoring techniques named as Extract Function originally known as Extract Method. We will see how to apply these techniques in Javascript code since the original methodology is language agnostic. This is first in the series of articles exploring various refactoring techniques by Martin Fowler. Table of Contents Extract Function (aka Extract Method) Motivation Example: No local variables Example: Using Local Variables Example: Reassigning a Local Variable Extract Function (aka Extract Method) You have a code fragment that can be grouped together.

The loop is the typical way of processing collections, but with the greater adoption of first-class functions in Javascript the collection pipeline is an appealing alternative. In this article we look at refactoring loops to collection pipelines with a small example. Table of Contents Refactoring a simple loop into a pipeline in Javascript Defining our Author data type Simple and plain For loop Using ES5 forEach Using a Collection Pipeline Refactor - Moving filter before map Refactor - Combine filters Reference Credits Refactoring a simple loop into a pipeline in Javascript The loop is the typical way of processing collections, but with the greater adoption of first-class functions in Javascript the collection pipeline is an appealing alternative.

Cohesion is the measure of strength of the association of elements within a module. Modules whose elements are strongly and genuinely related to each other are desired. A module should be highly cohesive. Table of Contents 1. Do you care about Cohesion in Javascript Functions? 1.1. Functional Cohesion 1.1.1. Sequential Cohesion 1.1.2. Communicational Cohesion 1.1.3. Temporal Cohesion 1.2. Sequential Cohesion 1.3. Communicational Cohesion 1.4. Temporal Cohesion 1.

In this article i will show you how to use the js2-refactor tool in Spacemacs which is a community built version of Emacs using Space key as the leader key. Table of Contents 1. Refactor your Javascript like a Pro with js2-refactor 1.1. Installation - Emacs 1.2. Installation - Spacemacs 1.3. Usage 1.4. Refactorings 1.4.1. js2r-expand-array 1.4.2. js2r-expand-object 1.4.3. js2r-expand-function 1.4.4. js2r-extract-function 1.4.5. js2r-extract-method 1.4.6. js2r-extract-var 1.4.7. js2r-contract-array 1.

In this tutorial, we will be building a Wikipedia search engine using RxJS Table of Contents 1. Build a Wikipedia search engine using RxJS 1.1. What is RxJs? 1.2. HTML markup for the search box 1.3. Capturing the keyup events in search box 1.4. Throttle the input events 1.5. Get only distinct values by eliminating other characters 1.6. Querying Wikipedia 1.7. Subscribe to the event stream 1.8. Links 1 Build a Wikipedia search engine using RxJS 1.

This tutorial is the second part of our previous tutorial where we built a simple registration form using Cycle.js. In this part, we will introduce some basic concepts for building Cycle.js like seeds, intents and state. Table of Contents 1. Cycle.js tutorial: Registration Form - Part 2 1.1. About Cycle.js 1.2. Create the application boilerplate 1.3. Defining the state update function 1.4. Defining seeds for the application state 1.

Create a simple registration form using Cycle.js and track the application state This tutorial is the first in a series where we will be building a simple registration form using Cycle.js and we will be tracking the application state on what the user input is. Table of Contents 1. Create a simple registration form using Cycle.js and track the application state 1.1. About Cycle.js 1.2. Create the application boilerplate 1.