[JS]this关键字以及call()、apply()、bind()比较

本文主要是介绍[JS]this关键字以及call()、apply()、bind()比较，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

面向对象语言中 this 表示当前对象的一个引用。
但在 JavaScript 中 this 不是固定不变的，它会随着执行环境的改变而改变。

1、在方法中，this 表示该方法所属的对象。
2、如果单独使用，this 表示全局对象。
3、在函数中，this 表示全局对象。
4、在函数中，在严格模式下，this 是未定义的(undefined)。
5、在事件中，this 表示接收事件的元素。
6、类似 call() 和 apply() 方法可以将 this 引用到任何对象。

先看一下正常情况下this的绑定对象情况
例一

var postcode = "400000";
function lookPostcode () {console.log(this.postcode); // this指向window
}
lookPostcode(); // 输出：400000

例二

var province = "重庆市";
var city = "重庆";
var area = "82402平方千米";var tempObj = new Object();
tempObj.city = "成都";
tempObj.province = this.province;           // this指向window
tempObj.tempFun = function () {console.log(this.city+" 面积:"+this.area); // this指向tempObj
}console.log(tempObj.province);  // 输出：重庆市
tempObj.tempFun();              // 输出：成都 面积:undefined

在JS中函数也是对象有方法，apply()和call()就是函数对象的方法。他们允许切换函数执行时this绑定的对象。
call()、apply()和bind() 重新定义this比较
bind返回的是一个函数需要加”()“去执行

var newObj = new Object();
newObj.city = "武汉";
newObj.area = "8569.15平方千米";tempObj.tempFun.call(newObj);   // 输出：武汉 面积:8569.15平方千米
tempObj.tempFun.apply(newObj);  // 输出：武汉 面积:8569.15平方千米
tempObj.tempFun.bind(newObj)(); // 输出：武汉 面积:8569.15平方千米

 call()、apply()和bind() 传参比较

1.

var province = "重庆市";
var city = "重庆";
var area = "82402平方千米";var tempObj = new Object();
tempObj.city = "成都";
tempObj.province = this.province;
tempObj.tempFun = function (code,direction) {console.log(this.city+" 面积:"+this.area+" 邮政编码:"+code+" 方位:"+direction);
}var newObj = new Object();
newObj.city = "武汉";
newObj.area = "8569.15平方千米";tempObj.tempFun.call(newObj,"430000","中南部");     // 输出：武汉 面积:8569.15平方千米 邮政编码:430000 方位:中南部
tempObj.tempFun.apply(newObj,["430000","中南部"]);  // 输出：武汉 面积:8569.15平方千米 邮政编码:430000 方位:中南部
tempObj.tempFun.bind(newObj,"430000","中南部")();   // 输出：武汉 面积:8569.15平方千米 邮政编码:430000 方位:中南部

2.

var tempArr = [2,53,63,34,24,75];
// 返回 x,y,z,...,n 中的最高值
console.log(Math.max.apply(null,tempArr)); // 输出：75
// 返回 x,y,z,...,n 中的最小值
console.log(Math.min.apply(null,tempArr)); // 输出：2console.log(Math.max.call(null,75,2)); // 输出：75
console.log(Math.min.call(null,75,2)); // 输出：2console.log(Math.max.bind(null,75,2)()); // 输出：75
console.log(Math.min.bind(null,75,2)()); // 输出：2

 

这篇关于[JS]this关键字以及call()、apply()、bind()比较的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---