npmpackage.info

Gathering detailed insights and metrics for class-autobind-decorator

Other packages similar to class-autobind-decorator

@vodyani/class-decorator

8.2.3

🏭 class-decorator is an easy-to-use toolbox that provides class validation, conversion, and property binding functions

class-autobind-decorator

A small framework-agnostic utility for auto-binding "class" methods to instances (with customization options) using either "legacy" decorator syntax or plain old ES5 (without needing ES2015+ polyfills).

3.0.1

JavaScript

1.24 kB

885,965 2.5

Installations

npm install class-autobind-decorator

Developer Guide

BETA

Typescript

Yes

Module System

CommonJS

Node Version

8.5.0

NPM Version

5.3.0 Score

77.7

Supply Chain

99.5

Quality

75.5

Maintenance

100

Vulnerability

100

License

Pull Requests

Open

0

Total

1

Closed

0

Merged

1

Issues

Open

0

Total

4

Closed

4

Releases

Unable to fetch releases

Contributors

Unable to fetch Contributors

View all 1 contributors

Languages

JavaScript

JavaScript (100%)

Love this project? Help keep it running — sponsor us today! 🚀

Developer

jmrog

Download Statistics

Total Downloads

885,965

Last Day

301

Last Week

1,784

Last Month

8,550

Last Year

98,587

GitHub Statistics

8 Stars

59 Commits

3 Watching

1 Branches

1 Contributors

Bundle Size

3.51 kB

Minified

1.24 kB

Minified + Gzipped

Bundlephobia

Maintainers

Package Meta Information

Latest Version

3.0.1

Package Id

class-autobind-decorator@3.0.1

Size

11.12 kB

NPM Version

5.3.0

Node Version

8.5.0

Publised On

08 Dec 2017

Total Downloads

Cumulative downloads

Total Downloads

885,965

Last day

-9.1%

301

Compared to previous day

Last week

-19.8%

1,784

Compared to previous week

Last month

1.1%

8,550

Compared to previous month

Last year

-32.8%

98,587

Compared to previous year

Daily Downloads

Weekly Downloads

Monthly Downloads

Yearly Downloads

Dev Dependencies

babel-cli babel-core babel-plugin-transform-decorators-legacy babel-plugin-transform-es2015-modules-umd babel-plugin-transform-object-rest-spread babel-polyfill babel-preset-es2015 chai mocha

Versions

class-autobind-decorator

A small, customizable, framework-agnostic, ES5-compatible class-level decorator for automatically binding "class" methods -- i.e., methods on a constructor's prototype object -- to instances, so that this refers to the relevant instance within those methods.

Features:

Usable with ES6+ React and Preact classes, but also elsewhere (exports a default autoBindMethods decorator, as well as an autoBindMethodsForReact convenience decorator that skips autobinding methods from the React Component Spec that do not require binding)
Built version is fully ES5-compatible, requiring no ES6+ polyfills
Supports class methods that have ES6 Symbols as keys
Accepts configuration options (see examples below), allowing the user to specify the methods that should or should not be bound (supporting both named methods and methods with Symbols as keys in this case, as well), and to specify whether or not to perform certain optimizations
Does not attempt to redefine methods marked as non-configurable (checks for configurability first!)
Keeps property descriptors (e.g., writability, enumerability, etc.) consistent between original properties and the corresponding autobound properties
Does not "magically" autobind properties set on classes/prototypes after the decorator has been applied
Conforms to the ES6+ "legacy" decorator pattern, and hence is usable as an ES6+ legacy decorator
Usable as both a "bare," unconfigured decorator (@autoBindMethods) or as a configured decorator (@autoBindMethods(options))
Documented and tested
Includes TypeScript declarations for use with TypeScript

Installation

1npm install --save class-autobind-decorator

Usage

Note that this is currently only usable as a "class"-level (or, in ES5 terms, a constructor-function-level) decorator. It can't currently be used on individual methods. However, the decorator accepts an options object that can define an array of methods not to bind (using the method names or Symbol keys; see the use of methodsToIgnore in the examples below, as well as the test cases in the tests).

ES6-style as a "legacy" class decorator, without options:

1import autoBindMethods from 'class-autobind-decorator';
2
3@autoBindMethods // You could also use `@autoBindMethods()` if you want.
4class Foo {
5    someMethod() {
6        return this instanceof Foo;
7    }
8}
9
10const smReference = new Foo().someMethod;
11console.log(smReference()); // => `true`

