gpt4 book ai didi

javascript - 为什么在浏览器中打开index.html 与使用节点服务器提供index.html 时 `this` 有所不同?

转载 作者:行者123 更新时间:2023-12-01 00:48:29 29 4
gpt4 key购买 nike

我有一个index.html 文件,引用了一个javascript 文件

<!DOCTYPE html>
<html lang="en">

<head>
<title>asd</title>
<meta charset="utf-8">
</head>

<body>
<div id="app"></div>
<script src="index.js"></script>
</body>

</html>

在我的index.js

function init() {
// always prints the window-object
console.log("init this:", this);
}
var testFunc = () => {
// this = {} when served
// this = window when opened directly in browser
console.log("testFunc this:", this);
}
// prints the window-object when opening index.html
// prints {} when using a server
console.log("this:", this);
init();
testFunc();

为什么直接在浏览器中打开index.html文件(url:file:///index.html)使this始终成为window对象,同时通过服务器(url:http://localhost:1234/)提供index.html文件,有时会给出{},有时会给出window

我期望 testFunc() 打印 {},并且我期望在其他地方获取 window。为什么不一样?

注意:我使用了 parcel为我的应用程序提供服务。

最佳答案

console.log("this:", this);

this,在全局执行上下文中,引用全局对象。

init();

由于 this 未在调用中设置,并且代码未处于严格模式,因此在 init 函数中它将引用全局对象(在严格模式下,它将具有值未定义)。

testFunc();

由于 testFunc 是一个箭头函数,因此它的 this 是从其封闭范围中采用的,该范围是全局的,因此又是全局对象。

在浏览器中,window object是全局对象的别名,具有附加属性(例如escapeunescape)并实现窗口接口(interface)。

在控制台中显示对象时,控制台如何选择表示对象取决于实现。

关于javascript - 为什么在浏览器中打开index.html 与使用节点服务器提供index.html 时 `this` 有所不同?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57182213/

29 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com