JS中如何获取函数调用者？

  • Z时代
  • 2024-03-14
  • 分类：IT

// plugins.js
export default {
    install(Vue){
        Vue.prototype.$util = util
    }
}
// util.js
export default {
    test(args0,args1){
        // 如何将这里的this改为调用者，如this.$util.test()中的this
        // 一开始是作为参数传入的，后来改为在调用时使用apply指定this
        // 目前调用方式：this.$util.test.apply(this,[1,2])
    }
}

补充

一开始没说清楚，其实我想知道除了apply跟call之外还有没有别的方式可以将test内部的this指向调用者

// 如何这样调用test，test内部也能拿到该this的属性与函数？
this.$util.test()

补充二

目前考虑Vue的mixin，将该工具函数作为methods混入组件实例中

回答：

这样你就可以直接访问this.$util.test()

// plugins.js
export default {
    install(Vue){
        Vue.prototype.$util = {
            test: util.test.bind(Vue)
        }
    }
}

回答：

题主的需要指向的 this 应该是指 vue 实例对象吧？

如果是这样的话，直接改成箭头函数就行了

// util.js
export default {
  test: (args0, args1) => {
    // 在箭头函数中，this将自动绑定到 【定义时】 所在的作用域，
    // 因此它会指向调用者（即Vue实例）
    console.log(this); 
  }
}

当然，使用 apply 、bind 、call 也能实现

关于题主补充的问题：

显式绑定的话，就 apply 、bind 和 call，如果只是会影响作用域的还包括 函数声明、类声明、严格模式 等

// 如何这样调用test，test内部也能拿到该this的属性与函数？
// 也就是说调用时不想体现任何显式影响，那么就可以考虑一开始就绑定正确的 this，比如使用 【箭头函数】，具体方式看上文
this.$util.test()

以上是 JS中如何获取函数调用者？ 的全部内容， 来源链接： utcz.com/p/934621.html

回到顶部