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


Posted in NodeJs onMarch 03, 2021

前言

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

var type = 1
function toWhere(){
	this.type = 2;
}
toWhere();
console.log(type)

你们肯定会这样想:

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

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

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

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

那么就这样结束了吗?

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

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

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

相关调试

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

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

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

1、打印浏览器中的this

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

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

2、打印nodeJs中的this

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极简入门教程(二):定时器
Oct 25 NodeJs
Nodejs学习笔记之Stream模块
Jan 13 NodeJs
Nodejs关于gzip/deflate压缩详解
Mar 04 NodeJs
Nodejs学习笔记之测试驱动
Apr 16 NodeJs
详解NodeJs支付宝移动支付签名及验签
Jan 06 NodeJs
NodeJs下的测试框架Mocha的简单介绍
Feb 22 NodeJs
nodejs入门教程三:调用内部和外部方法示例
Apr 24 NodeJs
NodeJS链接MySql数据库的操作方法
Jun 27 NodeJs
深入学习nodejs中的async模块的使用方法
Jul 12 NodeJs
NodeJS设计模式总结【单例模式,适配器模式,装饰模式,观察者模式】
Sep 06 NodeJs
Nodejs异步回调之异常处理实例分析
Jun 22 NodeJs
nodejs简单抓包工具使用详解
Aug 23 NodeJs
nodejs处理tcp连接的核心流程
Feb 26 #NodeJs
Nodejs 数组的队列以及forEach的应用详解
Feb 25 #NodeJs
一文秒懂nodejs中的异步编程
Jan 28 #NodeJs
在nodejs中创建child process的方法
Jan 26 #NodeJs
nodejs中使用worker_threads来创建新的线程的方法
Jan 22 #NodeJs
Nodejs 微信小程序消息推送的实现
Jan 20 #NodeJs
Nodejs实现微信分账的示例代码
Jan 19 #NodeJs
You might like
说说PHP的autoLoad自动加载机制
2012/09/27 PHP
解析在PHP中使用mysqli扩展库对mysql的操作
2013/07/03 PHP
创建一个复制UBB软件信息的链接或按钮的js代码
2008/01/06 Javascript
理解Javascript_01_理解内存分配原理分析
2010/10/11 Javascript
JavaScript mapreduce工作原理简析
2012/11/25 Javascript
基于JavaScript实现继承机制之构造函数+原型链混合方式的使用详解
2013/05/07 Javascript
javascript显示用户停留时间的简单实例
2013/08/05 Javascript
nodejs实现邮件发送服务实例分享
2017/03/29 NodeJs
js轮播图透明度切换(带上下页和底部圆点切换)
2017/04/27 Javascript
js学习心得_一个简单的动画库封装tween.js
2017/07/14 Javascript
gulp安装以及打包合并的方法教程
2017/11/19 Javascript
vue中当图片地址无效的时候,显示默认图片的方法
2018/09/18 Javascript
小程序点击图片实现自动播放视频
2020/05/29 Javascript
JS基于开关思想实现的数组去重功能【案例】
2019/02/18 Javascript
layui数据表格跨行自动合并的例子
2019/09/02 Javascript
vant-ui组件调用Dialog弹窗异步关闭操作
2020/11/04 Javascript
JavaScript中跨域问题的深入理解
2021/03/04 Javascript
Python ZipFile模块详解
2013/11/01 Python
Python找出文件中使用率最高的汉字实例详解
2015/06/03 Python
python实现mysql的单引号字符串过滤方法
2015/11/14 Python
Python中音频处理库pydub的使用教程
2017/06/07 Python
pycharm的console输入实现换行的方法
2019/01/16 Python
利用Python的turtle库绘制玫瑰教程
2019/11/23 Python
python使用正则来处理各种匹配问题
2019/12/22 Python
Tensorflow设置显存自适应,显存比例的操作
2020/02/03 Python
python实现发送带附件的邮件代码分享
2020/09/22 Python
python 调用Google翻译接口的方法
2020/12/09 Python
用python制作个音乐下载器
2021/01/30 Python
台湾演唱会订票网站:StubHub台湾
2019/06/11 全球购物
花坛标语大全
2014/06/30 职场文书
村长反四风问题个人对照检查材料
2014/09/21 职场文书
群众路线个人剖析材料及整改措施
2014/11/04 职场文书
2014年企业工会工作总结
2014/11/12 职场文书
2014年大学生村官工作总结
2014/11/19 职场文书
2015年度培训工作总结范文
2015/04/02 职场文书
Python opencv缺陷检测的实现及问题解决
2021/04/24 Python