?
Solved

Having trouble understanding javascript bind

Posted on 2013-12-10
6
Medium Priority
?
266 Views
Last Modified: 2013-12-11
I took a look at the following url and explanation but still don't get it


https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind

Can somebody explain it better to me
0
Comment
Question by:stargateatlantis
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 3
6 Comments
 
LVL 29

Expert Comment

by:Göran Andersson
ID: 39709366
When you call a function as a method of an object, the context of the method is the object, and you can access the object using the this keyword.

Example:

var obj = {
  info: 'asdf',
  fn: function(){
    alert(this.info);
  }
};

obj.fn(); // alerts "asdf"

Open in new window


The bind method allows you to create a function reference that will act as if you called it as a method in an object, without the function actually being part of the object.

Example:

var obj = {
  info: 'asdf'
};

function showInfo() {
  alert(this.info);
}

var f = showInfo.bind(obj);
f(); // alerts "asdf"

Open in new window

0
 

Author Comment

by:stargateatlantis
ID: 39710207
Can you bind a object that contains a function??
0
 
LVL 29

Expert Comment

by:Göran Andersson
ID: 39710430
Yes, you can use any object as context for the function.

You could even use something like "a string" or 42 as context, then the context would be a String object or a Number object, respectively.

If you would use null or undefined as context, the function would get the window object as context.
0
Get 15 Days FREE Full-Featured Trial

Benefit from a mission critical IT monitoring with Monitis Premium or get it FREE for your entry level monitoring needs.
-Over 200,000 users
-More than 300,000 websites monitored
-Used in 197 countries
-Recommended by 98% of users

 

Author Comment

by:stargateatlantis
ID: 39710434
is there a more complex example
0
 
LVL 29

Accepted Solution

by:
Göran Andersson earned 2000 total points
ID: 39711480
Here is an example with an object constructor and binding a function to an instance of the object:

function Employee(firstName, lastName) {
  this.firstName = firstName;
  this.lastName = lastName;
}

Employee.prototype = {

  showName: function(){
    alert(this.firstName + ' ' + this.lastName);
  }

};

// create an emplyee and show the name
var john = new Employee('John', 'Doe');
john.showName();

//bind a function expression to the employee
var showNameReverse = (function(){
  alert(this.lastName + ', ' + this.firstName);
}).bind(john);

// use it
showNameReverse();

Open in new window

0
 

Author Closing Comment

by:stargateatlantis
ID: 39712750
Thanks for the help that is what I was looking for
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article shows how to create and access 2-dimensional arrays in JavaScript.  It includes a tutorial in case you are just trying to "get your head wrapped around" the concept and we'll also look at some useful tips for more advanced programmers. …
This article will give core knowledge of JavaScript and will head in to your first JavaScript program. I am Durvesh Naik and I am here to deal with this series of JavaScript. I will teach you JavaScript in part wise , as its quite boring to read big…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

770 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question