互联网公司面试题之小米公司前端(apply,call,bind的区别)

jk 1年前 ⋅ 2399 阅读

源于:今日头条(查看原文)

笔者有几个正在走校招的朋友,通过近期跟他们的交流发现很多公司的面试前几轮的面试着重考察面试者对基础知识的掌握。有很多知识是必考的,也有一些偏门的,完全是看面试官的临场评估需求。像这次提到的小米前端校招,很多题是反复的考,例如:

js相关的:

  1. apply,call,bind的区别?

  2. 如何延长一个作用域链?

  3. typeof 返回值?

html5相关的:

  1. cookies,sessionStorage和localStorage的区别?

  2. H5新增API,事件?

做项目相关的:

  1. 如何跨域?

  2. vue.extend和vue.component的区别?

  3. 移动端适配

题不在多而在精,接下来我会分多篇文章深入分析一下这些题目。

1. apply,call,bind的区别?

在JavaScript中,call、apply和bind是Function对象自带的三个方法,

call() 方法在使用一个指定的this值和若干个指定的参数值的前提下调用某个函数或方法。

当调用一个函数时,可以赋值一个不同的 this 对象。this 引用当前对象,即 call 方法的第一个参数。

通过 call 方法,你可以在一个对象上借用另一个对象上的方法,比如Object.prototype.toString.call([]),就是一个Array对象借用了Object对象上的方法。

语法 fun.call(thisArg[, arg1[, arg2[, ...]]])

apply()语法与 call() 方法的语法几乎完全相同,唯一的区别在于,apply的第二个参数必须是一个包含多个参数的数组(或类数组对象)。

apply的这个特性很重要,在调用一个存在的函数时,你可以为其指定一个 this 对象。

this 指当前对象,也就是正在调用这个函数的对象。

使用 apply, 你可以只写一次这个方法然后在另一个对象中继承它,而不用在新对象中重复写该方法。

语法:fun.apply(thisArg[, argsArray])

bind() 函数会创建一个新函数(称为绑定函数)

bind是ES5新增的一个方法,传参和call或apply类似。

bind不会执行对应的函数,call或apply会自动执行对应的函数,只是返回对函数的引用。

语法 fun.bind(thisArg[, arg1[, arg2[, ...]]])

相同点:都是改变函数内部的this指向

区别1:

call和apply传参形式不同:

用call和apply方法,this指向他们的第一个参数,apply的第二个参数是一个参数数组,call的第二个及以后的参数都是数组里面的元素,需要全部列举。例如:

互联网公司面试题之小米公司前端(apply,call,bind的区别)

apply与call的区别

获取数组中的最大值和最小值,利用他们扩充作用域拥有Math的min和max方法;由于没有什么对象调用这个方法,所以第一个参数可以传null或者本身;

区别2:

bind不会立即调用:

bind与apply、call最大的区别就是bind不会立即调用,其他两个会立即调用;bind是返回对应函数,便于稍后调用,apply、call是立即调用;bind是新创建一个函数,然后把它的上下文绑定到bind()括号中的参数上,然后将它返回。例如:

互联网公司面试题之小米公司前端(apply,call,bind的区别)

bind与apply和call的区别

bind是只有点击button的时候,才会调用函数,而call和apply是立即调用,页面刷新就调用。

注意如果call和apply的第一个参数写的是null,那么this指向的是window对象

当然还会有很多变体,像用apply实现bind,用原生js封装bind和apply方法,下面附上代码:

互联网公司面试题之小米公司前端(apply,call,bind的区别)

apply实现bind

互联网公司面试题之小米公司前端(apply,call,bind的区别)

js实现call

互联网公司面试题之小米公司前端(apply,call,bind的区别)

js实现apply


全部评论: 0

    我有话说: