前端开发必须掌握的技术(前端工程师必学this关键字)
前端开发必须掌握的技术(前端工程师必学this关键字)1. 4 原型链上的this对象方法的this ,由obj调用,this就指向obj对象。1.2. 函数this一般函数的this ,由window调用,this就指向window对象。1.3 对象方法的this
今天我们来认识一下this的个关键字,我们在JS编程中是不是使用的很多,比如我们在用构造函数创建全局对象的时候,是不是用过,我们称为什么“代表当前对象”其实这种说话是过于牵强,严格说是错误的,这里大家一定要明白这点,面试的时候不要说代表的当前对象,那样一下就暴露了你不到位,如果对this的理解都是错的,那么如何相信你能写出多么健壮的js。
this关键字
1.1. 全局this
全局this一般指向全局对象,浏览器中的全局对象就是 window。例如:
1.2. 函数this
一般函数的this ,由window调用,this就指向window对象。
1.3 对象方法的this
对象方法的this ,由obj调用,this就指向obj对象。
1. 4 原型链上的this
在原型模式中,this常用的有两种情况:
在类中this.xxx=xxx;this->当前类的实例
某一个方法中的this->看执行的时候"."前面是谁this就是谁
1)需要先确定this的指向(this是谁)
2)把this替换成对应的代码
3)按照原型链查找的机制,一步步的查找结果
function Fn(){
this.x =100;
this.y =200;
this.getY =function(){
console.log(this.y);
};
}
Fn.prototype = {
constructor:Fn
y:300
getX:function(){
console.log(this.x);
}
getY:function(){
console.log(this.y);
}
};
var f = new Fn;
f.getX(); // 100 -> this.x 替换成f.x
f.__proto__.getX();//-> this是f._proto_ -> f _proto_.x->undefined
Fn.prototype.getX();//->undefined
f.getY();// 200;
f.__proto__.getY();//300
1.5 构造器上的this
使用new关键字构造时,默认都指向当前新创建的对象。
总结:
- this指向的永远只可能是对象.
- this指向谁永远不取决于this写在哪,而是取决于函数在哪调用.
- this指向的对象,称之为函数的上下文context,也叫函数的调用者.
前端大神如有个人见解欢迎补充 谢谢