iT邦幫忙

鐵人檔案

2021 iThome 鐵人賽
回列表
Modern Web

JavaScript 從 50% 開始,打造函式庫不是問題! 系列

我們都知道進入一個新的未知領域,大多數的學生都會選擇從理論開始學習。

本系列文章將從實務層面著手,讀者不僅能從中學習理論,也能理解如何將理論應用於實作中。

鐵人鍊成 | 共 46 篇文章 | 38 人訂閱 訂閱系列文 RSS系列文
DAY 21

JS 21 - 資料太多看得心很累?用 9 行程式碼將資料轉換為表格吧!

大家好! 光是複雜的 JSON 資料就要看到眼花了,如果又全部縮成一行,我不敢說了。我們進入今天的主題吧! 程式碼 提高資料的可讀性。 Felix.json2...

2021-10-06 ‧ 由 Felix 分享
DAY 22

JS 22 - 探險時間!深入查詢物件的所有子屬性!

大家好! 如果要深入查詢一個多層物件,一般都是用 Object.keys 等方法,今天就是要簡化這樣麻煩的步驟。我們進入今天的主題吧! 程式碼 Felix.d...

2021-10-07 ‧ 由 Felix 分享
DAY 23

JS 23 - 非同步執行,也是要依序排隊!

大家好! 今天我們要實作的靜態函式有點像 Promise 的感覺。我們進入今天的主題吧! 程式碼 Felix.queue = function (fns, d...

2021-10-08 ‧ 由 Felix 分享
DAY 24

JS 24 - 請求支援前,要先發送請求!

大家好! 發送請求時,各位有沒有多寫好幾行程式碼的經驗呢?今天就是要簡化如此複雜的動作。我們進入今天的主題吧! 程式碼 Felix.xhr = functio...

2021-10-09 ‧ 由 Felix 分享
DAY 25

JS 25 - 舉一反三,擴充專屬於自己的函式庫!

大家好! 今天要介紹的是最後一個靜態方法。我們進入今天的主題吧! 程式碼 Felix.prototype.attach = Felix.attach = fu...

2021-10-10 ‧ 由 Felix 分享
DAY 26

JS 26 - 進階版互動視窗!不只警告、確認和提示,還有導覽功能!

大家好! 我們今天要實作能和使用者互動的視窗。我們進入今天的主題吧! 互動視窗 如果要和使用者互動,我們大多都會使用 alert、confirm 和 prom...

2021-10-11 ‧ 由 Felix 分享
DAY 27

JS 27 - 平滑滾動,讓視窗不再是閃電俠!

大家好! 我們今天要實作讓視窗能平滑地滾動到錨點。我們進入今天的主題吧! 程式碼 (function (duration) { Felix('a[hr...

2021-10-12 ‧ 由 Felix 分享
DAY 28

JS 28 - 客製化滾動卷軸:樣式多,支援度也廣!

大家好! 我們今天要實作的自訂滾動卷軸,不僅能自訂方向、選擇更多樣式,甚至支援度比 CSS 更廣。我們進入今天的主題吧! 程式碼 (function () {...

2021-10-13 ‧ 由 Felix 分享
DAY 29

JS 29 - 一個 div 就能完成的發光游泳圈!

大家好! 今天我們要實作網頁完全載入前的載入游泳圈!我們進入今天的主題吧! 樣式表 #loader { width: 10em; height...

2021-10-14 ‧ 由 Felix 分享
DAY 30

JS 30 - 將 JSON 資料應用到統計學!

大家好! 今天我們要實作解析 JSON 資料,並計算資料的變異數。我們進入今天的主題吧! 公式 母體變異數: 樣本變異數: 公式的使用取決於樣本數的範...

2021-10-15 ‧ 由 Felix 分享