原创 JavaScript進階（十五）：proxy 的基本使用 has、get、set、deleteProperty
首先，我們先稍微介紹下 proxy 的歷史。 實際上來說，proxy 它的前身並不是 defineProperty，它的前身其實是另一個東西，叫做 observe。 observe 的作用和 proxy 差不多，也是可以監聽某一個對象的一
2020-06-16 05:38:34
1
原创 JavaScript進階（二十五）：獲取所有標籤屬性，dataset 屬性
上篇博客我們說了 getAttribute 和 setAttribute，它們可以幫助我們去讀取自定義屬性，和設置自定義屬性，而且讓這個HTML標籤上面真的有這個屬性。 那麼接下來，我們除了這個以外，還會有一個小小的操作，就是說，我們經常
2020-06-16 05:38:34
1
原创 React-Router基礎（二）：BrowserRouter、HashRouter、MemoryRouter 的區別，路由參數
前面我們說過 Router 裏面是劃分爲 BrowserRouter，HashRouter，MemoryRouter 這三種路由的，那麼這裏我們就來看看它們之間的區別和比較。 首先，第一種 BrowserRouter。 BrowserRo
2020-06-16 05:38:34
原创 JavaScript進階（十六）：proxy 的基本使用 apply、construct
通過上篇博客，現在我們就大概的知道 proxy，它有這麼幾個特點：has，get，set，deleteProperty。 然後接下來，我們前面也說過，這是它的最基本的用法，而且這裏面其實有一個問題，就是說，我現在操作的並不是我那個原始的數
2020-06-16 05:38:34
原创 JavaScript進階（十七）：如何用 proxy 做一個響應類
這裏我們主要來說下 proxy 的 construct。 在上篇博客中，我們有說到 proxy 的 construct，它裏面會要求你返回一個構造好的對象出來。 那麼現在我想做一個事： 比如上篇博客的例子，這個 p，現在我希望它能夠幫我
2020-06-16 05:38:34
原创 JavaScript進階（十八）：proxy 的應用（一）
這篇博客，我們來做幾個小例子，以及我們還想把之前做的 HotList，再改成使用 proxy 來實現。 我們先來幾個小一點的，一步一步來。 首先，先做一個最簡單的例子，我這有一個類： 然後接下來，我希望的是我這個類，可以在 HTML
2020-06-16 05:38:34
原创 JavaScript進階（二十二）：兄弟節點，DOM 操作，文檔碎片，DOM 操作爲什麼慢
實際上來說，我們平常真正在用 DOM 節點的時候，不止是父級子級，我們偶爾的時候，還會用到一個東西，叫做兄弟節點。 那什麼叫兄弟節點？ 就比如，對於這個 aaa 的 span 來說，它前一個兄弟節點就是上面那一堆字。 兄弟節點很簡單
2020-06-16 05:38:34
原创 JavaScript進階（二十三）：實現一個循環需要注意的問題
這篇博客，我們準備拿 DOM 的東西來做點事。 實際上來說，幾乎在所有的框架當中，它們普遍都有一個操作，就是循環。在 vue 裏面叫做 v-for，在 react 裏面叫做 map。 那麼接下來，我希望的就是，我要如何來實現一個這樣的功能
2020-06-16 05:38:34
原创 JavaScript進階（十四）：defineProperty 的應用
上篇博客我們發現 defineProperty 會有一個問題，就是不管是數組還是 json，你去操作數據內部的東西，這時候它是無法響應的。 實際上來說，正常的情況下，defineProperty 它只監聽你讓它監聽的那一層。 如果我們想監
2020-06-16 05:38:34
原创 JavaScript進階（二十八）：DOM 的編譯（三）
在上一篇博客裏面，我們做到了最基本的 DOM 編譯，但還有很多的問題。 比如，模板裏面多個空格會怎麼樣？ 這個時候，它就報錯了。 原因很簡單，因爲我們現在是拿着空格 a 在用。 空格當然要去，也很簡單，我們直接在後面加個 trim
2020-06-16 05:38:34
原创 JavaScript進階（二十）：proxy 的應用（三）
這篇博客我們更進一步的把 proxy 實現的 HotList 給往下的做一做。 首先，我們每次寫一個類，都需要這麼寫嗎？ 肯定不需要。 因爲這樣太麻煩，也太亂了。 所以，我希望可以有一個公共的 js 文件 common.js： 然
2020-06-16 05:38:34
1
原创 JavaScript進階（二十四）：獲取和設置 DOM 屬性
前面我們說過 DOM 的節點、DOM 的操作，那麼接下來，我們還要在說一個很重要的東西，DOM 的屬性。 首先什麼是 DOM 的屬性？ 你給 div 加個 title，那就叫屬性，你給 div 加個 onclick，那也叫屬性。 那麼我們
2020-06-16 05:38:34
1
原创 JavaScript進階（二十七）：DOM 的編譯（二）
這篇博客，我們就來乾點 render 該乾的事。 首先，我們現在寫的這個 render，我個人更喜歡把它叫做 update： 爲什麼呢？ 因爲我喜歡把 render 單獨的提出來。 render 就是 render，render 不做判
2020-06-16 05:38:34
原创 JavaScript進階（十三）：defineProperty 的用法和問題
defineProperty 這個東西，它是很多框架的核心，比如 vue 2.6，它裏面用的就是 defineProperty。 所以接下來，我們要說的，就是想看下這個 defineProperty 它要怎麼去用。 首先，我們來做個簡
2020-05-22 14:21:04
原创 JavaScript進階（十二）：defineProperty 的基本使用
這篇博客我們來講下可響應對象的第二種方法，defineProperty。 儘管來說這個東西有衆多的缺陷，但畢竟是非常有一席之地的一個東西，所以我們現在還是要比較深入的瞭解它一下。 首先這個 defineProperty 它的作用是什麼
2020-05-22 14:21:04