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实现的一个简单udp广播服务器、客户端
Sep 25 NodeJs
nodejs事件的监听与触发的理解分析
Feb 12 NodeJs
nodejs实现遍历文件夹并统计文件大小
May 28 NodeJs
Nodejs Express4.x开发框架随手笔记
Nov 23 NodeJs
nodejs6下使用koa2框架实例
May 18 NodeJs
nodejs使用express获取get和post传值及session验证的方法
Nov 09 NodeJs
nodejs判断文件、文件夹是否存在及删除的方法
Nov 10 NodeJs
Nodejs连接mysql并实现增、删、改、查操作的方法详解
Jan 04 NodeJs
nodejs acl的用户权限管理详解
Mar 14 NodeJs
nodejs中用npm初始化来创建package.json的实例讲解
Oct 10 NodeJs
CentOS7中源码编译安装NodeJS的完整步骤
Oct 13 NodeJs
详解nodejs 配置文件处理方案
Jan 02 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
咖啡常见的种类
2021/03/03 新手入门
php不允许用户提交空表单(php空值判断)
2013/11/12 PHP
PHP实现支持SSL连接的SMTP邮件发送类
2015/03/05 PHP
php生成rss类用法实例
2015/04/14 PHP
Laravel 5+ .env环境配置文件详解
2020/04/06 PHP
关于B/S判断浏览器断开的问题讨论
2008/10/29 Javascript
理解Javascript_05_原型继承原理
2010/10/13 Javascript
JavaScript中的类继承
2010/11/25 Javascript
将查询条件的input、select清空
2014/01/14 Javascript
jquery预览图片实现鼠标放上去显示实际大小
2014/01/16 Javascript
jQuery添加和删除指定标签的方法
2015/12/16 Javascript
Eclipse编辑jsp、js文件时卡死现象的解决办法汇总
2016/02/02 Javascript
详解Html a标签中href和onclick用法、区别、优先级别
2017/01/16 Javascript
Angular 2 ngForm中的ngModel、[ngModel]和[(ngModel)]的写法
2017/06/29 Javascript
Angular模板表单校验方法详解
2017/08/11 Javascript
javascript基于牛顿迭代法实现求浮点数的平方根【递归原理】
2017/09/28 Javascript
详解cordova打包成webapp的方法
2017/10/18 Javascript
JavaScript引用类型RegExp基本用法详解
2018/08/09 Javascript
vue 中基于html5 drag drap的拖放效果案例分析
2018/11/01 Javascript
js设计模式之代理模式及订阅发布模式实例详解
2019/08/15 Javascript
echarts实现折线图的拖拽效果
2019/12/19 Javascript
React学习之JSX与react事件实例分析
2020/01/06 Javascript
vue界面发送表情的实现代码
2020/09/11 Javascript
[01:28]2014DOTA2国际邀请赛中国区预选赛四大豪门直升机抵达会场
2014/05/24 DOTA
Python正则表达式知识汇总
2017/09/22 Python
将Python文件打包成.EXE可执行文件的方法
2019/08/11 Python
django迁移文件migrations的实现
2020/03/31 Python
幼儿园家长会邀请函
2014/01/15 职场文书
我的五年职业生涯规划
2014/01/23 职场文书
爱我中华教学反思
2014/04/28 职场文书
学习十八大的心得体会
2014/09/01 职场文书
2014大学生批评与自我批评思想汇报
2014/09/21 职场文书
幼儿园保育员随笔
2015/08/14 职场文书
nginx location优先级的深入讲解
2021/03/31 Servers
AJAX学习笔记
2021/05/18 Javascript
总结Java对象被序列化的两种方法
2021/06/30 Java/Android