Bind Function to Context - Practice Coding Problems

Bind Function to Context - Problem

JavaScript Medium

Enhance all functions to have a bindPolyfill method. When bindPolyfill is called with a passed object obj, that object becomes the this context for the function.

For example, if you had the code:

function f() {
  console.log('My context is ' + this.ctx);
}
f(); // Output: "My context is undefined"

However, if you bound the function:

function f() {
  console.log('My context is ' + this.ctx);
}
const boundFunc = f.bindPolyfill({ "ctx": "My Object" });
boundFunc(); // Output: "My context is My Object"

You may assume that a single non-null object will be passed to the bindPolyfill method. Please solve it without using the built-in Function.bind method.

Input & Output

Example 1 — Basic Binding

$ Input: function f() { console.log('My context is ' + this.ctx); } f.bindPolyfill({ "ctx": "My Object" })()

› Output: My context is My Object

💡 Note: The function f is bound to the object {ctx: 'My Object'}, so when called, this.ctx refers to 'My Object'

Example 2 — Multiple Properties

$ Input: function greet() { return this.name + ' says ' + this.message; } greet.bindPolyfill({ name: 'Alice', message: 'Hello' })()

› Output: Alice says Hello

💡 Note: Function accesses multiple properties from the bound context object

Example 3 — With Arguments

$ Input: function add(a, b) { return this.base + a + b; } add.bindPolyfill({ base: 10 })(3, 5)

› Output: 18

💡 Note: Bound function can still accept arguments: 10 + 3 + 5 = 18

Constraints

The bindPolyfill method should be added to Function.prototype
The method should accept a single object parameter
The returned function should maintain the original function's behavior
Arguments should be properly forwarded to the original function

Visualization

Tap to expand

Understanding the Visualization

Input

Original function with no context

Process

bindPolyfill method creates wrapper with fixed context

Output

Bound function that always uses specified context

Key Takeaway

🎯 Key Insight: Function binding is creating a wrapper that preserves context using call or apply

Asked in

G Google 25 f Meta 30 a Amazon 20 N Netflix 15

The key insight is to extend Function.prototype with a bindPolyfill method that returns a wrapper function. The wrapper uses call or apply to invoke the original function with the specified context object. Best approach uses call method for simplicity. Time: O(1), Space: O(1)

Common Approaches

Approach	Time	Space	Notes
✓ Function Prototype Extension with Call	O(1)	O(1)	Add bindPolyfill to Function.prototype using call method
Function Prototype Extension with Apply	O(1)	O(1)	Add bindPolyfill to Function.prototype using apply method

Function Prototype Extension with Call — Algorithm Steps

Add bindPolyfill method to Function.prototype
Return a new function that captures the context
Use call method to invoke original function with bound context

Visualization

Tap to expand

Step-by-Step Walkthrough

Original Function

Function exists without context

Bind Context

bindPolyfill captures the context object

Bound Function

New function calls original with fixed context

Code -

solution.c — C

#include <stdio.h>
#include <string.h>

char* solution() {
    static char result[] = "Function.prototype.bindPolyfill = function(obj) { const fn = this; return function(...args) { return fn.call(obj, ...args); }; };";
    return result;
}

int main() {
    char* result = solution();
    printf("%s\n", result);
    return 0;
}

Time & Space Complexity

Time Complexity

⏱️

O(1)

Function creation and method call are constant time operations

✓ Linear Growth

Space Complexity

O(1)

Only stores reference to context object and original function

✓ Linear Space

25.0K Views

Medium Frequency

~15 min Avg. Time

850 Likes

Ln 1, Col 1

Smart Actions

💡 Explanation

AI Ready

💡 Suggestion Tab to accept Esc to dismiss

// Output will appear here after running code

Code Editor Closed

Click the red button to reopen

Input & Output

Constraints

Visualization

Related Problems

Common Approaches

Function Prototype Extension with Call — Algorithm Steps

Visualization

Code -

Time & Space Complexity

Select Compiler