在 JavaScript 中，「this 是什麼」絕對是讓人頭痛難題前三名。This 和物件方法息息相關，因此這篇文章會先介紹在物件方法、物件方法中的 this 是如何被決定的，把握一個簡單原則就可以知道 this 到底是誰。另外，arrow function 的 this 也很常令人搞混，這篇文章也會一併介紹 arrow function 中的 this。

javascript

當我們在 JavaScript 中透過 fetch 或 XMLHttpRequest 存取資源時，需要遵守 CORS (Cross-Origin Resource Sharing，跨來源資源共用)。瀏覽器在發送請求之前會先發送 preflight request (預檢請求)，確認伺服器端設定正確的 Access-Control-Allow-Methods、Access-Control-Allow-Headers 及 Access-Control-Allow-Origin 等 header，才會實際發送請求。使用 cookie 的情況下還需額外設定 Access-Control-Allow-Credentials header。

javascript web browser

這篇文章會介紹什麼是 cookie，教你如何用 JavaScript 讀取及設定 cookie 的方法，以及 Path、Domain、Max-Age、Expires、Secure、HttpOnly、SameSite 等參數的使用方法，最後介紹關於 cookie 的安全性議題。

javascript web browser

這篇文章要介紹如何設定 @babel/preset-env。@babel/preset-env 是 babel 7 架構下的一組 preset，能讓你用最新的 JavaScript 語法寫程式，並且智慧地根據瀏覽器的環境引入需要的 polyfill，節省手動管理 syntax transform 的時間，還能夠減少 bundle 檔案大小，是現代前端開發不可或缺的利器，快跟我一起來看看設定上有哪些要注意的地方吧！

webpack javascript

在 JavaScript 中，每個物件都有一個 prototype (原型)，物件可以從原型上繼承屬性和方法，達到復用程式碼的效果，這就是所謂的 prototypal inheritance (原型繼承)。除此之外，原型也能繼承其他物件，因此物件可以繼承一層又一層的屬性和方法，這形成了所謂的 prototype chain (原型鏈)。本篇文章將介紹 prototype、prototype chain，以及 prototypal inheritance 與 class inheritance (類別繼承) 的差異。

javascript

Web Share API 是現代瀏覽器提供的最新功能之一，它讓網頁的使用者能夠體驗到和原生 app 完全相同的分享體驗。這篇文章將會教你 navigator.share() 的使用方法。

javascript web browser

Hot Module Replacement (HMR) 是 Webpack 提供方便開發過程的功能，讓你修改原始碼時不需要重新載入頁面，這篇文章將會教你如何設定 Webpack Config 使你的專案支援 HMR，增加團隊的開發效率。

react webpack

現代瀏覽器提供的 Intersection Observer API 非常適合用來實現 Infinite Scroll 和 Lazy Loading 等前端常見的需求。這篇文章將會教你 Intersection Observer API 的用法，不僅程式碼更簡潔，而且效能比起監聽 scroll event 更好，此外瀏覽器支援度也不錯，就讓我們一起來看看吧！

javascript web browser

Element.getBoundingClientRect() 回傳元素的大小，以及其相對於可視範圍 (viewport) 的位置。這篇文章將會教你 getBoundingClientRect() 的用法，以及 left、top、right、bottom、width、height 等位置及大小的屬性，並教你如何搭配 window.pageXOffset 和 window.pageYOffset 轉換成絕對位置。

javascript web browser

在JavaScript中，取得DOM元素的寬度或高度，可以利用clientHeight/clientWidth/offSetHeight/offsetWidth/scrollHeight/scrollWidth/scrollTop/scrollLeft…等屬性，這篇文章整理了不同屬性之間的區別以及應用。下次遇到時再也不會分不清楚了！

javascript web browser