---
# System prepended metadata

title: 程式學習：JavaScript初學觀念
tags: [AC, JavaScript]

---

程式學習：JavaScript初學觀念
===
>上課筆記：JS：宣告變數/常數、for/while、if/else、JS的算術溢位、二分搜尋法
###### tags: `AC` `JavaScript`
之前上過網頁15天，對於HTML和CSS的基礎和功能有了解，這禮拜要熟悉的是關於DevTools和Box model的概念。趁這次機會再把觀念釐清。

學長提到的利用網路上的web template來做練習，是個滿好的學習方式，未來也會多多嘗試的。期待未來做layouting(切版)
#### 重要觀念：Js初級
##### let vs. const
AC的課程提到，在實務上的原則，除非預期會改動，否則就用`const`宣告；實務上亦如此。
##### 資料型別
JavaScript有自己的資料型別，特別是JS中著名的地雷就是會型別強制轉換(coercion)，用`typeof`檢查資料型別，`console.log`組合不同型別的方式如下：
###### something about console.log
用`console.log`印出的內容，不等於「程式的回傳值」。
[AC風格參考資料](https://standardjs.com/rules-zhtw.html)
`console.log`印出的樣態：
```javascript=
let myBirthday = '01/26'
let today = '07/17'
console.log(myBirthday)
console.log('myBirthday')
console.log('myBirthday:',myBirthday)//印出來中間有半形空白
console.log('myBirthday:'+myBirthday)//印出無空白
console.log(`今天是${today}，我的生日是${myBirthday}，今天不是我的生日。`)
```
Print：
![AC console.log](https://i.imgur.com/WWDyAoS.jpg)

##### 運算子
1、當x=1的時候，`++x`=直接x+1；而`x++`=先印出1,再+1，
```javascript=
let a = 2
let b = a++   // let b=a;  a = a+1;
let b = ++a   // a = a+1; let b = a
```
實務上，與其寫`let b = a++`，不如寫得讓人看得懂，`let b = a`下一行`a++`有相同的功能。
2、比較運算子永遠用`===`和`!==`

##### while/for迴圈
1、小心`while`無限迴圈，要記得加入迭代變化。
2、特殊情形善用`break`
```javascript=
let i = 0
while (i < 6) {
  console.log('i:', i)
  if (i === 3) {
    break
  }
  i = i + 1 //迭代變化
}
console.log('最後的 i 值:', i)

for (let i = 0; i < 6; i++) {
  console.log('i:', i)
  if (i === 3) {
    break
  }
}
```
##### 影響範圍：global vs. local
![AC globalvs.local](https://i.imgur.com/38eMwqx.png)
在global宣告的變數(const也是)，全域都可以使用；反之，在local宣告的變數就只有自己可以用
##### Others
1、不用太深入研究Pseudocode，實務上還是比較多使用Flowchart
2、演算法思維（CT）的四個步驟：(1)拆解問題→(2)規律辨識→(3)抽象化→(4)演算法
#### 重要觀念：二分搜尋演算法
這次卡關的問題是，要如何有效率的猜數字，運用數學邏輯，其實我知道怎麼算，但我不知道怎麼把它寫成演算法，用while迴圈選出正確的數字。經過搜尋及尋求高人指點後，知道我想做的叫做二分搜尋演算法。
```javascript=
let left = 1
let right = 100
let answer = Math.floor(Math.random() * 100) + 1
let count = 1

while(left<right){
let guess = Math.floor((right-left)/2) + left
if (guess === answer){
    break
}else if (guess < answer){
   left = guess+1
}else {
   right = guess-1
}
count++
}
```
要避免`算術溢位`？這是什麼意思呢？
 JS Number最多是64位元,一旦超過這個位元數，就會產生錯誤。
>假設，今天最多就是5位元；數字最大只能到31。
>```Javascipt
>let a = 31 //都在5位元的範圍
>let b = 31 //都在5位元的範圍
>let c = a + b //等於62，超過5位元，就是算術溢位
>```

**小知識**
JS、Python等高階語言會把位元數一次補給你，所以即使你只需要用到2位元，JS也會給你很多的空間。反之，JAVA可以用long、short省下多餘的空間；而C更是可以直接指定位元。如此，會讓code更有效率也節省運算能力。不過，因為C都已經固定好了，也會喪失彈性。

參考資料：[二分搜尋演算法 binary search algorithm](https://zh.wikipedia.org/zh-tw/%E4%BA%8C%E5%88%86%E6%90%9C%E5%B0%8B%E6%BC%94%E7%AE%97%E6%B3%95#javascript_%E7%89%88%E6%9C%AC)

 
