js-middleware Powerful Javascript Middleware Pattern implementation, apply middleweares to any object. A painless solution to make codes as scalable and maintainable as ReduxJS and ExpressJS. Links Project overview Documentation GitHub repo Overview Middleware functions are functions that have access to the target function and it’s arguments, and the target object and the next middleware function in the target function cycle. The next middleware function is commonly denoted by a variable named next. Middleware functions can perform the following tasks: Execute any code. Make changes to the function’s arguments. End the target function. Call the next middleware in the stack. If the current middleware function does not end the target function cycle, it must call next() to pass control to the next middleware function. Otherwise, the target function will be left hanging. Get started window.MiddlewareManager is available for browsers by include file in your HTML. [dist/middleware.min.js](https://github.com/unbug/js-middleware/tree/master/dist) <script src="middleware.min.js"></script> Or install the package npm install --save js-middleware and import it in your files import {MiddlewareManager} from 'js-middleware'; Usages Basic We define a Person class. // the target objectclass Person {  // the target function  walk(step) {    this.step = step;  }    speak(word) {    this.word = word;  } } Then we define a middleware function to print log. // middleware for walk function const logger = target => next => (...args) => {    console.log(`walk start, steps: ${args[0]}.`);    const result = next(...args);    console.log(`walk end.`);    return result;  } Now we apply the log function as a middleware to a Person instance. // apply middleware to target object const p = new Person(); const middlewareManager = new MiddlewareManager(p); middlewareManager.use('walk', walk); p.walk(3); Whenever a Person instance call it’s walk method, we’ll see logs from the looger middleware. Middleware object We can also apply a middleware object to a target object. Middleware object is an object that contains function’s name as same as the target object’s function name. Function’s name start or end with “_” will not be able to apply middleware. const PersonMiddleware {  walk: target => next => step => {    console.log(`walk start, steps: step.`);    const result = next(step);    console.log(`walk end.`);    return result;  },  speak: target => next => word => {    word = 'this is a middleware trying to say: ' + word;    return next(word);  }}

 // apply middleware to target object const p = new Person(); const middlewareManager = new MiddlewareManager(p); middlewareManager.use(PersonMiddleware); p.walk(3); p.speak('hi'); middlewareMethods Or we can use to define function names for middleweare target within a class. middlewareMethods class PersonMiddleware {  constructor() {    /**     * Define function names for middleweare target.     * @type {Array}     */    this.middlewareMethods = ['walk', 'speak'];  }  log(text) {    console.log('Middleware log: ' + text);  }  walk(target) {    return next => step => {      this.log(`walk start, steps: step.`);      const result = next(step);      this.log(`walk end.`);      return result;    }  }  speak(target) {    return next => word => {      this.log('this is a middleware tring to say: ' + word);      return next(word);    }  }}

 // apply middleware to target object const p = new Person(); const middlewareManager = new MiddlewareManager(p); middlewareManager.use(new PersonMiddleware()) p.walk(3); p.speak('hi'); is how hackers start their afternoons. We’re a part of the family. We are now and happy to opportunities. Hacker Noon @AMI accepting submissions discuss advertising & sponsorship To learn more, , , or simply, read our about page like/message us on Facebook tweet/DM @HackerNoon. If you enjoyed this story, we recommend reading our and . Until next time, don’t take the realities of the world for granted! latest tech stories trending tech stories

Facebook

Target

Too Long; Didn't Read

In your car, at home, or at work — Bosch technology shapes many areas of life.

js-middleware makes your JS codes as scalable as ReduxJS

Too Long; Didn't Read

Companies Mentioned

unbug

About Author

TOPICS

THIS ARTICLE WAS FEATURED IN...

js-middleware makes your JS codes as scalable as ReduxJS

Too Long; Didn't Read

Companies Mentioned

unbug

About Author

TOPICS

THIS ARTICLE WAS FEATURED IN...

RELATED STORIES