iT邦幫忙

2023 iThome 鐵人賽

DAY 5
0

其實看到第一眼,我反射應把他跟PHP的this綁定再一起,讓我邏輯混亂不輕

稍微做了一下整理,大致了解在node裏面this他可能是非常多樣的玩意

我寫了一些code來測試this,在不同的狀況下,this指的到底是什麼

console.log(this);
// 直接訪問會是一個空陣列 {}

this.num = 10; 
//嘗試給this 塞一點東西

console.log(this); 
//這時候再印 out:{ num: 10 }

console.log(this.num);
//當然也可直接訪問key值 輸出為 10

也就是說,在全局中this 他是一個空object
但他並不是真的是空的,什麼都沒有,
他其實是一個名為module.exports的對象。
那這邊我們看看AI怎麼解釋這個東西

這邊我目前就是把他理解,在什麼都沒有給值的狀況下,this這件事是一個名為module.exports的object,但因為沒有給值,所以他是一個空物件

但在找資料的過程中,又常常看到this指的是global,這邊再次與AI確認過後解釋是這樣的

也就是說this其實必須看你上下文的使用方式,來決定他指的是什麼,實在有點霧煞煞,所以在寫一段code來測試看看

//function內使用this指的是global
function Hello(){
    this.num = 10;
  }
  Hello();
  console.log(this);
  //可以看到function即使有給this塞東西, 在外面印出來還是空陣列,代表作用域不一樣 {}
  
  console.log(this.num);
  //在外部完整呼叫看看,確實沒有定義 undefined
  
  console.log(global.num);
  //但這個時候用global去呼叫 卻出現了 10 !
  
  console.log(global); 
  //印出來之後的確可以看到 num:10 在global裡面了

我找到這個例子,當function內使用this,他會在global底下,
但我其實覺得這個例子沒有很好,目前沒有太多使用經驗,在function裡面使用this,應該宣告用let之類就好,不過就當個例子給大家參考囉。

 function Hola(){
   this.num = 520;
 }
 let hola = new Hola();
 console.log(hola.num);
 // 輸出520 當你宣告建構函數之後,可以在外部取得內部this的值
 
 console.log(this);
 //輸出 {} 外部this本身還會是空的
 
 console.log(this.num);
 //輸出 undefined 當然也就沒有num的值
 
 console.log(global.num);
 //輸出 undefined 也當然跟global沒有關係了 

最後這個例子算是我研究最快的了,跟PHP非常接近,this指的就是自己本身的instance

其實研究了好一陣子,可以感受到this這件事如果沒有使用好,可能會有很多坑,在這邊也稍微留個紀錄,如果未來真的有工作需要node,還可以回來參考看看XD....


上一篇
第四天 安裝Express框架
下一篇
第六天 express路由簡單介紹
系列文
Node.js隨手札記 想到什麼就說什麼的30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言