前端知识点

原文文章：前端工程师手册

 前端知识点

HTML + CSS

对Web标准的理解、浏览器内核差异、兼容性、hack、CSS基本功：布局、盒子模型、选择器优先级及使用、HTML5、CSS3、移动端

• 一些自适应或垂直水平居中问题汇总
• Normal Flow
• Containing Block
• Margin Collapse
• BFC
• Baseline
• Writing Mode
• unicode-bidi

JavaScript

补充一下JS的深入理解，参考汤姆大叔的博客: 深入理解JavaScript系列，理解一些原理性质的东西。别停留在使用上，不然面试的时候很容易吃亏。那些你觉得不在意的东西，往往会是你成功的阻碍。

数据类型、面向对象、继承、闭包、插件、作用域、跨域、原型链、模块化、自定义事件、内存泄漏、事件机制、异步装载回调、模板引擎、Nodejs、JSON、ajax等。

JS的知识点：

1、DOM结构 —— 两个节点之间可能存在哪些关系以及如何在节点之间任意移动。

2、DOM操作 —— 如何添加、移除、移动、复制、创建和查找节点等。

3、事件 —— 如何使用事件，以及IE和标准DOM事件模型之间存在的差别。

4、XMLHttpRequest —— 这是什么、怎样完整地执行一次GET请求、怎样检测错误。

5、严格模式与混杂模式 —— 如何触发这两种模式，区分它们有何意义。

6、盒模型 —— 外边距、内边距和边框之间的关系，及IE8以下版本的浏览器中的盒模型

7、块级元素与行内元素 —— 怎么用CSS控制它们、以及如何合理的使用它们

8、浮动元素 —— 怎么使用它们、它们有什么问题以及怎么解决这些问题。

9、HTML与XHTML —— 二者有什么区别，你觉得应该使用哪一个并说出理由。

10、JSON —— 作用、用途、设计结构。

基础知识

• JavaScript的基本数据类型
• 内置对象的常用方法
• 理解事件机制
• 理解原型继承
• 理解作用域问题
• 理解模块化
• 性能优化
• 知道基本的编程语法，比如循环，判断，try/catch 等等
• 理解包括多种函数定义以及赋值的方式，包括匿名函数
• 理解基本的命名空间，全局（window）空间以及对象空间（不包括闭包）
• 理解上下文的角色以及 this 变量的使用
• 理解各种对象以及函数的初始化和声明方式
• 理解 javascript 比较操作符，如<, >, ==, ===，以及对象和字符串比较的原理和对象映射
• 理解对象属性和函数的数组索引，以及这和真实的数组之间的区别。

中级知识

• 理解常用库的实现原理，比如选择器部分，事件绑定部分
• 检测浏览器类型与版本
• 了解特性检测
• 理解定时器，以及它的工作原理，包括何时以及如何使用定时器来异步执行方法调用
• 关于回调的深度支持，以及如何通过 call 和 apply 方法来控制上下文和函数参数传递
• 理解 JSON 标记以及 eval 函数
• 理解闭包以及他们如何影响你的代码效率
• AJAX 以及对象序列化

高级知识

• 理解方法的 arguments 变量，包括如何使用它来通过 arguments.length 重载函数，以及通过 arguments.callee 来进行递归调用，需要注意使用这个特性有一定的危险性，因为 ECMAScript 5 的 Strict 模式不支持此功能，但 jQuery 和 Dojo 都用到了它。
• 高级闭包比如 self-memoizing 函数，partially applied 函数，以及最可爱的 (function(){})() 调用。
• 函数以及 HTML prototype，prototype chain，以及如何使用基本的javascript对象和函数（比如 Array）来简化代码。
• 对象类型以及 instanceof 的使用
• 正则表达式和表达式编译
• With 语句以及为什么不要使用它们
• 最困难的部分，知道如果利用所有这些工具，并产生处干净，整洁，健壮，快速，可维护以及兼容不同浏览器的代码。

和web相关的知识

• 如何高效的操作 Dom（添加，删除以及更新），还有如何通过使用 document fragments 这样的工具来最小化浏览器的 re-flows。
• 浏览器的 DOM 元素属性提取（比如，style，position等等），jQuery 和 Dojo 都可以很好的完成这些工作，尽管如此，理解从 CSS 和 style 标签中提取属性的差异，以及如何计算 position 和 size 还是很重要的。
• 跨浏览器的事件处理，绑定，反绑定，冒泡，以及如何取得期望的回调上下文。在一次，现成的框架也可以很好的处理这些事情，但是你应该对 IE 浏览器和 W3C 标准浏览器之间的不同有所了解。
• 正则表达式选取 DOM 节点
• 浏览器功能检测以及智能降级

其他

HTTP、WEB安全、正则、优化、重构、响应式、团队协作、可维护、SEO、UED、架构、职业生涯

参考资料

• 我所了解的CSS
• 你不知道你不懂 javascript
• 代码之谜
• 汤姆大叔的博客: 深入理解JavaScript系列
• JavaScript核心
• Sit The Test: 提供一些知识点的测试，包含html, css, js

最后上两张图(祝大家早日成为一个优秀的程序员)：