谷医师 發表於 2017-3-11 14:48:00

javascript学习目录

<h2>前面的话</h2>
<p>　　javascript是一门充满活力、简单易用的语言，又是一门具有许多复杂微妙技术的语言。即使是经验丰富的javascript开发者，如果没有认真学习的话，也无法真正理解它们，这就是javascript的矛盾之处。由于javascript不必理解就可以使用，因此通常来说很难真正理解语言本身，这就是我们面临的挑战。不满足于只是让代码正常工作，而是想要弄清楚为什么，勇于挑战这条崎岖颠簸的少有人走的路，拥抱整个javascript</p>
<p>　　纷繁复杂的库，大多都以javascript为基础。实际上，前端工程师很大程度上指javascript工程师。前端入门容易精通难，说的是前端，更指的是javascript。如果把掌握HTML和CSS作为进入&rdquo;前端大学&ldquo;的高中知识贮备，那么javascript就是&rdquo;前端大学&ldquo;的主修课程，如何在&rdquo;毕业&ldquo;后成功开启自己的前端人生，要看javascript知识学得深不深，理解得透彻不透彻，所以在javascript上投入多少时间都不为过</p>
<p>　　小火柴将javascript的知识体系进行了梳理和归纳，总结成以下目录</p>
<p>&nbsp;</p>
<h2>ECMA</h2>
<h3>基础语法</h3>
<p>【基础】</p>
<p>　　词法结构</p>
<p>　　变量和标识符</p>
<p>　　属性和变量</p>
<p>　　表达式</p>
<p>　　严格模式</p>
<p>　　内存管理及垃圾回收</p>
<p>　　动态脚本</p>
<p>【运算符】</p>
<p>　　运算符语法概述　　</p>
<p>　　算术运算符</p>
<p>　　关系运算符</p>
<p>　　逻辑运算符</p>
<p>　　位运算符</p>
<p>　　条件、逗号、赋值、()和void运算符</p>
<p>【语句】</p>
<p>　　表达式语句、块语句、空语句和声明语句</p>
<p>　　条件语句、循环语句和跳转语句</p>
<p>　　eval和with</p>
<p>&nbsp;【规范】</p>
<p>　　javascript编码标准</p>
<p>　　关于javascript代码优化的8点建议</p>
<div>　　JS代码检查工具ESLint</div>
<p>&nbsp;</p>
<h3>数据类型</h3>
<p>【基础】</p>
<p>　　15种原生对象类型系统综述</p>
<p>　　原始值和复杂值</p>
<p>　　包装对象</p>
<p>【基本类型】</p>
<p>　　Undefined和Null</p>
<p>　　Boolean布尔类型</p>
<p>　　Number数字类型&nbsp;</p>
<p>　　Math对象</p>
<p>　　String字符串类型</p>
<p>　　String字符串类型的属性和方法</p>
<p>【构造器类型】</p>
<p>　　正则表达式基础语法</p>
<p>　　RegExp正则类型<br /></p>
<p>　　Array数组类型</p>
<p>　　22种数组方法</p>
<p>　　数组复制</p>
<p>　　字符串和数组的方法比较</p>
<p>　　错误处理机制</p>
<p>【日期对象】</p>
<p>　　日期和时间基础知识</p>
<p>　　Date日期对象</p>
<p>　　简易日历实现</p>
<p>　　日期联动效果</p>
<p>【类型识别】</p>
<p>　　四种类型识别的方法&nbsp;　　</p>
<p>　　数组检测方式</p>
<p>【类型转换】</p>
<p>　　toString()</p>
<p>　　valueOf()</p>
<p>　　数据类型转换</p>
<p>【函数】</p>
<p>　　函数概述</p>
<p>　　函数参数</p>
<p>　　函数的属性和方法</p>
<p>　　ES6函数扩展</p>
<p>　　函数式编程</p>
<p>　　高阶函数</p>
<p>　　函数柯里化</p>
<p>　　函数节流和函数防抖</p>
<p>　　惰性函数</p>
<p>【对象】</p>
<p>　　初识对象</p>
<p>　　对象的属性操作</p>
<p>　　对象的属性描述符</p>
<p>　　对象拷贝</p>
<p>&nbsp;</p>
<h3>难点重点</h3>
<p>【作用域】</p>
<p>　　内部原理</p>
<p>　　词法作用域和动态作用域</p>
<p>　　声明提升(hosting)</p>
<p>　　块作用域</p>
<p>　　一张图理解执行环境和作用域</p>
<p>【闭包】</p>
<p>　　到底什么才闭包</p>
<p>　　从执行环境角度看闭包</p>
<p>　　IIFE</p>
<p>　　常见的一个循环和闭包的错误详解</p>
<p>　　闭包的10种形式</p>
<p>【this】</p>
<p>　　this的4种绑定规则</p>
<p>　　this绑定优先级</p>
<p>　　箭头函数</p>
<p>【继承实现】</p>
<p>　　一张图理解prototype、proto和constructor的三角关系</p>
<p>　　构造函数和原型对象</p>
<p>　　创建对象的5种模式</p>
<p>　　实现继承的3种形式</p>
<p>　　面向对象的6个概念</p>
<p>&nbsp;【模块化】</p>
<p>　　实现javascript下的模块组织</p>
<p>　　CommonJS规范及Node模块实现</p>
<p>　　使用Browserify来实现CommonJS的浏览器加载</p>
<p>　　AMD及requireJS</p>
<p>　　r.js打包</p>
<p>　　CMD及seaJS</p>
<p>　　ES6中的Module</p>
<p>&nbsp;</p>
<h2>DOM</h2>
<h3>节点</h3>
<p>【节点类型】</p>
<p>　　节点类型概述</p>
<p>　　文本节点</p>
<p>　　注释节点和文档类型节点</p>
<p>　　文档片段节点</p>
<p>　　元素节点</p>
<p>　　特性节点</p>
<p>　　文档节点</p>
<p>【获取节点】</p>
<p>　　元素选择器</p>
<p>　　getElementsByClassName</p>
<p>　　selector选择器</p>
<p>　　动态集合</p>
<p>【节点操作】</p>
<p>　　节点关系</p>
<p>　　节点操作</p>
<p>　　节点内容</p>
<p>　　节点遍历</p>
<p>　　节点范围</p>
<p>　　区分元素特性和对象属性</p>
<p>　</p>
<h3>脚本化CSS</h3>
<p>　　脚本化行间样式</p>
<p>　　查询计算样式</p>
<p>　　脚本化CSS类</p>
<p>　　脚本化样式表</p>
<p>　　动态样式</p>
<p>　　脚本化伪元素　　</p>
<p>&nbsp;</p>
<h3>表单脚本</h3>
<p>　　表单对象</p>
<p>　　表单字段</p>
<p>　　选择文本</p>
<p>　　选择框脚本</p>
<p>　　富文本编辑</p>
<p>&nbsp;</p>
<h3>元素尺寸</h3>
<p>　　偏移offset</p>
<p>　　客户区Client</p>
<p>　　滚动Scroll</p>
<p>　　回到顶部</p>
<p>　　元素视图方法</p>
<p>&nbsp;</p>
<h3>事件</h3>
<p>【事件机制】</p>
<p>　　事件流</p>
<p>　　事件处理程序</p>
<p>　　事件对象</p>
<p>　　事件模拟</p>
<p>　　事件循环</p>
<p>【事件类型】</p>
<p>　　鼠标事件</p>
<p>　　键盘事件</p>
<p>　　变动事件</p>
<p>　　剪贴板事件</p>
<p>　　文本事件</p>
<p>　　加载事件</p>
<p>　　焦点管理</p>
<p>&nbsp;</p>
<h2>动画</h2>
<h3>拖拽</h3>
<p>　　原生拖放</p>
<p>　　模拟拖拽</p>
<p>　　磁性吸附</p>
<p>　　碰撞检测</p>
<p>　　拖拽改变元素大小</p>
<p>　　模拟滚动条</p>
<p>&nbsp;</p>
<h3>运动</h3>
<p>　　匀速运动</p>
<p>　　变速运动</p>
<p>　　曲线运动</p>
<p>　　抖动</p>
<p>　　缓冲运动和弹性运动</p>
<p>　　投掷和轨迹</p>
<p>　　鼠标跟随运动</p>
<p>　　碰壁运动</p>
<p>　　碰撞运动</p>
<p>　　时间版运动</p>
<p>　　velocity.js的使用</p>
<p>　　tween.js的使用</p>
<p>　　帧动画</p>
<p>&nbsp;</p>
<h3>canvas</h3>
<p>　　canvas基础语法</p>
<p>　　canvas图形处理和进阶用法</p>
<p>　　canvas图形绘制</p>
<p>　　canvas图像编辑</p>
<p>　　canvas贝塞尔曲线演示</p>
<p>　　canvas自适应圆形时钟</p>
<p>　　canvas粒子时钟</p>
<p>　　canvas动态小球重叠效果</p>
<p>　　canvas探照灯效果</p>
<p>　　canvas粒子系统的构建</p>
<p>&nbsp;</p>
<h3>SVG</h3>
<p>　　SVG基本形状和样式设置</p>
<p>　　SVG文本</p>
<p>　　SVG路径</p>
<p>　　SVG贝塞尔曲线演示</p>
<p>　　SVG辅助标签</p>
<p>　　SVG视野</p>
<p>　　SVG坐标系统及图形变换</p>
<p>　　SVG渐变</p>
<p>　　SVG图案</p>
<p>　　SVG裁切和蒙版</p>
<p>　　SVG动画</p>
<p>　　SVG基本操作API</p>
<p>　　</p>
<h3>AJAX</h3>
<p>【基础】</p>
<p>　　JSON</p>
<p>　　XHR对象</p>
<p>　　请求方式</p>
<p>　　响应解码</p>
<p>　　FormData</p>
<p>　　进度事件</p>
<p>　　头部信息</p>
<p>　　传递JSON</p>
<p>　　表单提交</p>
<p>　　jQuery中的ajax</p>
<p>【跨域】</p>
<p>　　CORS</p>
<p>　　图片Ping</p>
<p>　　JSONP</p>
<p>　　iframe跨域&nbsp;　　</p>
<p>&nbsp;</p>
<h3>存储</h3>
<p>　　Cookie</p>
<p>　　IE userData</p>
<p>　　Web Storage</p>
<p>　　Blob</p>
<p>　　文件File</p>
<p>&nbsp;</p>
<h3>BOM</h3>
<p>【定时器】</p>
<p>　　setTimeout()和setInterval()</p>
<p>　　requestAnimationFrame()</p>
<p>　　定时器应用(时钟、倒计时、秒表和闹钟)</p>
<p>&nbsp;【window属性】</p>
<p>　　对话框</p>
<p>　　窗口操作</p>
<p>　　location对象</p>
<p>　　history对象</p>
<p>　　screen对象</p>
<p>　　navigator对象和用户代理检测</p>
<p>　　能力检测</p>
<p>&nbsp;【HTML5】</p>
<p>　　Web计时机制</p>
<p>　　Web Worker</p>
<p>&nbsp;</p>

</div>
<div id="MySignature" role="contentinfo">
    <p><span>好的代码像粥一样，都是用时间熬出来的</span></p>
<img src="https://pic.xiaohuochai.site/blog/qrcode.jpg" alt="二维码"><br><br>
来源：https://www.cnblogs.com/xiaohuochai/p/5613593.html
頁: [1]
查看完整版本: javascript学习目录