想自学JS吗?想提升JS底层原理吗?76张脑图带你彻底搞懂原生JS

本文适合前端初学者和进阶者,通过76张脑图详细讲解JS基础入门,包括浏览器认识、数据类型、循环、函数、数组、字符串、对象等,还涉及变量提升、作用域链、闭包、原型链等进阶概念,以及HTTP基础。适合保存学习。

本篇内容适用于:初学前端;及工作时间不久想回顾基础的各位伙伴;

文章主要由图片组成,看起来可能会不太方便,适合保存下来单张查看;

既然来了,就看看在走吧,总会有些收获的;

一、前端发展史

二、JS基础入门

1、认识浏览器

2、JS基础知识

初识JS-基础中的基础

 

 

3、三大输出方式

JS中的三大类输出方式

 

 

4、数据类型基础知识

 

number 数据类型基础知识

string 数据类型基础知识

boolean 数据类型基础知识

Object 数据类型基础知识

JS中的数据类型object基础

 

条件判断里的相互转换规则

 

5、数据类型之间的区别(堆栈内存)

数据类型之间的区别(堆内存Heap VS 栈内存Stack)

 

6、JS中三种常见的判断

JS中三种常见的判断

 

7、JS中的for循环

JS循环——for循环

 

8、function的基础知识

JS中function的基础知识

 

9、数组的基础知识

 

10、数组中常用的方法

数组中的16种常用方法

数组中常用的方法【补充reduce、filter、flat...】|内附思维导图

 

11、Math 中的常用方法

Math中常用的9种方法

 

12、字符串中常用方法

字符串中的12种常用方法

 

三、常用方法

 

13、数组去重的三种方法

JS中数组去重的三种方法

 

14、时间格式化的三种方法

JS中时间格式化的三种方法

 

15、URL参数处理的三种方法

JS中URL参数处理的三种方法

 

16、获取随机验证码

 

17、DOM操作汇

 

获取DOM标签的方式

DOM操作之——获取DOM标签的9种方式

 

获取DOM节点的方式

DOM操作之——DOM节点类型及属性

 

DOM元素的增删改

DOM操作之——元素的增删改、样式修改、插入内容

 

操作DOM元素样式

 

四、JS进阶提升

 

18、变量提升

JS中的变量提升机制

 

19、带 var 和 不带 var 的区别

在全局/私有上下文中:带VAR和不带VAR的区别

 

20、作用域和作用域链查找机制

作用域和作用域链查找机制|内附思维导图

 

21、堆栈内存的释放

JS中堆栈内存的释放问题

 

22、闭包的机制

JS中的闭包机制

 

23、let 和 var 的区别

ES3 定义变量 和 ES6 定义变量的区别

 

24、单例/工厂设计模式

JS中的单例/工厂设计模式

 

25、面向对象理论基础

JS中的面向对象OOP理论基础

 

26、构造函数创建自定义类

构造函数创建自定义类

 

27、原型和原型链

JS中的原型和原型链

 

28、给原型扩展属性和方法

 

29、THIS 问题

JS中THIS相关问题梳理

 

30、call/apply/bind

 

31、获取数组最大/小值的三种方法

获取数组中最大值/最小值的三种基础方法

 

32、类数组转数组的五种方法

 

33、ES6语法

 

ES6箭头函数和剩余拓展运算符

 

ES6 解构赋值

 

ES6 class创建类

 

34、多种继承方式

JS中的多种继承方式

 

35、检测数据类型的四种方法

JS中数据类型检测四种方式的优缺点

 

 

36、正则表达式

JS中的正则表达式&&全面梳理|内附思维导图

 

正则表达式基础

 

正则的匹配和捕获

 

正则相关知识

 

37、JS中的盒子模型

JS中的盒子模型

 

38、JS中CSS样式的获取方式

 

39、严格模式和非严格模式的区别

非严格模式 严格模式的区别|附思维导图

 

40、动画处理——CSS3动画

 

41、动画处理——JS动画

 

42、插件封装思想

插件封装|封装一个属于自己的轮播图插件——左右切换版

 

43、回调函数相关知识点

 

44、深浅克隆和深浅比较

深克隆 VS 浅克隆|深比较 VS 浅比较|回调函数

 

45、事件

事件及事件绑定 && 事件对象及事件传播——基础知识(脑图梳理)

 

常用的事件行为

 

事件对象

 

事件传播机制

 

DOM0和DOM2

 

mouseover 和 mouseenter

 

事件委托

 

46、柯里化函数编程思想

 

47、promise基础

 

48、promise基础之then

 

五、HTTP基础篇

 

49、客户端和服务器交互基础

 

50、URL解析

 

51、HTTP请求

 

52、浏览器渲染页面的主体流程

 

53、回流和重绘

 

54、同步异步

 

55、AJAX的串行和并行

 

56、AJAX基础知识

 

57、AJAX中的全局刷新和局部刷新

好了,基础知识就在这里告一段落了,上文算是笔者对目前所文章的一个大总结,也是每一个前端应该掌握的最基础的知识,当然这只是基础知识,码农码农必不可少的必然是多练习,多敲代码,希望这条路上的我们都能轻轻松松的得到自己想要的,加油哦各位!!!

文章还有很多不足,内容也不是很全面,希望能够得到各位大佬的指点

高清原图地址QQ裙:859794646

最后总结整理不易,望您赏个赞再走

 

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值