call、apply、bind の機能と違い

序文

  • call、apply、bind は this の強力なバインディングと呼ばれ、関数の実行時に this ポインタを変更するために使用され、現在のアプリケーションはすべてこの点に基づいています。

適用する()

  • apply() メソッドは 2 つのパラメータを受け取ります。1 つは関数が実行されるスコープで、もう 1 つはパラメータ配列です。このうち、2 番目のパラメーターは Array のインスタンスまたは引数オブジェクトにすることができます。
function sum(num1, num2) {
    
    
  return num1 + num2
}
function callSum1(num1, num2) {
    
    
  return sum.apply(this, arguments) // 传入 arguments 对象
}
function callSum2(num1, num2) {
    
    
  return sum.apply(this, [num1, num2]) // 传入数组
}
console.log(callSum1(10, 10)) //20
console.log(callSum2(10, 10)) //20

電話()

  • call() メソッドは apply() メソッドと同じ機能を持ちますが、唯一の違いはパラメータの受け取り方法です。call() メソッドを使用する場合、関数に渡されるパラメータを 1 つずつリストする必要があります。
function sum(num1, num2) {
    
    
  return num1 + num2
}
function callSum(num1, num2) {
    
    
  return sum.call(this, num1, num2)
}
console.log(callSum(10, 10)) //20
  • call() メソッドと apply() メソッドによって返される結果はまったく同じです。 apply() と call() のどちらを使用するかについては、関数にパラメータを渡すどちらの方法が最も便利かによって決まります。
  • パラメータの数:順序が決まっている場合はcallを使用、順序が不明な場合はapplyを使用します。
  • 可読性を考慮し、パラメータの数が少ない場合は call を使用し、パラメータの数が多い場合はパラメータを配列に統合して apply を使用します。

練る()

  • binding() メソッドは、この値が binding() 関数に渡される値にバインドされる関数のインスタンスを作成します。これは、bind() が新しい関数を返すことを意味します。
window.color = 'red'
var o = {
    
     color: 'blue' }
function sayColor() {
    
    
  alert(this.color)
}
var objectSayColor = sayColor.bind(o)
objectSayColor() //blue

呼び出し、適用、バインドの違い

  • 埋め込む:
    • call/apply は、関数の this コンテキストを変更した直後に関数を実行します。
    • バインドはコンテキストを変更した後に関数を返し、関数を実行しません。
function add(a, b) {
    
    
  return a + b
}

function sub(a, b) {
    
    
  return a - b
}

add.bind(sub, 5, 3) // 这时,并不会返回 8
add.bind(sub, 5, 3)() // 调用后,返回 8
  • 戻り値:
    • call、applyはfunの実行結果を返します
    • bind は fun のコピーを返し、fun の this ポインタを指定して、fun のパラメータを保存します。

呼び出し、適用、バインドの中心的な概念

  • 上記の簡単な例から、call、apply、bind が他のオブジェクトからメソッドを借用していることがわかります。オブジェクト A にはメソッドがあり、オブジェクト B も何らかの理由で同じメソッドを使用する必要があります。このとき、次のようにすることができます。 B 借用します。オブジェクト A のメソッドは目的を達成するだけでなく、メモリも節約します。

おすすめ

転載: blog.csdn.net/yuan0209/article/details/128038235