Yakim shu Hi, 這是我擴充腦內海馬體的地方。
分類文章 全文列表

[第五週] 參加「 程式導師實驗計畫第三期 」的滿月心得

前言

咻咻咻過去，參加課程已經滿一個月了啊！

這整個月就是拼了老命、把僅存的一咪咪意志力都拿來參加課程，這篇文是第五週作業，也是個很棒的機會做總檢討。

對課程內容有興趣的可以先看看：

總之這是一篇很長的血汗心得文，我看了都怕.jpg

未來行動

待研究問題

未完成作業

可優化作業

每週學習內容

第一週

暖身週注重在基本觀念釐清，比較沒有明顯的挑戰。
但第一週好像是目前最累的一週，可能還在逐漸摸索學習與時間管理的方式，蕃茄鐘也是第一週結束就放棄了啊，看到同學分享的工具 Timely 抓工作時間很有興趣。

每天都保持穩定的時間學習，也比三天衝過頭、兩天耍廢好。

學習內容

[ Command Line ]

[ Git ]

[ 網路基礎概論 ]

[ Shell Script ]

作業

還沒有完全理解的

筆記

第二週

本週算是複習 JS 基礎觀念、基礎排序法，初次感受 ESLint 愛的教育，位元運算也是新世界。

在傳值 or 傳址討論中，學到不再去追根究底名詞背後的定義是什麼，了解其中的行為，比「 該如何定義此行為 」還重要。

看同學作業才知道 code review 的重要性，明明自己有過基礎還寫成那樣、感到羞愧加生氣。同時認清本週作業的超級挑戰題是比自己強太多的對手，現實生活不是 JUMP 漫畫般熱血，所以還是等練高一點再來挑戰。

學習內容

[ 基礎 JS ] 位元運算

過去放棄的觀念，很開心有機會補回來。明明是一樣的內容，霧裡看花時覺得痛苦萬分，理解了卻覺得很好玩，這心境差異也覺得滿有趣的。

[ 基礎 JS ] 變數、迴圈、判斷式、陣列、物件

[ 基礎 JS ] 內建函式

[ 基礎 JS ] 變數傳遞特性

[ 綜合練習題 ]

實用寫法

作業

// 取中間數當作參照值
function searchIndex(start, end) {
  return Math.floor((start + end) / 2);
}
// 主程式
function search(arr, target) {
  let start = 0;
  let end = arr.length;
  let index = searchIndex(start, end);
  // 起始點 與 終點 中間沒有其他數就跳出
  while (end > start + 1) {
    if (arr[index] === target) return index; // 找到目標
    if (arr[index] > target) {
      end = index;
    } else {
      start = index;
    }
    index = searchIndex(start, end); // 更新參照值
  }
  return -1;
}

還沒有完全理解的

筆記

第三週

學習內容

這週開始耐心好像有點下降，但作業寫得很開心。

日後會多善用 ES6 語法、引用模組、不自己造輪子，還有個重要的關鍵是，該怎麼把測資寫得好，真是一門大學問。

寫作業時踩到 NaN 的陷阱，把教訓寫成筆記，有痛點的收穫，印象非常深刻。

[ npm 套件管理工具 ]

[ 測試、Jest、TDD ]

[ ES6 語法、Babel 轉譯器 ]

[ 研究 NaN ]

作業

function add(a, b) {
  let temp10 = 0;
  let ans = '';
  const max = a.length > b.length ? a.length : b.length;
  for (let i = 1; i <= max; i += 1) {
    // 從後往前取數字，空位補 0
    let temp = (Number(a[a.length - i]) || 0) + (Number(b[b.length - i]) || 0) + temp10;
    temp10 = temp > 9 ? 1 : 0;
    temp %= 10;
    ans = temp + ans;
  }
  if (temp10) ans = `1${ans}`; // 最後還要再進一位，前面補 1
  return ans;
}

