web 全栈是目前比较流行的语言, 因为前端较其他语言相比, 简单好学, 而且现在的互联网公司几乎缺少不了 web 前端开发, 行业的需求致使大量的人转型前端, 对于刚学前端的人来讲, 他们缺乏开发经验, 在项目开发中容易出错, 为了使大家少走弯路, 小编综合一批前端程序员, 收集了一些最常见的错误, 供大家学习, 避免掉坑.
一, JQuery 选择器
在一个 html DOM 树中, 进行一个比较复杂的元素选择, 不包含某些文字的带有某某类名的元素的邻居的父元素的...... 然后怎么做? 写一个很复杂的 jQuery 选择器? 打住. jquery 选择器原理是用正则表达式去分解你的选择器字符串 (这一部分叫做 Sizzle), 然后再用内置的一些遍历函数如 prev,next 等 (其实这些函数也是基于 DOM 提供的方法), 去找到你想要的元素. 我会不去盲目地进行 Sizzle 的语义歧义测试, 而是自己根据自己的逻辑去用 prev,next 等去找到自己的元素; 而且退一万步来说, 我也会尽量避免使用复杂的选择器 (之前的方案也有提及), 单位个元素用 ID, 多个元素用类, 绝对高效准确.
二, 基础数据结构与算法
现在有两个不同的 JSON, 比较复杂, 可以参考这里的 DEMO 中返回的 JSON. 要比较它们的差异, 除了用现成的工具如 beyond compare 以外, 如果我们的机器上没有安装这个工具, 能如何较快解决? 作为一个程序员, 一个个对比是不可行的, 对比完也不会有什么收获. 我会把之放进 Excel 中 (如果你机器连这个都没有, 那忽视我), 先排序, 再用二分法去快速定位找到有差异的 JSON 属性, 即使是 1024 个字段的大数据, 也最多 10 次的定位即可找到. 其实算法这东西, 并不是给你一道题目然后把死记下来的内容背出来, 而是当你遇到相应的情景时, 能想到用这个方法去解决.
三, HTTP 协议
现在很多项目中都是用 ajax 去提交 JSON 到后台了, 原始的那种 HTTP 提交已经比较少见 (至少在我的项目中是这样), 但是我们也不能忘记设置 form 的 method,action 的原始提交方式, 因为这个才是表单提交的原型, 有助于我们理解 HTTP 协议, 例如 POST 和 GET 的区别, 理解数据是怎么样从前端到达后端的, 又是怎么样从后端返回到前端. 当你理解了这个, 就可以更好地跟后端进行沟通, 遇到数据上的问题也能较快地定位解决.
四, javascript 作用域
学过好几种的编程语言, 作用域问题都是老生常谈了. 在 javascript 中更是有函数的作用域这一基础知识. 关于这个, 推荐javascript 权威指南. 当时我是把中文的读去再去读英文, 把英文的读完去找图解, 才感觉到把这一点理解清楚的.
五, HTML/CSS DOCTYPE
曾经项目中遇到这样一个问题, 用其他浏览器打开页面是好的, 唯独是 IE8 打开时出奇地慢. 我注意到 IE8 打开时慢但 CPU 消耗并不高, 只是网页空白很久没渲染出来, 可以排除 JS 算法上的问题. 经过细心研读代码发现, 有人把一部分 script, link 等标签放到了 DOCTYPE 的前面. DOCTYPE 是用来告诉浏览器解释整个文档的一套法则的, 一定要放在 HTML 部分的最前面, 先有 script 标签, 那就意味着浏览器已经开始解释了, 后面再有 DOCTYPE 也是没有意义的了. 把 DOCTYPE 放到 HTML 部分的最前面, 一开始提及的问题就解决了.
来源: http://news.51cto.com/art/201808/582425.htm