auto-bind
Advanced tools
Package description
The auto-bind npm package is used to automatically bind methods of a class to their instance. This is particularly useful in React components to avoid having to manually bind 'this' in the constructor for every method that needs it.
Automatic binding of class methods
This feature automatically binds all methods of a class instance to the instance itself, ensuring that 'this' within the methods refers to the class instance even when the method is extracted and called separately.
const autoBind = require('auto-bind');
class MyClass {
constructor() {
autoBind(this);
}
myMethod() {
// method body that uses 'this'
}
}
const instance = new MyClass();
const { myMethod } = instance;
myMethod(); // 'this' is correctly bound to the instancebind-methods is a package that binds an object's methods to itself. It is similar to auto-bind but does not automatically exclude constructor, React lifecycle methods, or methods already bound. It requires you to specify which methods to bind.
class-autobind is another package that offers automatic binding of class methods to the instance. It is similar to auto-bind but is implemented as a decorator, which can be used in projects that support JavaScript decorators.
react-autobind is designed specifically for React components to automatically bind methods to the component instance. It is similar to auto-bind but is tailored for React and can be more convenient for React developers.
Readme
Automatically bind methods to their class instance
It also correctly binds inherited properties.
npm install auto-bind
import autoBind from 'auto-bind';
class Unicorn {
constructor(name) {
this.name = name;
autoBind(this);
}
message() {
return `${this.name} is awesome!`;
}
}
const unicorn = new Unicorn('Rainbow');
// Grab the method off the class instance
const message = unicorn.message;
// Still bound to the class instance
message();
//=> 'Rainbow is awesome!'
// Without `autoBind(this)`, the above would have resulted in
message();
//=> Error: Cannot read property 'name' of undefined
Bind methods in self to their class instance.
Returns the self object.
Type: object
An object with methods to bind.
Type: object
Type: Array<string | RegExp>
Bind only the given methods.
Type: Array<string | RegExp>
Bind methods except for the given methods.
Same as autoBind but excludes the default React component methods.
import autoBindReact from 'auto-bind/react';
class Foo extends React.Component {
constructor(props) {
super(props);
autoBindReact(this);
}
// …
}
FAQs
Automatically bind methods to their class instance
The npm package auto-bind receives a total of 2,382,102 weekly downloads. As such, auto-bind popularity was classified as popular.
We found that auto-bind demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
A hospital in Mobile, Alabama, agreed to a settlement in a landmark ransomware death lawsuit, but is now reportedly reconsidering the agreement and refusing to pay.
Security News
A new report explores how advancements in LLMs are enhancing cyber threats, including polymorphic malware, personalized spearphishing, and the risk of hijacking customer service bots.
Security News
ESLint has approved an RFC that adds support for TypeScript configuration files, which is aimed at improving the developer experience and recognizing changes in the evolving JavaScript ecosystem.