function checkNum(str, index) {
  return Number(str[str.length - index]) || 0; // 從後往前取數字，空位補 0
}
function add(a, b) {
  let temp10 = 0;
  let ans = '';
  const Max = a.length > b.length ? a.length : b.length;
  for (let i = 1; i <= Max; i += 1) {
    let temp = checkNum(a, i) + checkNum(b, i) + temp10;
    temp10 = temp > 9 ? 1 : 0;
    temp %= 10;
    ans = temp + ans;
  }
  if (temp10) ans = `1${ans}`; // 最後還要再進一位，前面補 1
  return ans;
}

function times(a, b) {
  let ans = '';
  for (let i = 1; i <= a.length; i += 1) {
    for (let j = 1; j <= b.length; j += 1) {
      const temp = checkNum(a, i) * checkNum(b, j) + '0'.repeat(i + j - 2); // 乘積後面補上 n 位數的 0
      ans = add(ans, temp); // 乘積不斷相加
    }
  }
  return ans;
}

還沒有完全理解的

筆記

第四週

本週學的東西都比較抽象，理解 API 怎麼運作的是一回事，真的要串接時，還是碰到一堆困難，request header 的寫法明明也不複雜，但剛開始搞不懂時就是一直撞牆。

體會到好的文件很重要，規則不寫清楚，新手還不會通靈啊

學習內容

[ 網路基礎 - HTTP、Request、Response ]

[ 網路基礎 - TCP / IP ]

[ API ]

[ RESTful API ]

[ Curl 指令 ]

作業

const rp = require('request-promise');

const token = '11gzim2pdteu8xr2p6qgotmuiur42i';
const url = 'https://api.twitch.tv/helix/streams';
const id = '21779'; // game_id of LOL
const num = 100;
let keyNext;

const options = {
  url: `${url}?game_id=${id}&first=${num}`,
  headers: {
    'Client-ID': token,
  },
  json: true, // auto transform to JSON
};

const printData = (body) => {
  body.data.forEach(element => console.log(element.id, element.title));
};
const getItemFront = (body) => {
  printData(body);
  keyNext = body.pagination.cursor;
};
const getItemEnd = () => {
  options.url = `${options.url}&after=${keyNext}`; // request url 加上更新過的 cursor
  rp(options)
    .then(body => printData(body));
};

rp(options)
  .then(body => getItemFront(body)) // 抓前 100 個
  .finally(() => getItemEnd()); // 抓後 100 個

還沒有完全理解的

筆記

第五週

寫這份心得的同時、也複習了前四週所學，還有 HTTP GAME 跟挑戰賽可以玩，完全是目前體驗最佳的一週，沒辦法，解題總是比聽理論有趣啊！

同時零機一動給自己出的抓作業小挑戰，能夠實現的感覺很好。

學習內容

[ OJ 挑戰賽 ]

前幾題都蠻快通過的，第五題已經放生兩天了。 依照 Huli 說的佛系解題法，答案可以現身了嗎我還在等你欸！

[ HTTP GAME ]

目前卡在 Lv14，完全看不懂題目，同樣被我放生。 但真的很好玩，雖然太急著過關沒時間注意彩蛋、連有 hint 都忘了啊哈哈哈

Access-Control-Allow-Origin: *  # 允許所有網站發送的請求
Access-Control-Allow-Origin: lidemy.com  # 只允許 lidemy.com 的請求

Huli 回答：這題跟同不同源其實沒關係，題目只有說 server 會檢查這個 header 而已。然後只有用瀏覽器送出的 request 會有同不同源的問題，其他方式送出的基本上都不受限制。

參考資料：

[ 靈機一動 - 串 API 抓同學作業 ]

內容有點長，直接拉出一篇心得：[第五週] 練習串 GitHub API 抓同學作業

學習心得

課程安排的感想

當時一看到課綱跟報名表，除了後端的部分，課程內容有 70% 都是「 以前有碰過、但不甚了解的 」，所以覺得超級興奮。

本來這段時間是要在家自學的，但我認為在家自學的障礙是，對於陌生的領域，很難挑到適合自己的教學材料、學習內容跟職場需求的切合度、訂出有挑戰性的大目標跟小目標，以及如何檢視學習成果。

雖然直接就業也不是不行，但以現在的實力能進的公司應該不理想，上戰場也很有可能被 Deadline 追著，這邊改一下、那邊再 ctrl + V，反正可以動就好，這不是我期望的。

