javascript中的this

Posted 2020-09-02

①javascript函数中的this表示调用该函数的上下文。如下例：

var mm = (function() {
	var a = function() {
		console.log(this);
		// arguments.callee();//相当于arguments对象调用a，指向arguments对象
	};
	var b = function() {
		var res = a();//相当于a.call(window),则指向window
	};
	return {
		a: a,
		b: b
	}
})()

mm.a();//mm对象调用a方法，则a中的指向mm对象。
mm.b();

②javascriprt字面量声明的对象中的this指向对象本身。

var mm = {
	a: function() {
		console.log(this);
	},
	b: function() {
		var res = this.a();//this指向mm对象本身
	}
}

mm.a();//mm对象调用a方法，则a中的指向mm对象。
mm.b();

③javascript构造函数中的this指向由该构造函数创建的实例对象。（注意，不是指向构造函数本身）

function httpObj() {//注意构造函数里面的this指向生成的实例对象而非构造函数本身，
		//如果在里面使用this.prototype = new XMLHttpRequest();则不对。
		//应该在构造函数上进行操作httpObj.prototype = new XMLHttpRequest();
		//事实上this实例对象是不存在prototype原型的，其构造函数才具有prototype原型
		//this实例拥有其构造函数内定义的私有成员，并且继承其构造函数的原型中的成员
		console.log(this.prototype)//undefined  不存在

		if(window.XMLHttpRequest) {
			return new XMLHttpRequest();
			//如果构造函数里面return 那么new 构造出的对象就不是this指向的实例对象
			// 而是return的值
		} else if (window.ActiveXObject) {
			var versionss = [
				‘MSXML2.XMLHttp.6.0‘, 
				‘MSXML2.XMLHttp.3.0‘, 
				‘MSXML2.XMLHttp‘
			];

			for(var i = 0; i < versionss.length; i++) {
				try {
					return new ActiveXObject();
				} catch(e) {

				}
			}

			throw new Error("您的浏览器不支持xhr对象");
		} else {
			throw new Error("您的浏览器不支持xhr对象");
		}
	}

④javascript中事件监听this指向触发事件的dom元素。

document.addEventListener("click", function(e) {
	console.log(this);//指向触发事件的dom元素
})