NodeJS和瀏覽器中this關(guān)鍵字的不同之處
前言
學(xué)習(xí)過JavaScript的人肯定清楚 處在不同環(huán)境下this的指向問題。那么看下面的代碼
var type = 1
function toWhere(){
this.type = 2;
}
toWhere();
console.log(type)
你們肯定會這樣想:
這里聲明了一個全局變量type,當(dāng)執(zhí)行type=1的時候,賦值為1。之后toWhere函數(shù)調(diào)用,看到函數(shù)中有this 就去判斷this的指向,這里很清楚,this指向了window,this.type=2執(zhí)行后,全局變量type就賦值為2了。
最后打印全局變量type 結(jié)果很明顯是2。

打開瀏覽器驗(yàn)證一下,沒問題 一個2明晃晃的在那里。
那么就這樣結(jié)束了嗎?
如果你學(xué)過node,現(xiàn)在用nodejs重新執(zhí)行一下以上代碼,你就發(fā)現(xiàn)了不一樣的地方。

你現(xiàn)在發(fā)現(xiàn) 那個1怎么這么不對勁呢,不是等于2嗎?
相關(guān)調(diào)試
從以上的例子可以看到,相同的js代碼在瀏覽器中運(yùn)行和在nodejs中運(yùn)行結(jié)果變得不一樣了。
這其實(shí)是因?yàn)閠his指向問題,但是這個指向和我們通常認(rèn)知中的指向是不一樣的。這個指向問題是由于node工作原理造成的
var type = 1
function toWhere() {
this.type = 2
console.log("函數(shù)中this指向",this)
}
toWhere()
console.log(type)
console.log("全局中this",this)
1、打印瀏覽器中的this

函數(shù)中this指向了window,而全局的this也是指向了window
2、打印nodeJs中的this

發(fā)現(xiàn)了吧。函數(shù)中的this指向了Object [global]。
當(dāng)我們給函數(shù)this賦值時,其實(shí)它掛靠在global對象上。所以它不會去改變?nèi)种衪his的值
Node原理解析
那么看看為什么會這樣
首先我們得去了解nodeJs的工作原理
瀏覽器直接在全局范圍執(zhí)行的腳本文件
而在Node中,Node將代碼隱藏在一個立即被調(diào)用的匿名函數(shù),你可以使用global來訪問全局范圍
在之前的解釋中,我們會發(fā)現(xiàn)在外部打印的一個this,它指向了一個空對象{},其實(shí)在node中運(yùn)行的任何文件其實(shí)都被包裹在一個{}中,所以腳本文件都在自己的閉包中執(zhí)行, 類似于下面這樣
{
(function(){
//腳本文件
})()
}
在之前的例子中,函數(shù)的外面this指向的是一個空對象{},而在函數(shù)內(nèi)部的this沒有指定的執(zhí)行上下文,所以它指向了global對象-(可以訪問該匿名函數(shù)執(zhí)行上下文的全局范圍)
總結(jié)
到此這篇關(guān)于NodeJS和瀏覽器中this關(guān)鍵字不同之處的文章就介紹到這了,更多相關(guān)NodeJS 瀏覽器中this關(guān)鍵字內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
node.js使用免費(fèi)的阿里云ip查詢獲取ip所在地【推薦】
這篇文章主要介紹了node.js使用免費(fèi)的阿里云ip查詢獲取ip所在地的相關(guān)知識,非常不錯,具有一定的參考借鑒價值 ,需要的朋友可以參考下2018-09-09
從零開始學(xué)習(xí)Node.js系列教程四:多頁面實(shí)現(xiàn)的數(shù)學(xué)運(yùn)算示例
這篇文章主要介紹了Node.js多頁面實(shí)現(xiàn)的數(shù)學(xué)運(yùn)算,涉及nodejs請求響應(yīng)、數(shù)值傳遞、運(yùn)算等相關(guān)操作技巧,需要的朋友可以參考下2017-04-04
詳解使用vscode+es6寫nodejs服務(wù)端調(diào)試配置
本篇文章主要介紹了使用vscode+es6寫nodejs服務(wù)端調(diào)試配置,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2017-09-09
Node.js實(shí)戰(zhàn)之Buffer和Stream模塊系統(tǒng)深入剖析詳解
這篇文章主要介紹了Node.js實(shí)戰(zhàn)之Buffer和Stream模塊系統(tǒng)深入剖析詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-08-08
詳解node-ccap模塊生成captcha驗(yàn)證碼
本篇文章主要介紹了node-ccap模塊生成captcha驗(yàn)證碼,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2017-07-07
node 安裝 windows-build-tools全過程
這篇文章主要介紹了node 安裝 windows-build-tools全過程,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2022-10-10
詳解nodejs中exports和module.exports的區(qū)別
本文主要介紹了exports 和 module.exports 的區(qū)別。具有很好的參考價值,下面跟著小編一起來看下吧2017-02-02
node.js平臺下利用cookie實(shí)現(xiàn)記住密碼登陸(Express+Ejs+Mysql)
這篇文章主要介紹了node.js平臺下利用cookie實(shí)現(xiàn)記住密碼登陸(Express+Ejs+Mysql),具有一定的參考價值,感興趣的小伙伴們可以參考一下。2017-04-04