所以在課程的安排下，至少這四週都是很扎實的學習，而付出了努力多寡也體現在作業成果上，更好的機制是看同學作業，code review 真的可以學很多。只要付出足夠多的時間，我認為人人都可以轉職成功不是講假的。

時間安排

自己都特地跑到一個偏遠地區、就是想遠離任何干擾，說實在是挺有效的。所以基本上沒有什麼外務纏身、時間很充裕，主要也是在測試自己的意志力，時間都放在那裡了，到底能不能好好利用。

雖然目前來說、好像有點每下愈況。（ 汗 ）

持續有輸出的學習方式

自己對於學習與做筆記還在摸索當中。 課程都是很友善地以初學者出發、善用各種比喻，所以教學影片就算只是講理論也都滿好理解的，但隔天的理解度就變成 50 %，或是我自己稱為「假性理解」，因為試圖用自己的話解釋就會卡住。

這時候再上網查不同資料就會很有幫助，就像同一個物體、每個人看到的角度都不同。

同一件觀念，看 5 個參考文章，會得到 5 種面向的解釋，雖然越查越困惑的情況也不在少數，但聽 Huli 講完課有個大方向的理解，有時間的話再看其他教學文的解釋，最後用筆記統整成自己的理解內容。 很多時候我直接看教學文都是看不懂的，有了 Huli 給的世界觀的前提再去深入理解，就變得沒有這麼困難了。

所以前幾週都有練習「 用自己的話解釋某觀念 」的作業，覺得這作業出的真好！

像是第四週，當時的日記寫著： 「 覺得 http 筆記寫的蠻好的，之前看一遍覺得懂了，但當我要寫下來才發現還是有許多可以釐清的地方，消化過再輸出成自己的語言，真的好重要！ 」

總而言之，希望能保持著不斷有 output 的學習，才對得起課程用心的 input

先別急著問

雖然我知道大家都鼓勵多問問題，但我嘗試了一種方法。

如果不是三分鐘能解決的問題、就先列下來，不要急著查資料、也不要急著問，等本週的重點學習內容都告一段落，再來 google 所有列下來的問題，自己找解答、同時試著回答那個不懂的自己，真的找不到再發問。

會這麼做是因為自己很愛問問題、也很急性子，而我的經驗是，只要是我迅速拋出去的問題，得到的答案都不會留在我記憶太久，可能是因為還沒痛過、解答也來得太方便。

而這方法其實是以前主管教我的。

「你的問題先寫在一張紙上，留到我全部說完再發問。」

場景是我坐在他位子旁邊，主管手把手地教我某個功能，在過程中我總是會產生超多問題想問，一直想打斷主管，他可能被我搞瘋了，所以教（逼）我用這種方法之後，整個豁然開朗。

因為許多問題根本不需要發問，我要的答案都在之後會講的內容裡，而我需要的只是聽到最後，那時候才知道。

我會不會只是缺乏等候答案的耐心？

在第一週結束後，有比較多問題統整（ 或者是那時比較認真哈哈哈 ），就開始搜尋整理成一篇 QA：
[第一週] 問題總整理

可以看得出來有些問題都很烙賽，但我就是想知道「 為什麼？ 」，因為在面對陌生的事物時，連問題本身瞎不瞎我都無法判斷。

其實就跟玩海龜湯很像，問到一個關鍵問題算你幸運，但更常見的情況是，拋出去問題的回應都是「 不重要 」。

（ 沒玩過海龜湯的可能無法體會這例子，但有人沒玩過嗎？ ）

總而言之，我想說的是，不需為爛問題而恥、不管多蠢的問題可以列下來，但不用急著丟出去，多等一下答案有可能自己找上門，或是試著自問自答也是蠻有趣的。

（ 當然如果是卡關到無法進行下一步的另當別論啦！ ）

最後，感謝 @Huli 用心的課程內容、以及每次發問都超即時的回答，參加第三期的計畫真是我今年最好的決定。

還有感謝 @isshin、@ChihYang41 同學第五週的心得分享，內容讓我獲益良多，寫法也參考了同學的格式。

Written on May 13th, 2019 by Yakim shu
Feel free to share!

You may also enjoy: