首页前端开发JavaScriptNodeJS和浏览器中this关键字的不同之处

NodeJS和浏览器中this关键字的不同之处

时间2024-02-01 00:24:03发布访客分类JavaScript浏览406
导读:收集整理的这篇文章主要介绍了NodeJS和浏览器中this关键字的不同之处,觉得挺不错的,现在分享给大家,也给大家做个参考。 前言学习过JavaScript的人肯定清楚 处在不同环境下t...
收集整理的这篇文章主要介绍了NodeJS和浏览器中this关键字的不同之处,觉得挺不错的,现在分享给大家,也给大家做个参考。

前言

学习过JavaScript的人肯定清楚 处在不同环境下this的指向问题。那么看下面的代码

VAR tyPE = 1function toWhere(){
    	this.type = 2;
}
    toWhere();
    console.LOG(type)

你们肯定会这样想:

这里声明了一个全局变量type,当执行type=1的时候,赋值为1。之后toWhere函数调用,看到函数中有this 就去判断this的指向,这里很清楚,this指向了window,this.type=2执行后,全局变量type就赋值为2了。

最后打印全局变量type 结果很明显是2。

打开浏览器验证一下,没问题 一个2明晃晃的在那里。

那么就这样结束了吗?

如果你学过node,现在用nodejs重新执行一下以上代码,你就发现了不一样的地方。

你现在发现 那个1怎么这么不对劲呢,不是等于2吗?

相关调试

从以上的例子可以看到,相同的js代码在浏览器中运行和在nodejs中运行结果变得不一样了。

这其实是因为this指向问题,但是这个指向和我们通常认知中的指向是不一样的。这个指向问题是由于node工作原理造成的

var type = 1function toWhere() {
 this.type = 2 console.log("函数中this指向",this)}
toWhere()console.log(type)console.log("全局中this",this)

1、打印浏览器中的this

函数中this指向了window,而全局的this也是指向了window

2、打印nodeJs中的this

发现了吧。函数中的this指向了Object [global]。

当我们给函数this赋值时,其实它挂靠在global对象上。所以它不会去改变全局中this的值

Node原理解析

那么看看为什么会这样

首先我们得去了解nodeJs的工作原理

浏览器直接在全局范围执行的脚本文件

而在Node中,Node将代码隐藏在一个立即被调用的匿名函数,你可以使用global来访问全局范围

在之前的解释中,我们会发现在外部打印的一个this,它指向了一个空对象{ } ,其实在node中运行的任何文件其实都被包裹在一个{ } 中,所以脚本文件都在自己的闭包中执行, 类似于下面这样

{
	(function(){
		//脚本文件	}
)()}

在之前的例子中,函数的外面this指向的是一个空对象{ } ,而在函数内部的this没有指定的执行上下文,所以它指向了global对象-(可以访问该匿名函数执行上下文的全局范围)

总结

到此这篇关于NodeJS和浏览器中this关键字不同之处的文章就介绍到这了,更多相关NodeJS 浏览器中this关键字内容请搜索以前的文章或继续浏览下面的相关文章希望大家以后多多支持!

您可能感兴趣的文章:
  • 如何利用nodejs实现命令行游戏
  • Nodejs实现多人同时在线移动鼠标的小游戏分享
  • 使用Node.js实现一个多人游戏服务器引擎
  • Node.js 制作实时多人游戏框架
  • node.js适合游戏后台开发吗?
  • Nodejs实现定时爬虫的完整实例
  • nodejs处理tcp连接的核心流程
  • 如何写Node.JS版本小游戏

声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!

nodejsthis关键字

若转载请注明出处: NodeJS和浏览器中this关键字的不同之处
本文地址: https://pptw.com/jishu/594676.html
Vue多选列表组件深入详解 Webpack3+React16代码分割的实现

游客 回复需填写必要信息