iT邦幫忙

2021 iThome 鐵人賽

DAY 22
1
Modern Web

追求JS小姊姊30天系列 第 22

追求JS小姊姊系列 Day22 -- 工具人、姐妹不只身份的差別(中):從識別字開始講起吧

前情提要

奇怪的事情,姐妹們疑似也有超能力。

方函式:表面上雖然看起來就是所謂的姐妹、工具人關係,但事實上背後,我們還有一套專屬的識別方式。


識別身份背後的一切原理

JavaScript內的程式碼,都是由Unicode字元集(character set) 來撰寫,除此之外,讓我們來更近一步探索還有哪些規則。

識別字(identifier)

作為一個名稱,被用來為變數、特性、函式與類別命名。

命名規則:

  1. 可為一個單字x
  2. 一個底線符號_
  3. 一個錢幣符號$
  4. unicode字母、數字、形意符號(不建議)
  5. 中文字(不建議)
  6. 數學符號(π)

以下分別來測試:

//一個字母
let x = 2;

//一個錢幣符號
const $ = 3;

//一個底線符號
let _ = 5;

//中文
let 鐵人 = "Andy";

//形意符號 Ideographs
let ? = "竟然也能";

//數學符號 π
let π = "數學符號"

//上面都是所謂的識別字。

console.log(x,$,_,鐵人,?,π)

看吧,沒有一個有報出錯誤。

不建議的識別字
在上面部分識別字有標示不建議,是基於:

  1. 易移植性
  2. 易編輯性
  3. 相容性
    以unicode為例,部分電腦無法顯示、輸入,或正確的處理完整的unicode字元集,即便JavaScript定義了所謂的轉義序列來處理這類問題。

基於上述理由,一般識別字命名建議還是以ASII字母與數字為主。


保留字(reserved words)

這些字被JavaScript預留,不能被作為識別字的名稱,唯有在特定情形下可以破例,但背後原理複雜,有機會再講。

不相信的話,我們挑出預留字new 來作為識別字試試看:

let new  = 2;

嗯,報錯了。


所以為何需要宣告?

不知道你會不會跟我之前一樣(其實是現在),常看到宣告的好處不外乎就是:避免污染全域

我們可以把這句話拆為兩個部分來理解:

  1. 全域是什麼?
  2. 污染是指?

1. 全域是什麼?

所謂全域,全名為全域物件(global object) 是一個物件,當JS直譯器啟動時(或是重整頁面時),它就會內建一些初始的特性:

  1. 全域常數:undefined,NaN
  2. 全域函式:isNaN(),eval()等等
  3. 建構器函式:像是前面介紹過的Date(),String()

但這些內容不是保留字。

所以它們的值會被修改嗎? 來試試看

window.undefined //undefined
undefined = 5;
window.undefined // undefined

就算識別字名稱取名與它們相同,它們不會被修改。

2. 污染是指?

現在我們知道什麼是全域了,那污染指的是?

//最初staff變數作為
staff = 15;

function calculateNumbers(i){
    return staff + i;
}
calculateNumbers(1);

console.log(staff);//16?

function calculateNumbers(i){
    staff = [];
    staff.push(i);
    return i
}
console.log(staff);

這是因為當你的識別字,沒有進行宣告時
識別字x1的值會變成屬性,被存入global object內。

x1 = 2;
//window查找是否有這個屬性
window.x1

所以,不論你是在哪都能取到x1的值,且會互相影響。

-- to be continued --


那今天就到這邊摟!
每天的休息,是為了後面的追求,明天見。


reference:

犀牛大全
JavaScript Reserved Words
初學者跪著學JavaScript Day3:變數Variable、宣吿var


上一篇
追求JS小姊姊系列 Day21 -- 工具人、姐妹不只身份的差別(上): 基本型別包裹器(wrapper object)
下一篇
追求JS小姊姊系列 Day23 -- 頭等工具人也看安眠書店? 認識閉包讓你獨佔變數
系列文
追求JS小姊姊30天30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言