call bind apply 改变函数中的this
call
函数是一个对象
var fn = new Function();
function fn() {
}
证明fn是Function的实例(对象)
console.log(fn.__proto__ === Function.prototype);
console.dir(fn);
function fn(x, y) {
console.log(this);
console.log(x + y);
}
fn(5, 6); // this->window
1 调用函数，改变函数中的this
2 第一个参数 设置函数内部this的指向
其它参数，对应函数的参数
3 函数的返回值 call的返回值就是函数的返回值
4 测试
var obj = {
name: 'zs'
}
fn.call(obj, 5, 6);
apply 只有两个参数
1 调用函数，改变函数中的this
2 第一个参数 设置函数内部this的指向
第二个参数 是数组
3 函数的返回值 call的返回值就是函数的返回值
4 测试
var obj = {
name: 'ls'
}
fn.apply(obj, [1, 2]);
应用
var obj = {
0: 100,
1: 10,
2: 11,
3: 20,
length: 4
};
// obj['4'] = 30;
// obj.length ++;
// console.dir(obj);
Array.prototype.push.call(obj, 30);
Array.prototype.splice.call(obj, 0, 3);
console.dir(obj);
var obj = {
name: 'zs'
};
console.log(obj.toString());
var arr = [5, 9];
console.log(arr.toString());
console.log(Object.prototype.toString.call(arr));
应用
// fn.apply(,[])
// Math.max(3, 5, 6);
var arr = [5, 10, 1, 3, 6];
// Math.max不能求数组中的最大值
// console.log(Math.max(arr));
console.log(Math.max.apply(null, arr));
console.log(Math.max.apply(Math, arr));
// console.log(1, 2, 3);
// console.log(arr);
console.log.apply(console, arr);
bind
1 改变函数中的this，不会调用函数，而是把函数复制一份
2 第一个参数 设置函数内部this的指向
其它参数，对应函数的参数
3 函数的返回值 call的返回值就是函数的返回值
4 测试
var obj = {
name: 'ww'
}
var f = fn.bind(obj, 5, 5);
f();
bind的应用
var obj = {
name: 'zs',
fun: function() {
setInterval(function() {
console.log(this.name);
}.bind(this), 1000);
}
}
obj.fun();
＋
btn.onclick = function () {
// 事件处理函数中的this 是触发该事件的对象
// 通过bind 改变事件处理函数中this的指向
}.bind(obj);