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命令行参数处理模块commander使用实例
Sep 17 NodeJs
Nodejs中调用系统命令、Shell脚本和Python脚本的方法和实例
Jan 01 NodeJs
nodejs 的 session 简单使用
Jun 06 NodeJs
NodeJS使用formidable实现文件上传
Oct 27 NodeJs
Nodejs调用WebService的示例代码
Sep 29 NodeJs
NodeJs实现定时任务的示例代码
Dec 05 NodeJs
nodejs require js文件入口,在package.json中指定默认入口main方法
Oct 10 NodeJs
nodejs实现范围请求的实现代码
Oct 12 NodeJs
详解微信小程序-获取用户session_key,openid,unionid - 后端为nodejs
Apr 29 NodeJs
nodejs实现UDP组播示例方法
Nov 04 NodeJs
NodeJS多种创建WebSocket监听的方式(三种)
Jun 04 NodeJs
用Nodejs实现在终端中炒股的实现
Oct 18 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和AJAX创建RSS聚合器的代码
2007/03/13 PHP
php5中类的学习
2008/03/28 PHP
Yii框架引用插件和ckeditor中body与P标签去除的方法
2017/01/19 PHP
yii2实现 "上一篇,下一篇" 功能的代码实例
2017/02/04 PHP
php使用redis的有序集合zset实现延迟队列应用示例
2020/02/20 PHP
JQuery循环滚动图片代码
2011/12/08 Javascript
JavaScript通过prototype给对象定义属性用法实例
2015/03/23 Javascript
浅析node连接数据库(express+mysql)
2015/11/30 Javascript
Vuejs第一篇之入门教程详解(单向绑定、双向绑定、列表渲染、响应函数)
2016/09/09 Javascript
老生常谈angularjs中的$state.go
2017/04/24 Javascript
angularjs实现搜索的关键字在正文中高亮出来
2017/06/13 Javascript
详解vue 模拟后台数据(加载本地json文件)调试
2017/08/25 Javascript
Vuex 进阶之模块化组织详解
2018/01/12 Javascript
微信小程序实现MUI数字输入框效果
2018/01/31 Javascript
javascript实现获取一个日期段内每天不同的价格(计算入住总价格)
2018/02/05 Javascript
react 创建单例组件的方法
2018/04/26 Javascript
Node.js的进程管理的深入理解
2019/01/09 Javascript
微信小程序实现动态列表项的顺序加载动画
2019/07/25 Javascript
微信小程序中网络请求缓存的解决方法
2019/12/29 Javascript
收藏整理的一些Python常用方法和技巧
2015/05/18 Python
Python模拟脉冲星伪信号频率实例代码
2018/01/03 Python
Python实现扣除个人税后的工资计算器示例
2018/03/26 Python
Django 多语言教程的实现(i18n)
2018/07/07 Python
[原创]Python入门教程2. 字符串基本操作【运算、格式化输出、常用函数】
2018/10/29 Python
Python爬取365好书中小说代码实例
2020/02/28 Python
Python库安装速度过慢解决方案
2020/07/14 Python
Becextech新西兰:数码单反相机和手机在线商店
2018/04/27 全球购物
教师求职信范文分享
2013/12/27 职场文书
报告会主持词
2014/04/02 职场文书
企业法人代表证明书
2014/09/27 职场文书
2014年财务工作总结范文
2014/11/11 职场文书
2014年酒店工作总结与计划
2014/11/17 职场文书
2014年园林绿化工作总结
2014/12/11 职场文书
五好家庭事迹材料
2014/12/20 职场文书
乡镇团代会开幕词
2016/03/04 职场文书
基于Java的MathML转图片的方法(示例代码)
2021/06/23 Java/Android