JavaScript基础详细思维导图（纯分享，不加水的那种）

已于 2022-08-19 15:19:12 修改
阅读量6.9k 收藏 87
点赞数 34
分类专栏： 前端 文章标签： javascript 前端 开发语言
于 2022-03-13 14:51:32 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/MOAN_/article/details/123458538
版权

JavaScript比较基础重要知识的思维导图分享给大家，希望能给大家提供帮助，用到的工具是xmind

思维导图是小M.自己学习后总结出来的，比较适合新手，比较推荐UU们自己构造一个属于自己的思维导图，对知识的理解和记忆会更有帮助

这里还有超多面试题合集，并且定期更新最新面试题，可以点击链接在语雀软件中进行关注查看哦
https://www.yuque.com/docs/share/a95df8ad-9493-4624-846d-a921248b669d?# 《js》

https://www.yuque.com/docs/share/176105ad-4201-4ed5-b14b-696df7546dc5?# 《html、css、网络、Git面试题》

前情概要

这部分可以作为了解

基础知识

语法基础

这个部分蛮重要的，就像是学中文要先学拼音一样

在这里插入图片描述

数据类型

在这里插入图片描述

ES6中新增了Symbol类型

在这里插入图片描述

函数

函数对于学习js非常重要，很多地方都有函数的身影

在这里插入图片描述

对象

俗话说的好，万物皆对象。咳咳~此对象非彼对象

对象这个部分在js基础中没有太多的笔记，因为我认为对于刚接触js的uu而言，对象算是比较晦涩难懂的部分，到了js高阶，会更多的了解对象，原型链等更加深入的知识后，理解对象的概念的会轻松很多

在这里插入图片描述

内置对象

按我自己的理解来说就是js已经给我们创造好的对象，里面的属性和方法已经写好了，可以直接拿来使用，方便~

Array数组

数组的内容比较长 分成了两张图片

在这里插入图片描述
在这里插入图片描述

Math对象

在这里插入图片描述

Date日期

购物的时候用到的倒计时、秒杀等功能就借助了Date对象中的一些方法来实现

在这里插入图片描述

String字符串

在这里插入图片描述

常用函数

在初学过程中，很多经典案例都会用到一些函数，我把写出来，可以多了解

DOM 文档对象模型

DOM就是document树
dom的概念大家可以参考MDN
MDN对DOM的解释

查找dom节点

我列出了查找dom节点的方法，想要操作DOM就必须找到它
比较常用的是document.querySelector（）这个方法，比较快捷，可以直接查找id、标签或者class
在这里插入图片描述

DOM属性

在这里插入图片描述在这里插入图片描述

属性节点

在这里插入图片描述

关于style

在这里插入图片描述

方法

在这里插入图片描述

事件

在这里插入图片描述

BOM 浏览器对象模型

BOM概念可以参考菜鸟教程中的解释
在这里插入图片描述

正则表达式

正则表达式是由一个字符序列形成的搜索模式。

当你在文本中搜索数据时，你可以用搜索模式来描述你要查询的内容。

正则表达式可以是一个简单的字符，或一个更复杂的模式。

正则表达式可用于所有文本搜索和文本替换的操作。

正则学起来比较的枯燥晦涩，但是正则表达式在js中算是比较重要的模块，在其他编程语言中都会用到正则表达式，算是一个比较万金油的知识了

在这里插入图片描述

资源获取

点击这里获取网盘链接

提取码：MOAN

评论或者私信戳我也可以哟

有钱的没钱的，欢迎大家给捧个人场（就是不要脸的想要一个点赞）

在这里插入图片描述

转载：欢迎转载，但未经作者同意，必须保留此段声明；

勿杠，欢迎大佬纠错

MOAN.
关注
  • 34
    点赞
  • 踩
  • 87
    收藏
    觉得还不错? 一键收藏
  • 12
    评论
