-
Hajipur, Bihar, 844101
Hajipur, Bihar, 844101
JS Basics
JS Variables & Operators
JS Data Types & Conversion
JS Numbers & Math
JS Strings
JS Dates
JS Arrays
JS Control Flow
JS Loops & Iteration
JS Functions
JS Functions
Function Definitions
Function Parameters
Function Invocation
Function Call
Function Apply
Function Bind
Function Closures
JS Arrow Function
JS Objects
JS Objects
JS Object Properties
JS Object Methods
JS Object Display
JS Object Constructors
Object Definitions
Object Get / Set
Object Prototypes
Object Protection
JS Classes & Modules
JS Async Programming
JS Advanced
JS Destructuring
JS Bitwise
JS RegExp
JS Precedence
JS Errors
JS Scope
JS Hoisting
JS Strict Mode
JS this Keyword
JS HTML DOM
DOM Intro
DOM Methods
DOM Document
DOM Elements
DOM HTML
DOM Forms
DOM CSS
DOM Animations
DOM Events
DOM Event Listener
DOM Navigation
DOM Nodes
DOM Collections
DOM Node Lists
JS BOM (Browser Object Model)
JS Window
JS Screen
JS Location
JS History
JS Navigator
JS Popup Alert
JS Timing
JS Cookies
Web Storage API
JS Web APIs
JS AJAX
AJAX Intro
AJAX XMLHttp
AJAX Request
AJAX Response
AJAX XML File
AJAX PHP
AJAX ASP
AJAX Database
AJAX Applications
AJAX Examples
JS JSON
JSON Intro
JSON Syntax
JSON vs XML
JSON Data Types
JSON Parse
JSON Stringify
JSON Objects
JSON Arrays
JSON Server
JSON PHP
JSON HTML
JSON JSONP
JS Canvas
JS Graphics & Charts
JS Basics
JS Variables & Operators
JS Data Types & Conversion
JS Numbers & Math
JS Strings
JS Dates
JS Arrays
JS Control Flow
JS Loops & Iteration
JS Functions
JS Functions
Function Definitions
Function Parameters
Function Invocation
Function Call
Function Apply
Function Bind
Function Closures
JS Arrow Function
JS Objects
JS Objects
JS Object Properties
JS Object Methods
JS Object Display
JS Object Constructors
Object Definitions
Object Get / Set
Object Prototypes
Object Protection
JS Classes & Modules
JS Async Programming
JS Advanced
JS Destructuring
JS Bitwise
JS RegExp
JS Precedence
JS Errors
JS Scope
JS Hoisting
JS Strict Mode
JS this Keyword
JS HTML DOM
DOM Intro
DOM Methods
DOM Document
DOM Elements
DOM HTML
DOM Forms
DOM CSS
DOM Animations
DOM Events
DOM Event Listener
DOM Navigation
DOM Nodes
DOM Collections
DOM Node Lists
JS BOM (Browser Object Model)
JS Window
JS Screen
JS Location
JS History
JS Navigator
JS Popup Alert
JS Timing
JS Cookies
Web Storage API
JS Web APIs
JS AJAX
AJAX Intro
AJAX XMLHttp
AJAX Request
AJAX Response
AJAX XML File
AJAX PHP
AJAX ASP
AJAX Database
AJAX Applications
AJAX Examples
JS JSON
JSON Intro
JSON Syntax
JSON vs XML
JSON Data Types
JSON Parse
JSON Stringify
JSON Objects
JSON Arrays
JSON Server
JSON PHP
JSON HTML
JSON JSONP
JS Canvas
JS Graphics & Charts
bind()
Method – Permanently Bind this
to a FunctionThe bind()
method creates a new function that, when called, has its this
value permanently set to the first argument passed to bind()
.
let boundFunc = func.bind(thisArg, arg1, arg2, ...);
thisArg
: The object to bind as this
.
arg1, arg2...
: Optional preset arguments (partial application).
Returns a new function with the bound context and optional arguments.
function greet() {
console.log("Hello " + this.name);
}
const person = { name: "Amit" };
const boundGreet = greet.bind(person);
boundGreet(); // Output: Hello Amit
function add(a, b) {
return a + b;
}
const addTen = add.bind(null, 10);
console.log(addTen(5)); // Output: 15
const obj = {
name: "Button",
handleClick: function () {
console.log(this.name + " clicked");
},
};
document.getElementById("btn").addEventListener("click", obj.handleClick.bind(obj));
Q1. Write a function sayHello()
that logs "Hello, [this.name]"
. Use bind()
to fix this
to an object { name: "Riya" }
and call it.
Q2. Create a function multiply(a, b)
and use bind()
to make a new function double
where a = 2
. Call double(5)
and print the result.
Q3. Create an object person
with name: "Ajay"
and a method showName()
. Detach the method and use bind()
to retain its this
context.
Q4. Write a function intro(greeting, name)
and use bind()
to preset "Hi"
as the greeting. Call it with a name.
Q5. Make a function logCoords(x, y)
and use bind()
to create a logX
function where x
is always 10. Then call logX(20)
.
Q6. Define a constructor User(name)
and a method say()
that logs the name. Use bind()
to pass the method around and preserve context.
Q7. Create a button in HTML. Bind a function to the button's click
event using bind()
to make sure this
refers to the object.
Q8. Create a function printMessage(msg1, msg2)
and use bind()
to prefill msg1 = "Welcome"
. Call it with "User"
as msg2
.
Q9. Use bind()
to create a reusable tax calculator where the tax rate is fixed at 18% and only the amount is passed during calls.
Q10. Write a function that logs this.id
. Use bind()
to assign a specific object with id: 99
and invoke the function.
Q1: What does the bind() method return?
Q2: Which method permanently binds this to a function?
Q3: Which of the following is a valid usage of bind()?
Q4: When using bind(), when is the function executed?
Q5: What will happen if you call a bound function without arguments when some were preset using bind()?
Q6: What is "partial application" in the context of bind()?
Q7: Which is true about bind() compared to call() and apply()?
Q8: Which use-case is best solved using bind()?