コンテキストを設定する際にバインドを使用する代わりに、どのような方法がありますか？

Question

私は今まで私のWebアプリケーションで次の構文を使用してきました。

myObj = { 
    msg: 'You have logged ', 
    init: function(){ 
     $('input').on('click', this.log.bind(this)), 
    }, 
    log: function(e){ 
     console.log(this.msg + $(e.target).val()); 
    } 
} 

私はinit関数を呼び出すことができます。

function.bind(obj); 

は、だから私のような物を持っている与えられました。 myObj.init（）;

しかし、問題は、.bind関数（）が推奨されなくなることです。それはjQueryのバインド関数かJavaScriptのバインド関数ですが、廃止予定です。

これが非推奨になるJavaScript関数になる場合は、その代替手段は何ですか？

Answer 1

しかし、問題は、私は.bind関数は（）は廃止されますことを読んでいます。それはjQueryのバインド関数かJavaScriptのバインド関数ですが、廃止予定です。

それはその代替何であるか、その後廃止されるとしているJavaScript関数になるだろうされている場合は、あなたがFunction.prototype.bind

を使用している、$.bindを使用していないので、問題はありませんか？

Function.prototype.bindは推奨されていません。あなたのコードは

// no `var`, `let` or `const` keyword 
myObj = { 
    msg: 'You have logged ', 
    init: function(){ 
    // event handlers usually pass an `event` object 
    $('input').on('click', this.log.bind(this)), 
    }, 
    log: function(){ // no `e` param here 
    console.log(this.msg + $(e.target).val()); 
    } 
} 

が

var myObj = { 
    msg: 'You have logged ', 
    init: function(){ 
    $('input').on('click', this.log.bind(this)), 
    }, 
    log: function(e){ 
    console.log(this.msg + $(e.target).val()); 
    } 
} 

---

し、完全に更新することでしたあなたのコードについて注意することはほとんど罰金、以下

---

いくつかの点以下の例外ですES6を使用してコードを表現する別の方法 - arrow functions xical thisので何Function.prototype.bindが

const myObj = { 
    msg: 'You have logged ', 
    init() { 
    $('input').on('click', event => this.log(event)); 
    } 
    log (event) { 
    console.log(this.msg, $(event.target).val()); 
    } 
}; 

Answer 2

現在、$.proxy()を使用できます。 note $.proxy()は、jQueryの将来のバージョンでは廃止予定です。

$('input').on('click', $.proxy(this.log, this))