专栏目录
javascript思维导图（全）
09-24
javascript思维导图（全）javascript思维导图（全）javascript思维导图（全）javascript思维导图（全）javascript思维导图（全）javascript思维导图（全）
跟着9张思维导图学习Javascript
weixin_33881041的博客
09-03 205
学习的道路就是要不断的总结归纳，好记性不如烂笔头，so，下面将 po 出我收集的 9 张 javascript 相关的思维导图（非原创）。 思维导图小tips： 思维导图又叫心智图，是表达发射性思维的有效的图形思维工具 ，它简单却又极其有效，是一种革命性的思维工具。思维导图运用图文并重的技巧，把各级主题的关系用相互隶属与相关的层级图表现出来，把主题关键词与图像、颜色等建立记忆链接，思维导图充分...
JavaScript 思维导图库 - jsMind
gitblog_00076的博客
03-17 413
JavaScript 思维导图库 - jsMind https://gitcode.com/hizzgdev/jsmind?utm_source=artical_gitcode jsMind 是一个基于 JavaScript 的思维导图库，支持多种布局方式和自定义主题，让你可以轻松地在 Web 应用程序中创建、编辑和分享思维导图。 一、什么是 jsMind？ jsMind 是一款开源的 JavaS...
8张JS 基础思维图，超详细！
热门推荐
前端开发博客
07-12 5万+
大家好，我是漫步，之前我分享过8张JS思维图、面试思维图，今天再次分享八张JS基础的思维图，希望对你有所帮助。1. javascript变量2. javascript运算符3. javas...
javascript知识点汇总（基础很全，文章最后还有思维导图）
weixin_44641804的博客
09-02 5077
前端规范： 总文件夹内：html、css、img、js、index.html五个 ·html文件夹：可n页，如found.html、person.html ·css文件夹：最多2个，style.css、common.css(公有样式，能复用于多个页面的样式抽离出来放这里) ·js文件夹：最多2个，script.js、common.js(公有js，能复用于多个页面的js抽离出来放这里) ·img文件夹：存放所有需要的图片 ·外面放index.html也可以 一、javascript基础 1.什
【 D3.js 高级系列 — 10.0 】 思维导图
cxu123321的博客
02-17 533
【 D3.js 高级系列 — 10.0 】 思维导图 原创DecemberCafe 最后发布于2015-06-30 19:09:49 阅读数 15758 收藏 展开 思维导图的节点具有层级关系和隶属关系，很像枝叶从树干伸展开来的形状。在前面讲解布局的时候，提到有五个布局是由层级布局扩展来的，其中的树状图（tree layout）和集群图（cluster layout）布局制作出来的图具有“树形”...
使用js实现思维导图
qq_39702981的博客
08-29 2万+
本文主要阐述使用js实现思维导图的关键技术点，如果还不知道什么是思维导图的同学，请自行度娘。以下是demo和源码的传送门： demo：http://sources.ikeepstudying.com/mindmaptree-master/ 源码：http://github.com/RockyRen/mindmaptree/tree/master 下载：mindmaptree-master ...
JavaScript基础知识总结（6张思维导图）
Y_soybean_milk的博客
04-22 1383
以下导图均为学习pink老师js基础视频时，自主整理的，有不足的地方，欢迎大家多多指出
javascript知识点汇总 - 十大思维导图
KANGCHUNHUANG的博客
03-27 4610
看完这十张思维导图，相信这能帮你学习javascript构建一个系统的学习路线，对之后的路有了清晰的认识 1.js数据类型 2.js变量 3.js运算符 4.js流程语句 5.js数组 6.js函数基础 7.js字符串函数 8.js正则表达式 9.DOM基本操作 10.window对象 ...
＜ JavaScript基础知识 之 思维导图 ＞
一个平平无奇的技术宅
04-07 567
JavaScript基础知识大全 --- 思维导图，基本把JavaScript全部的基础知识点涵盖到了，如有不懂。只需单独针对某个知识点进行搜索学习就行了。
js执行思维导图
qq_39966730的博客
05-10 656
说到线程，我们先说进程，比如浏览器就是一个进程，打开浏览器网页时，发送请求， 接手请求，渲染页面，执行js等等就是一个个线程。初始化函数fn:函数fn有个私有属性[[scope]],在全局作用域中定义的函数，会被初始化为当前的全局作用域，即fn.[[scope]] = "globalScope"执行栈：先进后出，栈顶的执行上下文获得执行权，并按顺序执行当前上下文中的代码，执行完 后弹栈销毁上下文，执行权交给下一个栈顶执行上下文。
mindjs:超快速思维导图视图
06-24
思维导图 超快速思维导图视图
js语法基础详细思维导图
03-12
js语法基础思维导图
JavaScript 语言基础知识点总结（思维导图）
12-12
JavaScript 函数基础 Javascript 运算符 JavaScript 流程控制 JavaScript 正则表达式 JavaScript 字符串函数 JavaScript 数据类型 JavaScript 变量 Window 对象 DOM 基本操作    由于上面的图片比较大，建议...
JavaScript基础知识思维导图整理上半部分
02-21
基于JavaScript高级程序设计第三版所整理思维导图，具体说明可参考书籍的详细介绍，这里仅作为大纲结构整理。
JavaScript思维导图
02-16
JavaScript思维导图
<javascript>XMind思维导图知识点
11-18
通过Xmind思维导图的形式，总结了包含了js中变量、关键字、数据类型、选择结构、循环结构、函数、数组、字符串、DOM、事件、BOM、Json、正则、AJAX内容的基础知识。
vue快速入门（四十六）Router的安装与使用
不起眼小菜菜的博客
04-26 635
步骤很详细，直接上教程……
报表控件Stimulsoft在JavaScript报告工具中的事件：查看器事件（上）
最新发布
励志做最业余的专业博主，控件产品可以私我~
04-28 734
在本文中，我们为JS报告工具中的查看器事件提供了全面的指南，包括它们的详细描述、参数列表等一系列详细内容。
JavaScript如何生成思维导图(mindmap)
05-30
要在JavaScript中生成思维导图，可以使用第三方库，如jsMind或MindMaple。这些库提供了一个易于使用的API来创建和管理思维导图。 下面是使用jsMind库创建简单思维导图的示例代码： ```html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>JS Mind Example</title> <script src="jsmind.js"></script> <link rel="stylesheet" type="text/css" href="jsmind.css" /> </head> <body> <div id="jsmind_container"></div> <script> var mind = { "meta": { "name": "My Mindmap", "author": "John Doe", "version": "1.0" }, "format": "node_array", "data": [ {"id":"root", "isroot":true, "topic":"Main Topic"}, {"id":"sub1", "parent":"root", "topic":"Subtopic 1"}, {"id":"sub2", "parent":"root", "topic":"Subtopic 2"}, {"id":"sub3", "parent":"root", "topic":"Subtopic 3"}, {"id":"sub4", "parent":"sub3", "topic":"Sub-subtopic 1"}, {"id":"sub5", "parent":"sub3", "topic":"Sub-subtopic 2"} ] }; var options = { container: 'jsmind_container', theme: 'primary', editable: false }; var jm = new jsMind(options); jm.show(mind); </script> </body> </html> ``` 这个示例创建了一个名为"My Mindmap"的思维导图，并包含一个名为"Main Topic"的根节点和一些子节点。你可以根据需要添加和删除节点。要使用这个示例，请下载jsMind库并将其引入到你的HTML文件中。 这只是一个简单的示例，你可以通过jsMind和MindMaple等库创建更复杂的思维导图。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 12
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值