JavaScript 核心觀念(20)-運算子、型別與文法-課後練習

發表於 2020-07-05 更新於 2021-06-06 分類於 JavaScript

Google AD

撰寫一篇文章其實真的很花時間，如果你願意「關閉 Adblock (廣告阻擋器)」來支持我的話，我會非常感謝你ヽ(・∀・)ﾉ

基本上每一個章節也都會有一個課後練習，想當然這一章節也是一樣。

前言

基本上每一個章節也都會有一個課後練習，想當然這一章節也是一樣。

第一題

我們都知道 JavaScript 是一個動態型別的語言，必須在執行後才能夠知道型別。
請問以下 a、b、c、d、e 的型別是?

var a = true;
var b = 'undefined';
var c = 1;
var d = null;
var e = NaN;

console.log(typeof(a));
console.log(typeof(b));
console.log(typeof(c));
console.log(typeof(d));
console.log(typeof(e));

請問這樣出現什麼訊息呢?

boolean / string / number / null / number
boolean / undefined / number / object / NaN
boolean / string / number / object / number
D: boolean / undefined / boolean / object / number

點我看解答(請認真思考後再看解答)

答案是「boolean / string / number / object / number」
補充: NaN 雖然在 JavaScript 代表無效的數字，但是還是歸類於數字唷~
另外 null 在課程上有講述到，這是很長久的 bug，所以才會顯示 object。

第二題

請問當使用了 new Number() 建立資料後後，此時使用 typeof() 會出現什麼型別?

1	var a = new Number('1', '2', '3');

array
object
number
string

點我看解答(請認真思考後再看解答)

答案是「object」
簡單來講凡是使用 new 所建構的型別，在 typeof 都會是 object 唷~

第三題

請問下方程式碼分別為 true 還是 false?

1
2
3

var a = '10';
console.log(10 == this.a);
console.log(10 === this.a);

true , false
false, true
true, true
false, false

點我看解答(請認真思考後再看解答)

答案是「true , false」
一般來講，實際開發最好還是使用嚴格模式來做比較(三個等於)否則很容易出現一些奇怪的 bug

第四題

請問以下答案是什麼?

var a = new Object();
var b = a;

console.log(a === b);

true
false
undefined
以上都不是

點我看解答(請認真思考後再看解答)

答案是「true」
這邊的觀念主要是物件會參考同一個記憶體，所以答案是 true，後面章節會有更詳細的介紹。

第五題

請問以下答案是什麼?

var a = new Object('1234');
var b = BigInt(1234);

console.log(a == b);

true
false
NaN
Undefined

點我看解答(請認真思考後再看解答)

答案是「true」
在做寬鬆比較的時候，a 是一個物件格式，但是會被轉換成與 BigInt 相同格式

第六題

請問以下程式碼會跑哪一個 console.log()?

var a = new Object();
if (a) {
  console.log('程式執行');
} else {
  console.log('程式跑 else');
}

程式執行
程式跑 else
都不是

點我看解答(請認真思考後再看解答)

答案是「程式執行」
就算透過建構式來建立的物件，一樣是會被判定 true，因為物件的記憶體已經存在了。

第七題

請問以下答案是什麼?

1	console.log(10 + 10 - 10 * 2);

點我看解答(請認真思考後再看解答)

答案是「0」
這一題算是送分了XD

第八題

請問以下 console.log() 會出現什麼答案?

var a = 10;
console.log(++a * a);
a = 10;
console.log(--a * a);

121, 81
110, 90
120, 80
144 ,64

點我看解答(請認真思考後再看解答)

答案是「121, 81」
這個問題主要是跟「++」放在前後有差，這邊讓我們看一下 MDN 如何說明

將運算元增加1。假如使用在運算元之前 (++x)，會運算元回傳增加1後的值;假如使用在運算元之後。 (x++)，會回傳運算元加1前的值。

因此當 var a = 10 的時候， a++ 實際上是回傳 10 但 * a 的時候這個 a 已經變成 11，因此其實已經變成這樣 10 * 11 = 110 唷~

第九題

前面課程我們了解 JavaScript 有所謂的 ASI 機制，那麼底下程式碼是否會出現錯誤呢?

1 2	var a = 10 (a + 10).toString();

出現錯誤
不會出現錯誤

點我看解答(請認真思考後再看解答)

答案是「出現錯誤」
實際執行得狀況會變成這樣子 var a = 10(a + 10).toString();
而這邊的觀念就是在考 ASI 自動補入分號的機制哩

第十題

ASI 的機制各有好壞，其中常見的經典例子就是 return，那麼底下程式碼是否為正確呢?

var a = 1
(function() {
 console.log(a);
})()

出現錯誤
不會出現錯誤

點我看解答(請認真思考後再看解答)

答案是「出現錯誤」
這題與上一題類似，課堂上也有講到類似的題型，實際運作時程式碼會變成這樣 var a = 1(function() { console.log(a); })()。

參考文獻

JavaScript 核心篇