想自學JS嗎？想提高JS底層原理嗎？76張腦圖帶你完全搞懂原生JS

"不畏懼，不講究，將來的日子好好努力"——你們好！我是小芝麻😄

在默默的更新了一段時間的文章後，小芝麻決定勵志成爲一個標題黨😄

別走，別走，別走啊😭.....

搞錯了，下面咱們正式開始；

本篇內容適用於：初學前端；及工做時間不久想回顧基礎的各位夥伴；

文章主要由圖片組成，看起來可能會不太方便，適合保存下來單張查看😄；

既然來了，就看看在走吧，總會有些收穫的😄；

補充圖片地址連接 gitee.com/jinsexiaozh…

1、前端發展史

2、JS基礎入門

一、認識瀏覽器

二、JS基礎知識

初識JS-基礎中的基礎

三、三大輸出方式

JS中的三大類輸出方式

四、數據類型基礎知識

JS中的數據類型簡析——基本數據類型值

number 數據類型基礎知識

string 數據類型基礎知識

boolean 數據類型基礎知識

Object 數據類型基礎知識

JS中的數據類型object基礎

條件判斷裏的相互轉換規則

五、數據類型之間的區別（堆棧內存）

數據類型之間的區別（堆內存Heap VS 棧內存Stack）

六、JS中三種常見的判斷

JS中三種常見的判斷

七、JS中的for循環

JS循環——for循環

八、function的基礎知識

JS中function的基礎知識

九、數組的基礎知識

十、數組中經常使用的方法

數組中的16種經常使用方法

數組中經常使用的方法【補充reduce、filter、flat...】｜內附思惟導圖

十一、Math 中的經常使用方法

Math中經常使用的9種方法

十二、字符串中經常使用方法

字符串中的12種經常使用方法

3、經常使用方法

1三、數組去重的三種方法

JS中數組去重的三種方法

1四、時間格式化的三種方法

JS中時間格式化的三種方法

1五、URL參數處理的三種方法

JS中URL參數處理的三種方法

1六、獲取隨機驗證碼

1七、DOM操做彙總

獲取DOM標籤的方式

DOM操做之——獲取DOM標籤的9種方式

獲取DOM節點的方式

DOM操做之——DOM節點類型及屬性

DOM元素的增刪改

DOM操做之——元素的增刪改、樣式修改、插入內容

操做DOM元素樣式

4、JS進階提高

1八、變量提高

JS中的變量提高機制

1九、帶 var 和 不帶 var 的區別

在全局/私有上下文中：帶VAR和不帶VAR的區別

20、做用域和做用域鏈查找機制

做用域和做用域鏈查找機制｜內附思惟導圖

2一、堆棧內存的釋放

JS中堆棧內存的釋放問題

2二、閉包的機制

JS中的閉包機制

2三、let 和 var 的區別

ES3 定義變量 和 ES6 定義變量的區別

2四、單例/工廠設計模式

JS中的單例/工廠設計模式

2五、面向對象理論基礎

JS中的面向對象OOP理論基礎

2六、構造函數建立自定義類

構造函數建立自定義類

2七、原型和原型鏈

JS中的原型和原型鏈

2八、給原型擴展屬性和方法

2九、THIS 問題

JS中THIS相關問題梳理

30、call/apply/bind

3一、獲取數組最大/小值的三種方法

獲取數組中最大值/最小值的三種基礎方法

3二、類數組轉數組的五種方法

3三、ES6語法

ES6箭頭函數和剩餘拓展運算符

ES6 解構賦值

ES6 class建立類

3四、多種繼承方式

JS中的多種繼承方式

3五、檢測數據類型的四種方法

JS中數據類型檢測四種方式的優缺點

3六、正則表達式

JS中的正則表達式&&全面梳理｜內附思惟導圖

正則表達式基礎

正則的匹配和捕獲

正則相關知識

3七、JS中的盒子模型

JS中的盒子模型

3八、JS中CSS樣式的獲取方式

3九、嚴格模式和非嚴格模式的區別

非嚴格模式 🆚 嚴格模式的區別｜附思惟導圖

40、動畫處理——CSS3動畫

4一、動畫處理——JS動畫

4二、插件封裝思想

插件封裝｜封裝一個屬於本身的輪播圖插件——左右切換版

4三、回調函數相關知識點

4四、深淺克隆和深淺比較

深克隆 VS 淺克隆｜深比較 VS 淺比較｜回調函數

4五、事件

事件及事件綁定 && 事件對象及事件傳播——基礎知識（腦圖梳理）

經常使用的事件行爲

事件對象

事件傳播機制

DOM0和DOM2

mouseover 和 mouseenter

事件委託

4六、柯里化函數編程思想

4七、promise基礎

4八、promise基礎之then

5、HTTP基礎篇

從在地址欄輸入網址到看到頁面的過程&&AJAX基礎｜腦圖梳理

4九、客戶端和服務器交互基礎

50、URL解析

5一、HTTP請求

5二、瀏覽器渲染頁面的主體流程

5三、迴流和重繪

5四、同步異步

5五、AJAX的串行和並行

5六、AJAX基礎知識

5七、AJAX中的全局刷新和局部刷新

好了，基礎知識就在這裏告一段落了，上文算是筆者對目前所文章的一個大總結，也是每個前端應該掌握的最基礎的知識，固然這只是基礎知識，碼農碼農必不可少的必然是多練習，多敲代碼，但願這條路上的咱們都能輕輕鬆鬆的獲得本身想要的😄，加油哦各位！！！

小芝麻深知，文章還有不少不足，內容也不是很全面，但願可以獲得各位大佬的指點😄

最後總結整理不易，望您賞個贊再走😄，（PS：若是此次能成功升到三級小芝麻就.....（幹什麼由您決定））

銘謝：

知識點不少，整理這些圖片也是爲了後面在想深刻的時候，可以溫故知新；

分享到這裏能被更多夥伴承認和使用，也是筆者之幸😁