Use of the JavaScript 'bind' method

2018-12-31 02:35发布

站内问答 / JavaScript
609 14 6

What is the use of bind() in JavaScript?

14条回答
高级女魔头
2楼-- · 2018-12-31 02:45

bind is a function which is available in java script prototype, as the name suggest bind is used to bind your function call to the context whichever you are dealing with for eg:

    var rateOfInterest='4%';
    var axisBank=
    {
    rateOfInterest:'10%',
    getRateOfInterest:function()
    {
    return this.rateOfInterest;
    }
    }
    axisBank.getRateOfInterest() //'10%' 


    let knowAxisBankInterest=axisBank.getRateOfInterest // when you want to assign the function call to a varaible we use this syntax
    knowAxisBankInterest(); // you will get output as '4%' here by default the function is called wrt global context

let knowExactAxisBankInterest=knowAxisBankInterest.bind(axisBank);     //so here we need bind function call  to its local context


    knowExactAxisBankInterest() // '10%'

查看更多
0人赞 添加讨论(0) 举报
唯独是你
3楼-- · 2018-12-31 02:48

Variables has local and global scopes, suppose if we have two variables with the same name, one is globally defined and another is defined inside a function closure and we want want to call that variable value which is inside the function closure, then we use this bind method. Please see the simple example below:

   var x = 9;    // this refers to global "window" object here in the browser
var person = {
  x: 81,
  getX: function() { return this.x; }
};
var y = person.getX; // It will return 9, because it will call global value of x(var x=9).

var x2 = y.bind(person); // It will return 81, because it will call local value of x, which is defined in the object called person(x=81).

document.getElementById("demo1").innerHTML = y(); 
document.getElementById("demo2").innerHTML = x2(); 
<!DOCTYPE html>
<html>
<body>
<p id="demo1">0</p>
<p id="demo2">0</p>
</body>
</html>

查看更多
0人赞 添加讨论(0) 举报
春风洒进眼中
4楼-- · 2018-12-31 02:48 
/**
 * Bind is a method inherited from Function.prototype same like call and apply
 * It basically helps to bind a function to an object's context during initialisation 
 * 
 * */

window.myname = "Jineesh";  
var foo = function(){ 
  return this.myname;
};

//IE < 8 has issues with this, supported in ecmascript 5
var obj = { 
    myname : "John", 
    fn:foo.bind(window)// binds to window object
}; 
console.log( obj.fn() ); // Returns Jineesh
查看更多
0人赞 添加讨论(0) 举报
骚的不知所云
5楼-- · 2018-12-31 02:50

As mentioned, Function.bind() lets you specify the context that the function will execute in (that is, it lets you pass in what object the this keyword will resolve to in the body of the function.

A couple of analogous toolkit API methods that perform a similar service:

jQuery.proxy()

Dojo.hitch()

查看更多
0人赞 添加讨论(0) 举报
残风、尘缘若梦
6楼-- · 2018-12-31 02:51

for Javascript beginners with OOP background like me, I found this is easiest explanation to understand,

https://www.youtube.com/watch?v=GhbhD1HR5vk

You can jump to 5:00 but I would recommend watch it from beginning.

查看更多
0人赞 添加讨论(0) 举报
荒废的爱情
7楼-- · 2018-12-31 02:52

The bind() method creates a new function instance whose this value is bound to the value that was passed into bind(). For example: 

   window.color = "red"; 
   var o = { color: "blue" }; 
   function sayColor(){ 
       alert(this.color); 
   } 
   var objectSayColor = sayColor.bind(o); 
   objectSayColor(); //blue

Here, a new function called objectSayColor() is created from sayColor() by calling bind() and passing in the object o. The objectSayColor() function has a this value equivalent to o, so calling the function, even as a global call, results in the string “blue” being displayed.

Reference : Nicholas C. Zakas - PROFESSIONAL JAVASCRIPT® FOR WEB DEVELOPERS

查看更多
0人赞 添加讨论(0) 举报
1 2 3 下一页
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(6)