本文详细解析JavaScript严格模式下this的六种指向情况。涵盖全局作用域、全局函数、对象方法、构造函数、普通事件处理及内联事件处理中的this行为。通过代码示例说明严格模式下全局this为undefined，对象方法指向调用者，构造函数指向实例，事件处理指向触发元素等核心规则，帮助开发者避免常见陷阱。
JavaScript严格模式下this指向的六种场景详解
前言
在学习和使用JavaScript的过程中，许多开发者对this关键字的指向感到困惑。本文旨在梳理并总结在启用严格模式（strict mode）时，this在不同代码场景下的具体指向规则。
全局作用域中的this
一、全局作用域中的this
当代码处于严格模式且运行在全局作用域时，this关键字不再指向全局对象（如浏览器环境中的window），而是保持为undefined。
"use strict";
console.log("严格模式");
console.log("在全局作用域中的this");
console.log("this.document === document",this.document === document);
console.log("this === window",this === window);
this.a = 9804;
console.log('this.a === window.a===',window.a);
全局函数中的this
二、全局作用域中函数中的this
在严格模式下，如果在全局作用域内定义并调用普通函数，该函数内部的this值为undefined。这包括直接调用的函数以及嵌套函数中直接调用的内部函数。
"use strict";
console.log("严格模式");
console.log('在全局作用域中函数中的this');
function f1(){
console.log(this);
}
function f2(){
function f3(){
console.log(this);
}
f3();
}
f1();
f2();
对象方法中的this
三、 对象的函数（方法）中的this
在严格模式下，当通过对象调用其方法时，方法内部的this指向调用该方法的对象实例本身。
"use strict";
console.log("严格模式");
console.log("在对象的函数中的this");
var o = new Object();
o.a = 'o.a';
o.f5 = function(){
return this.a;
}
console.log(o.f5());
构造函数中的this
四、构造函数的this
在严格模式下，构造函数内部的this指向由new关键字创建的新对象实例，而非全局对象。
"use strict";
console.log("严格模式");
console.log("构造函数中的this");
function constru(){
this.a = 'constru.a';
this.f2 = function(){
console.log(this.b);
return this.a;
}
}
var o2 = new constru();
o2.b = 'o2.b';
console.log(o2.f2());
事件处理函数中的this
五、事件处理函数中的this
在严格模式下，通过JavaScript代码绑定（如onclick属性赋值）的事件处理函数中，this指向触发该事件的目标DOM元素。
"use strict";
function blue_it(e){
if(this === e.target){
this.style.backgroundColor = "#00f";
}
}
var elements = document.getElementsByTagName('*');
for(var i=0 ; i<elements.length ; i++){
elements[i].onclick = blue_it;
}
//这段代码的作用是使被单击的元素背景色变为蓝色内联事件处理中的this
六、内联事件处理函数中的this
在严格模式下，HTML内联事件处理程序（如onclick="..."）中的行为存在差异：若函数内部显式声明'use strict'，this为undefined；若直接在HTML属性中启用严格模式，this仍指向触发事件的元素。
<button onclick="alert((function(){'use strict'; return this})());">
内联事件处理1
</button>
<!-- 警告窗口中的字符为undefined -->
<button onclick="'use strict'; alert(this.tagName.toLowerCase());">
内联事件处理2
</button>
<!-- 警告窗口中的字符为button -->后语
参考资料
MDN https://developer.mozilla.org...
延伸资料
JavaScript 严格模式详解 https://www.jb51.net/article/74890.htm
菜鸟学堂 > JavaScript 严格模式 http://edu.jb51.net/js/js-strict.html
总结
以上就是本文关于JavaScript严格模式下this指向的全部内容。希望这些总结能对您的学习或工作有所帮助。如有任何疑问，欢迎留言交流。感谢支持。