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 相关文章推荐
golang、python、php、c++、c、java、Nodejs性能对比
Mar 12 NodeJs
NodeJS与Mysql的交互示例代码
Aug 18 NodeJs
nodejs开发微博实例
Mar 25 NodeJs
详解nodejs操作mongodb数据库封装DB类
Apr 10 NodeJs
nodejs个人博客开发第二步 入口文件
Apr 12 NodeJs
深入理解Nodejs Global 模块
Jun 03 NodeJs
nodejs Assert中equal(),strictEqual(),deepEqual(),strictDeepEqual()比较
Sep 18 NodeJs
使用nodejs分离html文件里的js和css详解
Apr 12 NodeJs
nodejs 递归拷贝、读取目录下所有文件和目录
Jul 18 NodeJs
typescript nodejs 依赖注入实现方法代码详解
Jul 21 NodeJs
通过实例了解Nodejs模块系统及require机制
Jul 16 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下载远程文件类(支持断点续传)
2008/11/14 PHP
php preg_filter执行一个正则表达式搜索和替换
2012/02/27 PHP
php使用curl抓取qq空间的访客信息示例
2014/02/28 PHP
PHP+Ajax异步带进度条上传文件实例
2016/11/01 PHP
PHP中上传文件打印错误错误类型分析
2019/04/14 PHP
thinkphp5框架实现的自定义扩展类操作示例
2019/05/16 PHP
麻雀虽小五脏俱全 Dojo自定义控件应用
2010/09/04 Javascript
js类型检查实现代码
2010/10/29 Javascript
YUI Compressor压缩JavaScript原理及微优化
2013/01/07 Javascript
单击浏览器右上角的X关闭窗口弹出提示的小例子
2013/06/12 Javascript
javascript间隔定时器(延时定时器)学习 间隔调用和延时调用
2014/01/13 Javascript
jquery动态添加删除(tr/td)
2015/02/09 Javascript
谈谈JavaScript自定义回调函数
2015/10/18 Javascript
详解vue+css3做交互特效的方法
2017/11/20 Javascript
node express使用HTML模板的方法示例
2019/08/22 Javascript
node.js 使用 net 模块模拟 websocket 握手进行数据传递操作示例
2020/02/11 Javascript
toString.call()通用的判断数据类型方法示例
2020/08/28 Javascript
[01:25]2014DOTA2国际邀请赛 zhou分析LGD比赛情况
2014/07/14 DOTA
python实现定时播放mp3
2015/03/29 Python
LRUCache的实现原理及利用python实现的方法
2017/11/21 Python
python文本数据处理学习笔记详解
2019/06/17 Python
选择Python写网络爬虫的优势和理由
2019/07/07 Python
python中时间转换datetime和pd.to_datetime详析
2019/08/11 Python
基于TensorBoard中graph模块图结构分析
2020/02/15 Python
Pycharm中安装Pygal并使用Pygal模拟掷骰子(推荐)
2020/04/08 Python
Born鞋子官网:Born Shoes
2017/04/06 全球购物
校三好学生主要事迹
2014/01/11 职场文书
药剂专业个人求职信范文
2014/04/29 职场文书
党员个人对照检查材料范文
2014/09/24 职场文书
先进个人自荐书
2015/03/06 职场文书
2015年化验室工作总结
2015/04/23 职场文书
绿里奇迹观后感
2015/06/15 职场文书
无违反计划生育证明格式
2015/06/24 职场文书
python实现的web监控系统
2021/04/27 Python
新手必备之MySQL msi版本下载安装图文详细教程
2021/05/21 MySQL
spring cloud 配置中心客户端启动遇到的问题
2021/09/25 Java/Android