JS: Especificar llamada, aplicar, vincular de los tres hermanos de este

Hola a todos, lo soy 梅巴哥er. Este artículo hablará sobre los tres hermanos que se usaron para vincular esto: llamar, solicitar y vincular.


llamada

La sintaxis de la llamada

function.call(thisArg, arg1, arg2, ...)

explicación de sintaxis de llamada

Simplemente use thisArg, arg1, arg2, ... estos parámetros para llamar a la función antes de la llamada.
call() 提供新的 this 值给当前调用的函数/方法。

entre ellos:

  • thisArgNo es necesario. Si esta función está en modo no estricto y thisArg es nulo o indefinido, apunta al objeto global.
  • arg1, arg2,… ​​Estos son los parámetros reales pasados ​​a la función.
valor de retorno de la llamada

使用调用者提供的 this 值和参数调用该函数的返回值。若该方法没有返回值,则返回 undefined。


Ejemplo de código de llamada
// example1
function A(name, age) {
    
    
    this.name = name 
    this.age = age 
    this.sayHi = function() {
    
    
        console.log('Athis: ', this) // 查看A的this指向
    }
}
function B() {
    
    
    A.call(this, '迪丽热巴', 18)
    console.log(this) // 查看this指向情况
}
var dili = new B()
console.log(dili.name + '今年' + dili.age + '岁了')
var a = new A()
a.sayHi()
// 输出:B { name: '迪丽热巴', age: 18, sayHi: [Function] }
// 迪丽热巴今年18岁了
// Athis:  A { name: undefined, age: undefined, sayHi: [Function] }
// call指定了参数B的this,call给A提供了新的this值
// B通过this和另外两个参数,调用了函数A
// B此时继承了A的属性,所以call可以实现继承
// A.call(),A必须是function类型,不能是其他类型。

Veamos otro ejemplo

function a(age) {
    
    
    console.log('hi, ', this.name + age + '岁了')
    console.log(this)
}
obj = {
    
    
    name: '迪丽热巴'
}
a.call(obj, 18)
// 输出:hi,  迪丽热巴18岁了  { name: '迪丽热巴' }
// obj和参数18通过call调用了函数a
// call给a提供了新的this值obj

aplicar


aplicar sintaxis

func.apply(thisArg, [argsArray])

  • thisArgEs una opción obligatoria.
  • [argsArray]Es una matriz
  • El método apply () es similar al método call (). La diferencia es que el método call () acepta una lista de parámetros , mientras que el método apply () acepta una matriz de parámetros .

unir


El método bind () crea una nueva función. Cuando se llama a bind (), esta función nueva se especifica como el primer parámetro de bind (), y los parámetros restantes se utilizarán como parámetros de la nueva función para la llamada. .


enlazar valor de retorno

返回一个原函数的拷贝,并拥有指定的 this 值和初始参数。


Bind se usa a menudo en proyectos para vincular las funciones de este punto de evento.

Pero después de usar la función de flecha, no es necesario enlazar con bind.


Ejemplos de eventos vinculantes vinculantes

    // 为了在回调中使用 `this`,这个绑定是必不可少的
    this.handleClick = this.handleClick.bind(this);
  }

  handleClick() {
    
    
    this.setState(state => ({
    
    
      isToggleOn: !state.isToggleOn
    }));
  }

Este ejemplo se puede modificar así:

// 这样就不需要再单独绑定this了
handleClick = () => {
    
    
    this.setState(state => ({
    
    
      isToggleOn: !state.isToggleOn
    }));
  }

lo anterior.

Supongo que te gusta

Origin blog.csdn.net/tuzi007a/article/details/114495770
Recomendado
Clasificación