Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Direct call vs bind vs call vs apply vs self (with many params)
(version: 0)
Comparing performance of:
direct call vs bind vs call vs apply vs method call
Created:
2 years ago
by:
Guest
Jump to the latest result
Script Preparation code:
function test(a, b, c, d, e, f) { console.log(this, a, b, c, d, e, f); } function test1(self, a, b, c, d, e, f) { console.log(self, a, b, c, d, e, f); } function test2(a, b, c, d, e, f) { console.log(this, a, b, c, d, e, f); } function test3(a, b, c, d, e, f) { console.log(this, a, b, c, d, e, f); } function test4(a, b, c, d, e, f) { console.log(this, a, b, c, d, e, f); } String.prototype.test5 = function(a, b, c, d, e, f) { console.log(this, a, b, c, d, e, f) }
Tests:
direct call
test1("a", "b", "c", "d", "e", "f");
bind
test2.bind("a", "b", "c", "d", "e", "f")();
call
test3.call("a", "b", "c", "d", "e", "f");
apply
test4.apply(this, ["a", "b", "c", "d", "e", "f"]);
method call
"_".test5("a", "b", "c", "d", "e", "f")
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (5)
Previous results
Fork
Test case name
Result
direct call
bind
call
apply
method call
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
one year ago
)
User agent:
Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/135.0.0.0 Safari/537.36
Browser/OS:
Chrome 135 on Windows
View result in a separate tab
Embed
Embed Benchmark Result
Test name
Executions per second
direct call
213110.4 Ops/sec
bind
212830.6 Ops/sec
call
218793.2 Ops/sec
apply
217898.3 Ops/sec
method call
227886.8 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
Let's break down the provided JSON data and explain what's being tested, compared, and their pros and cons. **Benchmark Definition** The benchmark is comparing different methods of calling functions in JavaScript: 1. **Direct Call**: Calling a function directly using its name (e.g., `test(a, b, c, d, e, f)`) 2. **Bind**: Binding a function to an object using the `bind()` method (e.g., `test.bind(this, 'a', 'b', 'c', 'd', 'e', 'f')`) 3. **Call**: Calling a bound function using the `call()` method (e.g., `test.call(this, 'a', 'b', 'c', 'd', 'e', 'f')`) 4. **Apply**: Calling a function with an array of arguments using the `apply()` method (e.g., `test.apply(this, ['a', 'b', 'c', 'd', 'e', 'f'])`) 5. **Method Call** (or **Function Invocation**): Invoking a function like a method on an object (e.g., `_`.test5('a', 'b', 'c', 'd', 'e', 'f')`) These methods differ in how they handle the `this` context and arguments passed to the function. **Pros and Cons** Here's a brief summary of the pros and cons for each method: 1. **Direct Call** * Pros: Simple, straightforward. * Cons: Can lead to issues with `this` context and argument passing. 2. **Bind** * Pros: Allows for explicit control over `this` context and argument passing. * Cons: Can be verbose and less readable than other methods. 3. **Call** * Pros: Convenient, as it applies the bound function's `this` context. * Cons: May not work correctly if the bound function is called in a different context. 4. **Apply** * Pros: Allows for explicit control over argument passing and can be used with arrays of arguments. * Cons: Can be less readable than other methods due to its functional nature. 5. **Method Call** (or **Function Invocation**) * Pros: Convenient, as it allows the function to be called like a method on an object. * Cons: May lead to issues with `this` context and argument passing. **Library** There is no explicit library mentioned in the benchmark definition. However, the `bind()` and `call()` methods are part of the ECMAScript Standard Library. **Special JS Features/Syntax** None of the methods in this benchmark rely on any special JavaScript features or syntax beyond standard ECMAScript functionality. **Alternatives** Other alternatives for calling functions in JavaScript include: 1. **Arrow Functions**: Can be used to create concise and readable function calls. 2. **New Operator**: Can be used to create new objects, including functions (e.g., `new Function('test', 'return 0;')()`). 3. **Function Expressions**: Can be used to create anonymous functions. Keep in mind that the choice of method depends on the specific use case and requirements.
Related benchmarks:
Direct call vs bind vs call vs apply vs self
Direct call vs bind vs call vs apply vs self but makes sense
bind vs inline func
es5 bind vs es6 arrow
Comments
Confirm delete:
Do you really want to delete benchmark?