hr如何面试web前端工程师，该问哪些技术问题 面试Web前端需要注意什么？会面试哪些问题？
\u8d44\u6df1HR\u63ed\u79d8\uff1aWeb\u524d\u7aef\u9762\u8bd5\u6280\u5de7\u6709\u54ea\u4e9bWeb\u524d\u7aef\u9762\u8bd5\u6280\u5de7
Web\u524d\u7aef\u5de5\u7a0b\u5e08\u7684\u9762\u8bd5\u524d\u7684\u51c6\u5907:1. \u81ea\u6211\u4ecb\u7ecd\u51c6\u5907\u4e0d\u540c\u65f6\u95f4\u7248\u672c\u76841 \u5206\u949f\u30013 \u5206\u949f\u7684\u81ea\u6211\u4ecb\u7ecd.\u53cd\u590d\u7ec3\u4e60,\u5e76\u8131\u7a3f,\u4f46\u4e0d\u662f\u80cc\u8bf5.\u56e0\u4e3a\u80cc\u7684\u8bdd\u81ea\u6211\u4ecb\u7ecd\u5c31\u663e\u5f97\u5341\u5206\u7684\u751f\u786c,\u4e00\u5b9a\u8981\u7528\u81ea\u7136\u7684\u8bed\u8a00\u5c06\u81ea\u6211\u4ecb\u7ecd\u8bf4\u51fa\u6765.\u8fd9\u6837\u53ef\u4ee5\u7ed9\u9762\u8bd5\u5b98\u7559\u4e0b\u5f88\u597d\u7684\u7b2c\u4e00\u5370\u8c61.2. \u9884\u6f14\u641c\u7d22\u4e00\u4e9b\u4f60\u5e94\u8058\u7684\u516c\u53f8\u548c\u804c\u4f4d,\u5728\u5bbf\u820d\u91cc\u3001\u5bb6\u91cc,\u5148\u81ea\u5df1\u9884\u6f14\u4e0b,\u53ef\u80fd\u4f1a\u88ab\u95ee\u53ca\u7684\u5404\u79cd\u95ee\u9898\u548c\u7b54\u6848.\u5373\u4f7f\u4f60\u4e0d\u80fd\u731c\u4e2d\u6240\u6709\u95ee\u9898--\u5f53\u7136HR\u4e5f\u4e0d\u4f1a\u9762\u9762\u4ff1\u5230\u3001\u4e00\u76f4\u4e0d\u505c\u7684\u63d0\u95ee,\u6700\u5173\u952e\u8bcd\u7684\u53ea\u6709\u90a3\u4e48\u51e0\u4e2a.\u601d\u8003\u95ee\u9898\u7684\u8fc7\u7a0b\u4f1a\u8ba9\u4f60\u51cf\u8f7b\u7d27\u5f20\u800c\u4e14\u5728\u9762\u8bd5\u65f6\u5fc3\u91cc\u6709\u5e95.3. \u79ef\u6781\u81ea\u6211\u6697\u793a\u5728\u7fa4\u9762\u7684\u65f6\u5019,\u6211\u4eec\u53ef\u80fd\u4f1a\u56e0\u4e3a\u522b\u4eba\u7684\u53d1\u8a00\u800c\u7ed5\u4e71\u4e86\u81ea\u5df1\u7684\u601d\u8def.\u8fd9\u65f6\u5019\u5343\u4e07\u4e0d\u8981\u4e71,\u9002\u5f53\u7684\u505a\u6df1\u547c\u5438\u8c03\u6574\u4e00\u4e0b\u81ea\u5df1,\u505a\u5230\u6c89\u7740\u51b7\u9759,\u6574\u7406\u597d\u81ea\u5df1\u7684\u601d\u8def,\u52aa\u529b\u56de\u5fc6\u81ea\u5df1\u6240\u5b66\u548c\u6240\u638c\u63e1\u7684\u77e5\u8bc6,\u7ed9\u81ea\u5df1\u79ef\u6781\u7684\u5fc3\u7406\u6697\u793a,\u4e00\u53e5\u8bdd:\u76f8\u4fe1\u81ea\u5df1\u80fd\u884c!\u4f60\u662f\u6700\u68d2\u7684.
4. \u9762\u8bd5\u7b80\u5386\u4e00\u5b9a\u8981\u51c6\u5907\u5145\u5206\u9762\u8bd5\u4f60\u7684\u4eba\u53ef\u80fd\u4e0d\u6b621 \u4e2a.\u9884\u5148\u6599\u5230\u8fd9\u70b9.\u5e76\u51c6\u5907\u597d\u4f1a\u663e\u5f97\u4f60\u505a\u4e8b\u6b63\u89c4\u3001\u7ec6\u81f4.\u6ca1\u6709\u6bd4\u5f53\u88ab\u8981\u6c42\u63d0\u4f9b\u591a\u4e00\u4efd\u7b80\u5386\u800c\u4f60\u5374\u6ca1\u6709.\u66f4\u80fd\u8868\u660e\u4f60\u7f3a\u4e4f\u51c6\u5907\u7684\u4e8b\u4e86.\u4f60\u8bf4\u5462?5. \u5b8c\u6574\u800c\u8ba4\u771f\u7684\u586b\u5199\u516c\u53f8\u8981\u6c42\u7684\u8868\u683c\u5c3d\u7ba1\u4f60\u8ba4\u4e3a\u5b83\u4eec\u7528\u5904\u4e0d\u5927\u3001\u5c3d\u7ba1\u4f60\u5e26\u4e86\u7b80\u5386\u6765,\u5f88\u591a\u516c\u53f8\u90fd\u4f1a\u8981\u6c42\u4f60\u586b\u4e00\u5f20\u8868.\u4f60\u613f\u610f\u5e76\u4e14\u6709\u59cb\u6709\u7ec8\u5730\u586b\u5b8c\u8fd9\u5f20\u8868,\u4f1a\u4f20\u8fbe\u51fa\u4f60\u505a\u4e8b\u6b63\u89c4\u3001\u505a\u4e8b\u5584\u59cb\u5584\u7ec8.\u9762\u8bd5\u8fc7\u7a0b:1. \u7ed9\u9762\u8bd5\u5b98\u7559\u4e0b\u6df1\u523b\u7684\u5370\u8c61\u6700\u521d\u548c\u6700\u540e\u7684\u4e94\u5206\u949f\u662f\u9762\u8bd5\u4e2d\u6700\u5173\u952e\u7684,\u5728\u8fd9\u6bb5\u65f6\u95f4\u91cc\u51b3\u5b9a\u4e86\u4f60\u7559\u7ed9\u4eba\u7684\u7b2c\u4e00\u5370\u8c61\u548c\u4e34\u522b\u5370\u8c61\u4ee5\u53ca\u4e3b\u8003\u4eba\u662f\u5426\u6b23\u8d4f\u4f60.\u6700\u521d\u7684\u4e94\u5206\u949f\u5185\u5e94\u5f53\u4e3b\u52a8\u6c9f\u901a,\u79bb\u5f00\u7684\u65f6\u5019,\u8981\u786e\u5b9a\u4f60\u5df2\u7ecf\u88ab\u8bb0\u4f4f\u4e86.\u8981\u8ba9\u4eba\u4ea7\u751f\u597d\u611f,\u5bcc\u4e8e\u70ed\u60c5.\u4eba\u4eec\u90fd\u559c\u6b22\u8058\u8bf7\u5bb9\u6613\u76f8\u5904\u4e14\u4e3a\u516c\u53f8\u81ea\u8c6a\u7684\u4eba.\u8981\u6b63\u89c4\u7a33\u91cd,\u4e5f\u8981\u8868\u73b0\u4f60\u7684\u7cbe\u529b\u548c\u5174\u8da3.2. \u5b66\u4f1a\u81ea\u6211\u8425\u9500\u8425\u9500\u81ea\u5df1\u5341\u5206\u91cd\u8981,\u5c06\u4f60\u6240\u6709\u7684\u4f18\u52bf\u63a8\u9500\u51fa\u53bb,\u5305\u62ec\u4f60\u7684\u6280\u672f\u8d44\u683c,\u4e00\u822c\u80fd\u529b\u548c\u6027\u683c\u4f18\u70b9,\u96c7\u4e3b\u53ea\u5728\u4e4e\u4e24\u70b9:\u4f60\u7684\u8d44\u5386\u51ed\u8bc1\u3001\u4f60\u7684\u4e2a\u4eba\u6027\u683c.\u4f60\u80fd\u5728\u4ee5\u5f80\u4e1a\u7ee9\u7684\u57fa\u7840\u4e0a\u5de5\u4f5c\u5e76\u9002\u5e94\u516c\u53f8\u6587\u5316\u5417?\u8c08\u4e00\u4e0b\u4f60\u6027\u683c\u4e2d\u7684\u79ef\u6781\u65b9\u9762\u5e76\u7ed3\u5408\u4f8b\u5b50\u544a\u8bc9\u5bf9\u65b9\u4f60\u5728\u5177\u4f53\u5de5\u4f5c\u4e2d\u4f1a\u600e\u4e48\u505a.\u5c55\u793a\u4f60\u52e4\u594b\u5de5\u4f5c\u8ffd\u6c42\u56e2\u4f53\u76ee\u6807\u7684\u80fd\u529b,\u5927\u591a\u6570\u4e3b\u8003\u4eba\u90fd\u5e0c\u671b\u627e\u4e00\u4f4d\u6709\u521b\u9020\u529b\u3001\u6027\u683c\u826f\u597d\u3001\u80fd\u591f\u878d\u5165\u5230\u56e2\u4f53\u4e4b\u4e2d\u7684\u4eba.\u4f60\u8981\u5fc5\u987b\u901a\u8fc7\u5f3a\u8c03\u81ea\u5df1\u7ed9\u5bf9\u65b9\u5e26\u6765\u7684\u597d\u5904\u6765\u8bf4\u670d\u5bf9\u65b9\u4f60\u4e24\u8005\u7686\u4f18.
\u4f5c\u4e3a\u4e00\u540dHTML5\u524d\u7aef\u5de5\u7a0b\u5e08\uff0c\u4e3a\u4e86\u5de5\u4f5c\uff0c\u4e3a\u4e86\u5c31\u4e1a\u6211\u4eec\u514d\u4e0d\u4e86\u8981\u53c2\u52a0\u5404\u79cd\u5404\u6837\u7684\u9762\u8bd5\u3002\u4e3a\u6b64\u603b\u7ed3\u4e86\u9762\u8bd5\u524d\u7684\u6ce8\u610f\u4e8b\u9879\uff1a
\u7b2c\u4e00\uff1a\u6ce8\u610f\u81ea\u5df1\u7684\u4eea\u5bb9\u4eea\u8868
\u9762\u8bd5\u4e4b\u524d\uff0c\u4e00\u5b9a\u8981\u518d\u6b21\u4ece\u5934\u5230\u811a\u5730\u5c06\u81ea\u5df1\u7684\u4eea\u5bb9\u4eea\u8868\u68c0\u67e5\u4e00\u904d\u3002\u68c0\u67e5\u65f6\u4e3b\u8981\u5305\u62ec\uff0c\u81ea\u5df1\u7684\u7259\u7f1d\u662f\u4e0d\u662f\u8fd8\u6709\u98df\u7269\u6b8b\u6e23\uff0c\u6240\u4ee5\u4f60\u9700\u8981\u5c31\u8fd1\u627e\u4e00\u4e2a\u536b\u751f\u95f4\uff0c\u5982\u679c\u6ca1\u6709\u536b\u751f\u95f4\u5c31\u8fd1\u627e\u4e00\u4e2a\u89d2\u843d\u4e5f\u662f\u53ef\u4ee5\u7684\uff0c\u4f46\u662f\u5207\u8bb0\u4e00\u5b9a\u4e0d\u8981\u5728\u5927\u5ead\u5e7f\u4f17\u4e4b\u4e0b\u3002\u56e0\u6b64\uff0c\u4e3a\u4e86\u7ed9\u81ea\u5df1\u6574\u7406\u51fa\u7740\u88c5\u7684\u65f6\u95f4\u8bf7\u5728\u7ea6\u5b9a\u65f6\u95f4\u524d20\u5206\u949f\u5230\u8fbe\u3002
\u7b2c\u4e8c\uff1a\u518d\u6b21\u68c0\u67e5\u9762\u8bd5\u65f6\u6240\u9700\u7684\u8d44\u6599\u662f\u5426\u90fd\u5df2\u5e26\u5168
\u8fd9\u4e9b\u8d44\u6599\u4e3b\u8981\u5305\u62ec\uff1a\u8eab\u4efd\u8bc1\u660e\u3001\u5b66\u5386\u6587\u51ed\u8bc1\u660e\u3001\u4e2a\u4eba\u7b80\u5386\u3001\u4ee5\u5f80\u4f5c\u54c1\u7b49\u7b49\uff0c\u5982\u679c\u8fd9\u4e9b\u4e1c\u897f\u9f50\u5168\u4e4b\u540e\uff0c\u9700\u8981\u5bf9\u8fd9\u4e9b\u8d44\u6599\u505a\u4e00\u4e2a\u6574\u7406\u4e0e\u6392\u5e8f\u3002\u56e0\u4e3a\u6ca1\u6709\u54ea\u4e2a\u9762\u8bd5\u5b98\u5e0c\u671b\u770b\u5230\u9762\u8bd5\u8005\u62ff\u51fa\u4e00\u5806\u201c\u83ab\u540d\u5176\u5999\u201d\u7684\u4e1c\u897f\u585e\u7ed9\u4ed6\uff0c\u8ba9\u4ed6\u81ea\u5df1\u518d\u4e00\u9875\u4e00\u9875\u7684\u7ffb\u627e\u81ea\u5df1\u9700\u8981\u7684\u5185\u5bb9\uff0c\u5982\u679c\u8bf4\u8fd9\u4e9b\u8d44\u6599\u5728\u9762\u8bd5\u5b98\u624b\u4e2d\u4e0d\u5c0f\u5fc3\u6563\u843d\u4e00\u5730\uff0c\u7ed3\u679c\u53ef\u60f3\u800c\u77e5\u3002\u8fd9\u6837\u7684\u6c42\u804c\u8005\u5728\u9762\u8bd5\u5b98\u773c\u4e2d\u4e5f\u4e00\u5b9a\u4e0d\u662f\u4e00\u4e2a\u8ba9\u4eba\u653e\u5fc3\u3001\u6709\u6761\u4e0d\u7d0a\u7684\u5458\u5de5\u3002\u5f53\u7136\u5982\u679c\u68c0\u67e5\u65f6\u53d1\u73b0\u8d44\u6599\u6ca1\u6709\u5e26\u5168\uff0c\u4e5f\u4e0d\u8981\u7d27\u5f20\u3002\u53cd\u800c\u4f60\u8981\u5e86\u5e78\u5e78\u4e8f\u53ca\u65f6\u68c0\u67e5\uff0c\u4e5f\u6709\u8db3\u591f\u7684\u65f6\u95f4\u7ec4\u7ec7\u8bed\u8a00\u53bb\u5411\u9762\u8bd5\u5b98\u89e3\u91ca\u3002
\u7b2c\u4e09\uff1a\u9762\u8bd5\u4e4b\u524d\u5c06\u901a\u4fe1\u5de5\u5177\u8c03\u6210\u632f\u52a8\u6216\u5173\u95ed\u72b6\u6001
\u867d\u7136\u8bf4\u9762\u8bd5\u8005\u4e0e\u9762\u8bd5\u5b98\u4e4b\u95f4\u662f\u4e00\u4e2a\u5e73\u7b49\u7684\u5173\u7cfb\uff0c\u4f46\u6bd5\u7adf\u4f60\u662f\u53bb\u4eba\u5bb6\u516c\u53f8\u6c42\u804c\u7684\uff0c\u59cb\u7ec8\u5904\u4e8e\u4e00\u4e2a\u88ab\u52a8\u7684\u72b6\u6001\uff0c\u6240\u4ee5\u6700\u8d77\u7801\u7684\u5c0a\u91cd\u8fd8\u662f\u8981\u505a\u5230\u7684\u3002\u66fe\u7ecf\u6709\u8c03\u67e5\u663e\u793a\uff0c\u5bf9\u4e8e\u9762\u8bd5\u8fc7\u7a0b\u4e2d\u63a5\u7535\u8bdd\u6216\u662f\u88ab\u7535\u8bdd\u6253\u65ad\u7684\u6c42\u804c\u8005\uff0c\u4f1a\u88abHR\u51cf\u5206\u3002
\u7b2c\u56db\uff1a\u7b49\u5019\u9762\u8bd5\u5b98\u65f6\uff0c\u4ed4\u7ec6\u89c2\u5bdf\u591a\u4e86\u89e3\u9762\u8bd5\u516c\u53f8
\u5728\u7b49\u5019\u9762\u8bd5\u5b98\u65f6\uff0c\u53ef\u4ee5\u6697\u81ea\u89c2\u5bdf\u4e00\u4e0b\u516c\u53f8\u7684\u5927\u4f53\u60c5\u51b5\u6bd4\u5982\u5458\u5de5\u7684\u7740\u88c5\u98ce\u683c\u3001\u516c\u53f8\u7684LOGO\u6216\u662f\u8d34\u5728\u5899\u4e0a\u7684\u4f01\u4e1a\u6587\u5316\u3001\u516c\u53f8\u7684\u73af\u5883\u7b49\u7b49\uff0c\u4e00\u6765\u53ef\u4ee5\u5728\u63a5\u4e0b\u6765\u7684\u9762\u8bd5\u8fc7\u7a0b\u4e2d\u8868\u73b0\u51fa\u81ea\u5df1\u5bf9\u516c\u53f8\u7684\u8ba4\u540c\u611f\uff0c\u4e8c\u6765\u4e5f\u53ef\u4ee5\u8ba9\u81ea\u5df1\u5bf9\u6c42\u804c\u516c\u53f8\u591a\u4e9b\u4e86\u89e3\uff0c\u4ee5\u786e\u5b9a\u662f\u5426\u8981\u63a5\u53d7\u8fd9\u91cc\u7684\u5de5\u4f5c\u3002\u5982\u679c\u4f60\u8eab\u8fb9\u6709\u516c\u53f8\u7684\u8d44\u6599\u5ba3\u4f20\u67b6\uff0c\u4e0d\u59a8\u53d6\u4e00\u672c\u7ffb\u770b\u4e00\u4e0b\uff0c\u4e5f\u4f1a\u589e\u52a0HR\u5bf9\u4f60\u7684\u597d\u611f\u3002
\u7b2c\u4e94\uff1a\u653e\u677e\u5fc3\u60c5\uff0c\u4fdd\u6301\u81ea\u4fe1
\u9762\u8bd5\u65f6\u4e00\u5b9a\u8981\u4fdd\u6301\u4e00\u5b9a\u7684\u81ea\u4fe1\uff0c\u8fd9\u6837\u4e5f\u4f1a\u7ed9\u9762\u8bd5\u5b98\u7559\u4e0b\u5f88\u597d\u7684\u5370\u8c61\u3002\u9762\u8bd5\u53ea\u662f\u4f60\u6b65\u5165\u5de5\u4f5c\u7684\u7b2c\u4e00\u6b65\uff0c\u5373\u4fbf\u662f\u5931\u8d25\u4e86\u90a3\u4e5f\u662f\u4eba\u751f\u91cd\u8981\u7684\u7ecf\u5386\u3002\u5931\u8d25\u662f\u4e3a\u4e86\u66f4\u597d\u7684\u8fce\u63a5\u4e0b\u4e00\u4e2a\u6311\u6218\u3002
\u4f5c\u4e3a\u4e00\u540dweb\u524d\u7aef\u5de5\u7a0b\u5e08\u5343\u4e07\u4e0d\u8981\u89c9\u5f97\u61c2\u6280\u672f\u9762\u8bd5\u5c31\u80fd\u4e07\u4e8b\u5927\u5409\u4e86\uff0c\u50cf\u4ee5\u4e0a\u4e94\u70b9\u7ec6\u8282\u6027\u7684\u4e1c\u897f\u4e5f\u662f\u4e00\u5b9a\u8981\u638c\u63e1\u7684\u3002
\u9762\u8bd5\u9898\u7cfb\u5217\uff1a
\u7f51\u9875\u94fe\u63a5
面试前端工程师对我来说是一件非常有意思的事，因为面试过程很大程度上也是自我提升的过程。无论大公司还是小公司，之所以在如何招聘到真正有能力的 前端工程师方面会遇到同样的问题，就是因为负责招聘的那些人不知道自己公司需要什么样的人，结果问问题时也问不到点子上。经过这几年在行业里的摸索，我总 结出了自己的一套很有效的面试前端工程的方法。
有的应聘者说我不好对付，但留给他们这样的印象也并非我所愿。我觉得之所以他们说我不好对付，主要是因为我问他们问题时问得太细了。以前我曾专门写过一些 东西，告诉应聘者怎么才能通过我的面试（Surviving an interview with me）以及优秀的前面工程师应该具备什么样的素质（What makes a good front end engineer?），而我的面试可以说完全是按照那两篇文章的标准进行的。我不会问一些特别偏门的问题，也不认为出几道逻辑题就能考出人的真实水平。我 唯一的想法就是确定你能否胜任我们要招的这个职位。为此，我需要简单地考察如下几个方面。
基本知识
我们生活在互联网时代，你想知道的任何事情几乎都能在15分钟内找到相关信息。可是，能找到信息并不等于你会使用它。我认为所有前端工程师至少都应 该掌握某些基本的知识，才能有效地完成自己的工作。如果一遇到问题，就停下工作上网四处搜索解决方案，怎么可能保证按期完成工作呢？听听，还有谁在说“我 不知道，但我可以上网搜到。”请这些同学把手举起来，让大家认识一下（immediately raises a flag for me.）。下面我列出一些基本的知识点，这些都是我认为一名前端工程师（无论工作年头长短）在没有任何外来帮助的情况应该知道的。
DOM结构——两个节点之间可能存在哪些关系以及如何在节点之间任意移动。
DOM操作——怎样添加、移除、移动、复制、创建和查找节点。
事件——怎样使用事件以及IE和DOM事件模型之间存在哪些主要差别。
XMLHttpRequest——这是什么、怎样完整地执行一次GET请求、怎样检测错误。
严格模式与混杂模式——如何触发这两种模式，区分它们有何意义。
盒模型——外边距、内边距和边框之间的关系，IE 8以下版本的浏览器中的盒模型有什么不同。
块级元素与行内元素——怎么用CSS控制它们、它们怎样影响周围的元素以及你觉得应该如何定义它们的样式。
浮动元素——怎么使用它们、它们有什么问题以及怎么解决这些问题。
HTML与XHTML——二者有什么区别，你觉得应该使用哪一个并说出理由。
JSON——它是什么、为什么应该使用它、到底该怎么使用它，说出实现细节来。
重申一下，上述这些知识点都应该是你应该“想都不用想”的东西。我一开始问的所有问题都是想摸清你对所有这些领域知识的掌握程度。虽然上面列出的这些知识点并没有面面俱到，但我觉得你至少应该掌握这些，才有可能跟我坐到一间办公室里来。
少量提问
我非常赞同面试者问的问题越少越好。反复问应聘者各种问题既不公平，也很无聊。我在任何一次面试中，通常只问三个大问题，但每个问题又会涉及我所能想到的多个方面。回答每个大问题一般要经过几个步骤，这样我就可以在每个步骤中穿插着问一些小问题。比如说：
现在有一个正显示着Yahoo!股票价格的页面。页面上有一个按钮，你可以单击它来刷新价格，但不会重新加载页面。请你描述一下实现这个功能的过程，假设服务器会负责准备好正确的股票价格数据。
这个问题牵扯到一组我想要考察的基本知识点：DOM结构、DOM操作、事件处理、XHR和JSON。如果我要求你对换一种处理股票价格的方式，或者 让你在页面中显示其他信息，就可以把更多的知识点包括进来。对于经验比较丰富应聘者，我也可以自如地扩展要考察的知识范围，最简单像JOSN与XML的区 别、安全问题、容量问题，等等。
我还希望应聘者给出的任何解决方案中都不要使用库。我想看到最原生态的代码，你就当页面中没有包含任何库。你说你对哪个库了解多少多少，但我不能把 关于库的知识作为评判能力的因素，因为库是会随时间变化的。我需要的是真正理解库背后的机制，特别是能够徒手写出一个自己的库的人。
解决问题
做为一名前端工程师，最值得高兴的事莫过于解决同一个问题会有很多种不同的方法，而你要做的就是找出最合适的方法来。我在提问的时候，经常会在应聘 者解释完一种方法后问他们还有没有第二种方法。此时我会跟他们说，假设你的这个方法由于种种原因被否决了，那么你还能不能给出另一种方法。这样做可以达到 两个目的。
首先，可以测试出他们是否在毫无意义地复述书本中的东西。不能不承认，某些人确实有过目不忘的天赋，听他们在那里滔滔不绝地讲，你会觉得他们什么都 明白。可是，只要一跟这些人谈到怎么查找方案无效的原因，以及能否拿出一个新方案来，他们往往就傻眼了。这时候，如果我听到“我不明白这个方案为什么不够 好”之类的反问，心里立刻就明白我的问题已经超出了他们的能力范围，而他们只是想拿自己死记硬背的结论来蒙混过关。
其次，可以测试出他们已经掌握的（还是那句话，“想都不用想”）浏览器技术知识。如果他们对浏览器平台的核心知识有较好的理解，想出解决同一问题的不同方案根本没有那么难。
对一名前端工程师来说，这绝对是最重要的能力。前端工程师在工作中遇到本该如此却并未如此的难题（说你啦，IE6），应该说是一件很平常的事。一个方案无效就无计可施的人，做不了前端工程师。
考核应聘者解决问题能力的另一层原因，与我的个人喜好有关。在搞清楚应聘者知道什么不知道什么之后，我就会想着问一个他们知识领域之外的问题。这样 做的目的，就是想看看他们怎样运用已有的知识解决新问题。在解决问题的每一步，我也准备了一些提示，以防有人会卡壳打艮（在我面前15分钟一言不发，对我 评价这个人毫无帮助）。我真正感兴趣的，是他们能够从上一步前进到下一步。我希望看到一个人就在我眼前学到新知识。
注意：所有问题都与浏览器技术相关。我不相信出几道抽象的逻辑题，就能够考出某人解决Web技术问题的能力。在我看来，这无异于让素描大师画肖像（或者让刘翔跟博尔特同场竞技），没有意义，也得不到任何有价值的信息。
有激情
要成为一名优秀的前端工程师，最重要的莫过于对自己做的事要有激情。我们技能都不是从学校中或者从研讨会上学来的，因此前端工程师必须具备自学能 力。浏览器技术的变化可谓日新月异，所以也只有不断提升自己的技能才做得到与时俱进。我虽然不能强迫谁必须多看博客、不断学习，但想应聘前端工程师的人恐 怕还是必须这么做的。
你怎么知道谁对这种工作有没有激情？实际上非常简单。我只问一个简单的问题：“目前你对什么Web技术最感兴趣？”这个问题永远不会过期，而且也几 乎不可能出错……除非你答不上来。就眼下来说，我希望你对这个问题给出的技术中包括WebSocket、HTML、WebGL、客户端数据库，等等。只有 对Web开发充满激情的人，才会坚持不懈地学习新知识、掌握新技能；这些人才是我真正想要的。当然，我会让他们详细解释自己提到的技术，以保证他们不是随 口说了几个时髦的新词汇。
最后一点
计算机科学或者Web设计方面的知识当然也有用，但那都是基本知识之外的东西。只要基本知识在那儿了，一切就都有了基础，想扩充知识面也不难。可 是，如果等到正式上班以后，还得从头学习基本技能，那种难度是不可同日而语的。另外，高级前端工程师与一般工程师相比，肯定需要掌握更多的技能。而面试几 乎没有经验大学毕业生，同样也会有一套完全不同的程序。我在这篇文章里列出来的都是一些最基本的东西。
对于那些还没有多少面试经验的人，我总是喜欢告诉他们，面试完了只要问自己一个问题就行：你想以后跟这个人在一起共事吗？如果不管为什么，回答是不，那就是不。
绛旓細鍦ㄨ繘琛學eb鍓嶇鐨勭數璇濋潰璇曟椂锛浠ヤ笅鏄垜浣滀负闈㈣瘯瀹樺彲鑳戒細鎻愬嚭鐨勯棶棰橈細1. 鑷垜浠嬬粛锛氳繖鏄潰璇曠殑鍩烘湰鐜妭锛岄氳繃绠鐭殑鑷垜浠嬬粛锛屾垜鍙互鍒濇浜嗚В搴旇仒鑰呯殑娌熼氳兘鍔涘拰涓汉鑳屾櫙锛屽苟褰㈡垚绗竴鍗拌薄銆2. 涓撲笟鎬ч棶棰橈細濡傛灉闈㈣瘯鐨勫紑濮嬮儴鍒嗚繘琛屽緱姣旇緝椤哄埄锛屾垜浼氳繘鍏ヤ笅涓涓幆鑺傦紝鍗虫彁鍑轰笓涓氭ч棶棰橈紝浠ヨ瘎浼板簲鑱樿呯殑涓撲笟姘村钩...
绛旓細Web鍓嶇宸ョ▼甯堢殑闈㈣瘯鍓嶇殑鍑嗗:1. 鑷垜浠嬬粛鍑嗗涓嶅悓鏃堕棿鐗堟湰鐨1 鍒嗛挓銆3 鍒嗛挓鐨勮嚜鎴戜粙缁.鍙嶅缁冧範,骞惰劚绋,浣嗕笉鏄儗璇.鍥犱负鑳岀殑璇濊嚜鎴戜粙缁嶅氨鏄惧緱鍗佸垎鐨勭敓纭,涓瀹氳鐢ㄨ嚜鐒剁殑璇█灏嗚嚜鎴戜粙缁嶈鍑烘潵.杩欐牱鍙互缁欓潰璇曞畼鐣欎笅寰堝ソ鐨勭涓鍗拌薄.2. 棰勬紨鎼滅储涓浜涗綘搴旇仒鐨勫叕鍙稿拰鑱屼綅,鍦ㄥ鑸嶉噷銆佸閲,鍏堣嚜宸遍婕斾笅,...
绛旓細1. 鍩虹鐭ヨ瘑瑕佺墷鍥猴紝闈㈣瘯瀹樺彲鑳戒笉浼氱洿鎺ラ棶锛屾湁鏃跺欎細缁曠潃鍦堝瓙闂紝鏈川杩樻槸鍩虹鐭ヨ瘑銆2. 椤圭洰缁忓巻瑕佹⒊鐞嗗ソ锛屾暣涓」鐩鎶婃彙濂斤紝瀵硅嚜宸辫礋璐ｇ殑鍔熻兘妯″潡瑕佺壒鍒啛鎮夛紝鐢ㄥ埌鐨勬妧鏈兘娣卞叆浜嗚В鍒板師鐞嗐3. 骞虫椂瑕佸绉疮锛屽皢浜嗚В鐨勭煡璇嗗拰鐢ㄧ殑宸ュ叿杩涜缁勫悎锛屽妗嗘灦涔嬮棿鐨勪紭缂虹偣瑕佷簡瑙ｃ4. 瀛︽牎閲屽仛鐨勭鐮斾篃鏄緢閲...
绛旓細鍦╳eb鍓嶇闈㈣瘯涓紝鍑嗗宸ヤ綔鑷冲叧閲嶈銆棣栧厛锛屼綘鐨勭瑪璇曡〃鐜板拰绠鍘嗘妧鏈爤搴斿叿澶囨繁搴﹀拰骞垮害锛屽挨鍏舵槸绠鍘嗙殑棣栭〉锛岃娓呮櫚鍦板睍绀轰綘鐨勬妧鏈壒闀垮拰瀛︿範缁忓巻锛屾湁浜偣浼氭洿鍙楅潚鐫愩傞潰璇曞畼鍙兘浼氶拡瀵笶S6銆佸疄闄呴棶棰樿В鍐崇瓥鐣ャ佹暟鎹粨鏋勫拰绠楁硶绛夌煡璇嗙偣杩涜闅忔満鎻愰棶锛岃繖鑰冮獙鐨勬槸浣犵殑绉疮鍜屽簲鍙樿兘鍔涖傚簲瀵圭瓥鐣ュ寘鎷寔缁涔犲拰瀹炶返銆
绛旓細(1) 鎶婃彙閲嶇偣锛岀畝鎹锋槑浜嗭紝鏉＄悊娓呮锛屾湁鐞嗘湁鎹銆備竴鑸儏鍐典笅鍥炵瓟闂瑕佺粨璁哄湪鍏堬紝璁鍦ㄥ悗锛屽厛灏嗚嚜宸辩殑涓績鎰忔濊〃杈炬竻鏅帮紝鐒跺悗鍐嶅仛鍙欒堪鍜岃璇併傚惁鍒欙紝闀跨瘒澶ц锛屼細璁╀汉涓嶅緱瑕侀銆傞潰璇曟椂闂存湁闄愶紝濡傛灉澶氫綑鐨勮瘽澶锛屽鏄撹蛋棰橈紝鍙嶅掍細灏嗕富棰樺啿娣℃垨婕忔帀銆傝繖涓鐐瑰湪闈㈣瘯鑷垜浠嬬粛鐨勬椂鍊欏挨鍏堕渶瑕佹敞鎰忋(2) 璁叉竻...
绛旓細闈㈣瘯Web鍓嶇姹傝亴鑰咃細1銆佽冨療瀵规柟涓撲笟鐭ヨ瘑锛屾牴鎹鏂圭殑鍥炵瓟鍐嶈繘琛屾繁鍏ユ彁闂傝冨療涓撲笟鐭ヨ瘑杩欑偣宸茬粡鏄叡璇嗕簡銆傚彧鏈変笓涓氱煡璇嗙鍚堜簡锛屾墠鑳芥湁鏈轰細杩涜涓嬮潰鐨勯潰璇曢樁娈点2銆佽闂鏂规劅鍏磋叮鐨勬妧鏈槸浠涔堬紙鎶鏈柟闈級锛岀劧鍚庢牴鎹粬鎵璇寸殑鎶鏈紝娣卞叆鎸栨帢闂笅鍘汇傚洜涓哄湪闈㈣瘯瀹樼湅鏉ワ紝濡傛灉浣犺繛鎰熷叴瓒ｇ殑涓滆タ閮戒簡瑙ｅ緱涓嶅锛屽...
绛旓細涓銆佸熀鏈煡璇 鎴戜滑鐢熸椿鍦ㄤ簰鑱旂綉鏃朵唬锛屼綘鎯崇煡閬撶殑浠讳綍浜嬫儏鍑犱箮閮借兘鍦15鍒嗛挓鍐呮壘鍒扮浉鍏充俊鎭傚彲鏄紝鑳芥壘鍒颁俊鎭苟涓嶇瓑浜庝綘浼氫娇鐢ㄥ畠銆傛垜璁や负鎵鏈鍓嶇宸ョ▼甯鑷冲皯閮藉簲 璇ユ帉鎻℃煇浜涘熀鏈殑鐭ヨ瘑锛屾墠鑳芥湁鏁堝湴瀹屾垚鑷繁鐨勫伐浣溿傚鏋滀竴閬囧埌闂锛屽氨鍋滀笅宸ヤ綔涓婄綉鍥涘鎼滅储瑙ｅ喅鏂规锛屾庝箞鍙兘淇濊瘉鎸夋湡瀹屾垚宸ヤ綔鍛紵鍚惉锛岃繕鏈...
绛旓細鍥炵瓟锛氬鏋滄垜浣滀负Web鍓嶇鐢佃瘽闈㈣瘯鐨勯潰璇曞畼,閭ｄ箞鎴戝氨瑕佽繘琛屽鏂归潰鐨勮冮噺,涓嶄粎鑰冮噺杩欎釜浜虹殑涓撲笟鑳藉姏,涔熻鑰冮噺杩欎釜浜虹殑缁煎悎绱犺川绛夈 绗竴涓棶棰:鑷垜浠嬬粛 杩欐槸闈㈣瘯涓渶甯歌鐨勭涓涓棶棰,骞朵笖鑷垜浠嬬粛鍗佸垎閲嶈,鍥犱负杩欑煭鐭殑浠嬬粛灏嗕細鍦ㄩ潰璇曞畼鐨勮剳娴烽噷褰㈡垚绗竴鍗拌薄,涔熷彲鑳戒細鎴愪负琚潰璇曡呯殑鍒绘澘鍗拌薄銆 绗簩涓棶...
绛旓細web鍓嶇jquery闈㈣瘯棰樻湁鍝簺 甯歌鐨勫嚑涓涓嬶細浠栦滑鐨勭瓟妗堝彲浠ョ櫨搴︽悳銆 1. jQuery 搴撲腑鐨 $() 鏄粈涔堬紵 2. 缃戦〉涓婃湁 5 涓 <div> 鍏冪礌锛屽浣浣跨敤 jQuery鏉ラ夋嫨瀹冧滑锛 3. jQuery 閲岀殑 ID 閫夋嫨鍣ㄥ拰 class 閫夋嫨鍣ㄦ湁浣曚笉鍚岋紵 4. 濡備綍鍦ㄧ偣閫変竴涓寜閽椂浣跨敤 jQuery 闅愯棌涓涓浘鐗囷紵 5. ...
绛旓細Web鍓嶇闈㈣瘯鏀荤暐锛1.绠鍘嗚鍐欏ソ姣曚笟鐢熷鏋滄槸涓嶄細鍐欑殑璇濓紝棣栧厛瑕佸熼壌浼樼鐨勭畝鍘嗘ā鏉匡紝涓瀹氫笉鑳芥潅涔辨棤绔犮傚叧浜庣畝鍘嗘ā鏉垮彲浠ュ鎵惧墠绔笓鐢ㄦā鏉裤傞櫎浜嗘帓鐗堬紝鍓嶇鐨勭畝鍘嗘渶濂芥槸鏈夆斺斿伐浣滅粡楠屽拰宸ヤ綔椤圭洰銆傚鏋滄槸瀹炰範鐢熷彲浠ュ啓涓婅嚜宸辩殑瀛︽牎缁忓巻锛岃繕鏈変竴浜涜瘉涔︼紝鑻辫鍥涘叚绾ц瘉涔︺佸浗瀹惰绠楁満浜岀骇璇佷功銆佹櫘閫氳瘽璇佷功绛夐兘鍙互...
