call、apply和bind面试题

时间: 2023-04-30 22:04:17 浏览: 104

前端大厂最新面试题-bind_call_apply.docx

前端大厂最新面试题-bind_call_apply _bind、call、apply 是 JavaScript 中的三个函数方法，用于改变函数的执行上下文，即改变函数中的 this 指向。下面我们将详细讲解这三个方法的使用和区别。作用 _bind、call、apply 三者都是改变函数执行时的上下文，也就是改变函数中的 this 指向。例如，以下代码中，say 方法输出的结果不同，因为 this 指向不同： ```javascript var name = "lucy"; var obj = { name: "martin", say: function() { console.log(this.name); } }; obj.say(); // martin，this 指向 obj 对象 setTimeout(obj.say, 0); // lucy，this 指向 window 对象 ``` 在 setTimeout 中，say 方法作为回调函数执行时，在全局执行上下文中执行，因此 this 指向 window 对象。我们实际需要的是 this 指向 obj 对象，这时候就需要改变 this 指向。区别 apply、call、bind 三者的使用方法如下： apply * 接受两个参数，第一个参数是 this 的指向，第二个参数是函数接受的参数，以数组的形式传入 * 改变 this 指向后，原函数会立即执行 * 如果第一个参数为 null、undefined，则默认指向 window（在浏览器中） ```javascript function fn(...args) { console.log(this, args); } let obj = { myname: "张三" }; fn.apply(obj, [1, 2]); // this 会变成传入的 obj，传入的参数必须是一个数组 fn(1, 2); // this 指向 window ``` call * 第一个参数也是 this 的指向，后面传入的是一个参数列表 * 改变 this 指向后，原函数会立即执行 * 如果第一个参数为 null、undefined，则默认指向 window（在浏览器中） ```javascript function fn(...args) { console.log(this, args); } let obj = { myname: "张三" }; fn.call(obj, 1, 2); // this 会变成传入的 obj，传入的参数必须是一个数组 fn(1, 2); // this 指向 window ``` bind * 第一参数也是 this 的指向，后面传入的是一个参数列表 * 改变 this 指向后，不会立即执行，而是返回一个永久改变 this 指向的函数 ```javascript function fn(...args) { console.log(this, args); } let obj = { myname: "张三" }; const bindFn = fn.bind(obj); // this 也会变成传入的 obj bindFn(1, 2); // this 指向 obj fn(1, 2); // this 指向 window ``` 实现 bind 实现 bind 的步骤可以分解成为三部分： * 修改 this 指向 * 动态传递参数 * 兼容 new 关键字整体实现代码如下： ```javascript Function.prototype.myBind = function(context) { // 判断调用对象是否为函数 if (typeof this !== "function") { throw new TypeError("Bind must be called on a function"); } // 保存当前函数 let self = this; // 保存参数 let args = Array.prototype.slice.call(arguments, 1); // 返回绑定 this 的函数 return function() { // 保存当前的参数 let bindArgs = Array.prototype.slice.call(arguments); // 合并参数 let finalArgs = args.concat(bindArgs); // 调用原函数 return self.apply(context, finalArgs); }; } ``` _bind、call、apply 三者都可以改变函数的 this 对象指向，但它们的使用方法和返回结果不同。其中，apply 和 call 会立即执行，而 bind 返回一个永久改变 this 指向的函数。

call、apply和bind是JavaScript中用于改变函数执行上下文的方法。它们允许我们在调用函数时指定函数内部的this关键字所指向的对象，以及传递参数。call和apply的区别在于传递参数的方式不同，apply需要把参数放在数组中传递，而call则是一个一个地传递。bind方法与call、apply类似，但它不是立即调用函数，而是返回一个新的函数，这个新函数的this指向bind方法传递的对象。

阅读全文

call、apply和bind面试题

相关推荐

详解JS中的this、apply、call、bind(经典面试题)

js代码-call、apply、bind

this指向 箭头函数中的this call、apply和bind方法的用法以及区别

JS面试利器：20道原理题解析（call, apply, bind实现）

深入理解JavaScript进阶面试必备：call、apply与bind原理剖析

深入理解JavaScript中的call、apply与bind方法

前端高频面试题终结篇 vue面试题

JavaScrip面试题

javascript面试题、练习题

面试题.docx

面试题合集1

前端面试题1

理解JavaScript面试必备：apply、call、bind与闭包实践

理解JavaScript：this、apply、call与bind全面解析

理解JavaScript：bind、call与apply的区别与实现

前端面试题：手写bind函数及应用解析

call bind apply 运用场景

精细金属掩模板(FMM)行业研究报告 显示技术核心部件FMM材料产业分析与市场应用

【创新未发表】斑马算法ZOA-Kmean-Transformer-LSTM负荷预测Matlab源码 9515期.zip

最新推荐

Vue面试题及Vue知识点整理

精细金属掩模板(FMM)行业研究报告 显示技术核心部件FMM材料产业分析与市场应用

【创新未发表】斑马算法ZOA-Kmean-Transformer-LSTM负荷预测Matlab源码 9515期.zip

j link 修复问题套件

WordPress作为新闻管理面板的实现指南

管理建模和仿真的文件

函数与模块化编程宝典：J750编程高效之路

用C语言求有4个圆塔，圆心分别为（2，2)，(2，-2)，(-2，2)，(-2，-2)圆半径为1， 这4个塔的高度为10m 塔以外无建筑物接输入任意点的坐标 求该点的建筑高度（塔外的高度为零)的程序

NPC_Generator：使用Ruby打造的游戏角色生成器

"互动学习：行动中的多样性与论文攻读经历"

this指向箭头函数中的this call、apply和bind方法的用法以及区别

精细金属掩模板(FMM)行业研究报告显示技术核心部件FMM材料产业分析与市场应用

精细金属掩模板(FMM)行业研究报告显示技术核心部件FMM材料产业分析与市场应用

用C语言求有4个圆塔，圆心分别为（2，2)，(2，-2)，(-2，2)，(-2，-2)圆半径为1，这4个塔的高度为10m 塔以外无建筑物接输入任意点的坐标求该点的建筑高度（塔外的高度为零)的程序