ES6-style as a "legacy" class decorator, with options:

1import autoBindMethods from 'class-autobind-decorator';
2// NOTE: For React classes, you can use this alternative:
3// import { autoBindMethodsForReact } from 'class-autobind-decorator';
4
5@autoBindMethods({ methodsToIgnore: ['unboundMethod', 'render'] })
6// or:
7// @autoBindMethodsForReact({ methodsToIgnore: ['unboundMethod'] })
8class MyComponent extends React.Component {
9    someComponentMethod() {
10        // Do something with `this` here. If the React `onClick`
11        // handler below is triggered, `this` will be bound to the
12        // component instance.
13    }
14    
15    unboundMethod() {
16        // `this` will not be auto-bound in this method, given the
17        // options passed in to the decorator.
18    }
19    
20    // This method will not be bound by `autoBindMethods` either (it
21    // doesn't need to be).
22    render() {
23        return (
24            <button onClick={this.someComponentMethod} />
25        );
26    }
27}

ES5-style, without options:

1var autoBindMethods = require('class-autobind-decorator').default;
2
3var Foo = (function () {
4    function Foo () {}
5    Foo.prototype.someMethod = function () {
6        return this instanceof Foo;
7    };
8    return Foo;
9}());
10
11autoBindMethods(Foo);
12var smReference = new Foo().someMethod;
13console.log(smReference()); // => `true`

ES5-style, with options:

1var autoBindMethods = require('class-autobind-decorator').default;
2var customAutoBinder = autoBindMethods({
3    methodsToIgnore: ['secondMethod']
4});
5
6var Foo = (function () {
7    function Foo () {}
8    Foo.prototype.firstMethod = function () {
9        return this instanceof Foo;
10    };
11    Foo.prototype.secondMethod = function () {
12        return this instanceof Foo;
13    };
14    return Foo;
15}());
16
17customAutoBinder(Foo);
18var fooInstance = new Foo();
19var fmReference = fooInstance.firstMethod;
20var smReference = fooInstance.secondMethod;
21console.log(fmReference()); // => `true`
22console.log(smReference()); // => `false`, due to passed in options

Configuration Options

methodsToIgnore: An array of method names that should not be bound if found on the prototype. See the above examples for usage.

dontOptimize: The default behavior of this decorator is to only bind methods to instances once, and, from that point onward, to store the bound method on the instance itself. You can override this behavior by setting dontOptimize to true. If you do that, the method will be re-bound to the instance on every access; a bound version of the method will not be stored on the instance itself (so, a use case for this might be if you need the instance not to be modified at all).

Building

Clone the repository, run npm install, then, in the main (top-level) repo directory:

1npm run build

Compiled code will be placed in the ./build directory. You can also download compiled code directly from this repository.

Running Tests

Clone the repository and go to the main (top-level) repo directory. Be sure to run npm install first, and then:

1npm run test

Tests are specified in the ./tests directory, and use mocha and chai. Running the tests also requires a few extra babel dependencies specified in package.json.

Wait... Why did you write yet another auto-bind decorator?

Well, I'm not currently aware of another project that has all of the features mentioned in the "Features" section, above (the ones I am aware of either hard-code React-specific stuff, or don't check whether properties are configurable before trying to redefine them, or inadvertently bind to non-instance objects when methods are accessed first via the prototype, or can't be used as both "bare" (unconfigured) decorators and configured decorators, or don't have TypeScript declarations, and things like that -- no hate, though!). I also just wanted an opportunity to work more directly with decorators, so I used it as a learning experience. :)

License

MIT

No vulnerabilities found.

10

Binary-Artifacts

Determines if the project has generated executable (binary) artifacts in the source repository.

9

Vulnerabilities

Determines if the project has open, known unfixed vulnerabilities.

0

Maintained

Determines if the project is "actively maintained".

0

Code-Review

Determines if the project requires human code review before pull requests (aka merge requests) are merged.

0

CII-Best-Practices

Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.

0

Security-Policy

Determines if the project has published a security policy.

0

Fuzzing

Determines if the project uses fuzzing.

0

License

Determines if the project has defined a license.

0

Branch-Protection

Determines if the default and release branches are protected with GitHub's branch protection settings.

0

SAST

Determines if the project uses static code analysis.

Score

2.5

/10

Last Scanned on 2025-01-27

The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.

Learn More