JS中的bind,apply与call
2021/4/9 10:57:03
本文主要是介绍JS中的bind,apply与call,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
概要
call、apply、bind 都是用来修改函数中的this,
传参时,call是一个个传参,apply是数组形式传参,call和apply立即执行并且返回值是你调用的方法的返回值,若该方法没有返回值,则返回undefined。
bind是改变this后返回一个新的函数,他不会立即执行。
这三个方法不会改变原方法的this的指向。
Bind
复制原方法传入新的this指向后生成新方法,参数可传多个。
let a = { name: "小明", play: function(name) { console.info(this.name + "和" + name + "一块玩"); } }; let b = { name: "小红" }; a.play("小刚"); a.play.bind(b)("小刚");
显示
小明和小刚一块玩 小红和小刚一块玩
Call
调用原方法传入新的this指向,第一个参数为this的指向对象,后面可传多个参数。
let a = { name: "小明", play: function(name1, name2) { console.info(this.name + "和" + name1 + "、" + name2 + "一块玩"); } }; let b = { name: "小红" }; a.play("小刚", "小李"); a.play.call(b, "小刚", "小李");
显示
小明和小刚、小李一块玩 小红和小刚、小李一块玩
Apply
调用原方法传入新的this指向,第一个参数为this的指向对象,第二个参数只能为一个数组。
let a = { name: "小明", play: function(name1, name2) { console.info(this.name + "和" + name1 + "、" + name2 + "一块玩"); } }; let b = { name: "小红" }; a.play("小刚", "小李"); a.play.apply(b, ["小刚", "小李"]);
显示
小明和小刚、小李一块玩 小红和小刚、小李一块玩
结论:
call、apply、bind 是Function.prototype下的方法,作用是执行一下目标函数,执行时顺便把目标函数中的this改一下,然后把结果输出,执行后,不会影响原函数中的this!
这篇关于JS中的bind,apply与call的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-09-27使用js将ETH账户的资产打散其他账户web3
- 2024-09-27我轻松地将我的 React.js 应用程序翻译成了多种语言。下面是我是如何做到的... ??
- 2024-09-27?? 使用 useMemo 和 useCallback 加速 React:告别缓慢的重新渲染!??
- 2024-09-27Vue CLI多环境配置教程:新手入门指南
- 2024-09-27Vue CLI多环境配置教程:快速入门指南
- 2024-09-27Vue CLI教程:新手入门指南
- 2024-09-27Vue CLI教程:初学者快速入门指南
- 2024-09-27Vue3公共组件教程:入门与实践
- 2024-09-27Vue3公共组件教程:新手入门指南
- 2024-09-27Vue3教程:初学者快速入门指南