佳宸学习和分享笔记的地方

0%

实现call,apply,bind函数

实现call,apply,bind函数

  • 如果第一个参数为null ,则指向window
  • 改变了 this 指向,让新的对象可以执行该函数,并能接受参数

复习this指向

this永远指向最后一个调用这个方法的对象

回顾隐式绑定

1
2
3
4
5
6
7
8
const obj = {
name:'Jason',
getName(){
console.log(this); //obj
console.log(this.name); //Jason
}
};
obj.getName();

记住这个用法,他们用这个实现

实现call,apply

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
// (context) this指向的对象 (...args) 扩展运算 传入参数, (args)就是apply 
Function.prototype.myCall = function(context, ...args) {
if (typeof this !== 'function') {
throw new TypeError('Error')
}
// 改变this指向如果不传的话默认上下文为 window
context = context || window
args = args ? args : []
// 定义一个唯一值
const key = Symbol()
// 把这个函数的this 写到call 对象的一个属性里
context[key] = this
// 通过“对象.方法(参数)”,可以把this指向对象
const result = context[key](...args)
// 删除对象添加的方法
delete context[key]
return result
}

实现bind

bind返回一个绑定好的函数,不会立即执行

1
2
3
4
5
6
7
8
9
10
11
12
Function.prototype.myBind = function (context, ...args) {
const fn = this
args = args ? args : []
return function newFn(...newFnArgs) {
// 如果是new的就返回new
if (this instanceof newFn) {
return new fn(...args, ...newFnArgs)
}
// 返回一个apply方法
return fn.apply(context, [...args,...newFnArgs])
}
}