美文网首页
要掌握的知识

要掌握的知识

作者: 方_糖 | 来源:发表于2019-02-14 11:14 被阅读0次

    JavaScript

    • 执行上下文,尤其是词法作用域和闭包; ✔(1)
      参考链接:http://www.ruanyifeng.com/blog/2009/08/learning_javascript_closures.html

    • 块作用域 ✔(1)

    • 变量提升 ✔(1)

    • 函数以及函数表达式和声明; ✔(1)
      参考链接:https://www.cnblogs.com/Saints/p/5991186.html

    • 绑定——特别是 call、bind、apply 和 this;

    • 对象原型、构造函数和 mixin;

    • 组合和高阶函数;

    • 事件委托和冒泡;

    • 使用 typeof、instanceof 和 Object.prototype.toString 进行类型转换;

    • 使用回调、promise、await 和 async 处理异步调用;

    • 什么时候可以使用函数声明和表达式。

    DOM

    • 知道如何遍历和操作 DOM 非常重要,对于重度依赖 jQuery 或者开发了很多 React & Angular 类型应用程序的候选人来说,他们可能会在这个问题上栽跟斗。你可能不会每天都直接接触 DOM,因为我们大多数人都在使用各种抽象。在不使用第三方库的情况下,你需要知道如何执行以下这些操作:

    • 使用 document.querySelector 选择或查找节点,在旧版浏览器中使用document.getElementsByTagName;

    • 上下遍历——Node.parentNode、Node.firstChild、Node.lastChild 和 Node.childNodes;

    • 左右遍历——Node.previousSibling 和 Node.nextSibling;

    • 操作——在 DOM 树中添加、删除、复制和创建节点。你应该了解如何修改节点的文本内容以及切换、删除或添加 CSS 类名等操作;

    • 性能——当有很多节点时,修改 DOM 的成本会很高,你至少应该知道如何使用文档片段和节点缓存。

    CSS

    至少,你应该知道如何在页面上布局元素,如何使用子元素或直接后代选择器来定位元素,以及什么时候该用类、什么时候该用 ID。

    • 布局——安排彼此相邻的元素的位置,以及如何将元素布置成两列或三列;

    • 响应式设计——根据浏览器宽度大小更改元素的尺寸;

    • 自适应设计——根据特定断点更改元素的尺寸;

    • 特异性——如何计算选择器的特异性,以及级联如何影响属性;

    • 适当的命名空间和类命名。

    HTML

    • 知道哪些 HTML 标签最能代表你正在显示的内容以及相关属性,应该掌握手工知识。

    • 语义标记;

    • 标记属性,例如 disabled、async、defer 以及何时使用 data-*;

    • 知道如何声明 doctype(大多数人不是每天都会写新页面,所以可能会忘了这个)以及可以使用哪些元标签;

    • 可访问性问题,例如,确保输入复选框具有更大的响应区域(使用标签“for”)。另外还有 role=“button”、role=“presentation”,等等。

    系统设计

    • 在系统设计方面,通常涉及 MapReduce、分布式键值存储系统或 CAP 定理等知识。虽然前端工程师日常不需要深入了解如何设计这类系统,但在被要求设计出常见应用程序的前端架构时,你也不应该感到惊讶。这些问题通常含糊不清,比如“设计一个像 Pinterest 这样的网站”或者“如何构建购物结账服务?”。以下是需要考虑的知识点:

    • 渲染——客户端渲染(CSR)、服务器端渲染(SSR)和全局渲染;

    • 布局——如果你正在设计被多个开发团队使用的系统,需要考虑进行组件化,以及是否需要开发团队通过指定标记来使用组件;

    • 状态管理,例如在单向数据流或双向数据绑定之间做出选择。你还应该考虑你的设计是采用被动式还是反应式编程模型,以及组件如何相互关联,例如是 Foo->Bar 还是 Foo->Bar;

    • 异步——你的组件可能需要与服务器进行实时的通信。在设计时需要考虑使用 XHR 或双向调用。如果你的面试官要求你支持旧浏览器,那么你需要在隐藏 iFrame、script 标签或 XHR 之间做出选择。如果没有,你可以建议使用 websocket,或者使用服务器发送事件(SSE),这样会更好;

    • 关注点分离——Model-View-Controller(MVC)、Model-View-ViewModel(MVVM)和 Model-View-Presenter(MVP)模式;

    • 多设备支持——你的实现是否同时支持 Web、移动 Web 和混合应用程序,还是为每一种场景提供单独的实现?如果你正在构建像 Pinterest 这样的网站,你可能会考虑在 Web 上使用三列,但在移动设备上只使用一列,你的设计将如何处理这个问题;

    • 资产文件交付——在大型应用程序中,独立团队拥有自己的代码库是常有的事。这些不同的代码库可能彼此依赖,每个代码库通常都有自己的管道来发布代码变更。你的设计需要考虑如何基于依赖项进行资产文件的构建(代码拆分)、测试(单元测试和集成测试)和部署。你还需要考虑如何通过 CDN 交付资产文件或者内联它们来减少网络延迟。

    Web 性能

    • 除了通用编程最佳实践之外,你应该期望访问者查看你的代码或设计及其性能影响。它曾经足以将 CSS 置于文档的顶部,而 JS 脚本位于页面底部,但 Web 正在快速移动,你应该熟悉这个领域的复杂性。

    • 关键渲染路径;

    • Service Worker;

    • 图像优化;

    • 延迟加载和捆绑拆分;

    • HTTP/2 和服务器推送的一般含义;

    • 何时预取和预加载资源;

    • 减少浏览器回流以及何时将元素提升到 GPU;

    • 浏览器布局、组合和绘制之间的区别。

    • 数据结构和算法

    这个可能有点争议,但对 Big-O 时间复杂性和常见运行时间(如 O(N) 和 O(N Log N))有一个基本的了解对你来说不会是坏事。单页应用程序现在非常常见,所以了解内存管理等方面的知识是有帮助的。例如,如果你被要求构建客户端拼写检查程序,那么了解常见的数据结构和算法将会让你的任务变得轻松许多。

    我不是说你一定需要念一个计算机学位,但这个行业已经从构建简单的网页转移到了计算机科学。网上有很多资源可以让那个你快速掌握基础知识。

    一般的 Web 知识

    • 你需要掌握一些构成 Web 的技术和范式。

    • HTTP 请求——GET 和 POST 以及相关标头,如 Cache-Control、ETag、Status Codes 和 Transfer-Encoding;

    • REST 与 RPC;

    • 安全性——何时使用 JSONP、COR 和 iFrame。

    参考:https://www.qdfuns.com/article/51714/586e4320fbd35cbe0669c03ca7dff100.html

    相关文章

      网友评论

          本文标题:要掌握的知识

          本文链接:https://www.haomeiwen.com/subject/adnseqtx.html