学校网站建设方案,友情链接qq群,包装设计公司排行,wordpress 本地 域名今天来聊聊bind 关于之前的call跟apply 查看此链接 我们要明确4点内容 1. bind之后返回一个函数 let obj {name : skr
}
function fn(){console.log(this)
}
let bindfn fn.bind(obj)
console.log(typeof bindfn) // function 2.bind改变this 并且可以传参 bind之后的函数仍… 今天来聊聊bind 关于之前的call跟apply 查看此链接 我们要明确4点内容 1. bind之后返回一个函数 let obj {name : skr
}
function fn(){console.log(this)
}
let bindfn fn.bind(obj)
console.log(typeof bindfn) // function 2.bind改变this 并且可以传参 bind之后的函数仍旧可以传参 let obj {name : skr
}
function fn(){console.log(arguments,this)
}
let bindfn fn.bind(obj,陈,孙,李)bindfn(张三李四) //[Arguments] { 0: 陈, 1: 孙, 2: 李, 3: 张三李四 }{ name: skr }3.bind之后的函数做为构造函数执行this是作为新的一个引用 let obj {name : skr
}
function fn(name){this.name name console.log(this) //{ name: 坤坤 }console.log(obj) //{ name: skr }
}
let bindfn fn.bind(obj)let obj2 new bindfn(坤坤) 4 作为构造函数时候 在原型上添加属性 实例能找到这个属性 let obj {name : skr
}
function fn(name){this.name name console.log(this) //{ name: 坤坤 }console.log(obj) //{ name: skr }
}
let bindfn fn.bind(obj)let obj2 new bindfn(坤坤) fn.prototype.arrt 小生
console.log(obj2.arrt) // 小生实现一个bind 遵循以上4点 bind之后返回一个函数Function.prototype.bind function(){return function(){// 代码省略}
} bind改变this 并且可以传参 bind之后的函数仍旧可以传参Function.prototype.bind function(context){let _this this let args Array.prototype.slice.call(arguments,1) // 保存外部函数的参数return function(){return _this.apply(context,args.concat(Array.from(arguments))) // 链接内部函数参数}
}
let obj {name :1
}
function a(){console.log(this,arguments)
}
a.bind(obj,1,2,3,4,5,6)(7,8,9)
/*
打印结果
{ name: 1 } [Arguments] {0: 1,1: 2,2: 3,3: 4,4: 5,5: 6,6: 7,7: 8,8: 9 } */ bind之后的函数做为构造函数执行this是作为新的一个引用Function.prototype.bind function(context){let _this this let args Array.prototype.slice.call(arguments,1) // 保存外部函数的参数let fn2 function(){return _this.apply(this instanceof fn2 ? this:context ,args.concat(Array.from(arguments))) // 看看是否是new 出来的 是new的话就不改变this } return fn2
}
let obj {name :1
}
function a(name){this.name name console.log(this)
}
let bindfn a.bind(obj)
let obj2 new bindfn(2) // {name:2}
console.log(obj) // {name:1}作为构造函数时候 在原型上添加属性 实例能找到这个属性Function.prototype.bind function(context){let _this this let args Array.prototype.slice.call(arguments,1) // 保存外部函数的参数function ConS(){}let fn2 function(){return _this.apply(this instanceof fn2 ? this:context ,args.concat(Array.from(arguments))) // 看看是否是new 出来的 是new的话就不改变this } console.log(this)ConS.prototype this.prototype // 通过第三方 new ConS().__proto__ this.prototype fn2.prototype new ConS() // new fn2().__proto__ new ConS() --- new fn2().__proto__.__proto__ this.prototype 从而拿到this实例上的原型属性和方法return fn2
}
let obj {name :1
}
function a(name){this.name name console.log(this)
}
let bindfn a.bind(obj)
let obj2 new bindfn(2) // {name:2}
console.log(obj2) // {name:1}大致上就是这样了
