call bind apply

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);