今天打开微博,发现还有人在做这个游戏,希望TX的童鞋不要介意把一份不标准答案公布出来(如果有必要,我可以删除,呐,校招求职的童鞋,请不要盲目抄写,因为我的答案或许是最差的解题思路哟)。 那么我就先用常规解题思路走一遍,然后按照取巧偷懒的方式跑一遍,开打!开打!

答题网址

http://codestar.alloyteam.com/

第一关

题目描述: 一个中规中矩的登录框,先不看代码,首先什么都不填写,点击提交试试看,诶,提示我们“姓名和邮箱是你的闯关凭证,不能为空”,哦,那么随便填写一个吧,出于对作者的尊重,咱们写个真的吧。^ ^ 填写之后,在点击提交,会提示“打不开?抓一下包看看……”,腾讯组的童鞋只是在过滤不用chrome inspector/fiddle的童鞋嘛。 F12后,继续点击按钮。看到按钮事件会向http://codestar.alloyteam.com/signup地址提交一个POST请求, 而一般的返回结果为:

提示有点太明确了吧,那么看看页面结构吧,发现表单果然有一个字段timestamp隐藏域value木有赋值。

翻看页面内的内联脚本,common.js,没有看到对时间格式的检查相关的函数,那么就默认需求的时间格式是纯数字的毫秒数好了(错了再换格式呗。)

解题答案

第二关

题目描述: 点开题目,明显的是之前让大家眼前一亮的CSS画图,看了一下图形,考察点是椭圆(圆角),图形旋转以及三角形实现。 查看页面源码,发现腾讯童鞋很好心的放了一个参考链接,那么就简单的看一下吧。 http://www.alloyteam.com/2012/10/css3-draw-qq-logo/ 根据图上左边的椭圆给的数据,宽40,高60,那么得到补充规则

而右边的图形,根据60deg等提示得到下面的规则,这部分题不严谨,其实可以单纯的设置border-bottom-color和border-top-color来实现三角形,但是有一个不错的细节点是按照右边的那个点为原点旋转。

解题如下:

第三关

题目描述: 应该是考察快速使用api的的能力以及如何快速完成任务吧。 到坦克战场后,你发现首先你是没有坦克的,那么创建一个好了,编辑你的坦克,发现你的坦克的各种事件都是空的(当然是空的) 翻开文档,发现支持的参数还蛮多的,包括按下按键以及发送消息等,但是真心不想写WASD或者上下左右的事件了…好在腾讯的童鞋也没有较真非要写,而且他们的demo坦克比较菜… 那么我们搞一个固定炮台过关好了,将demo中的开火以及旋转车头复制进你的坦克事件中,坐等过关吧。

第四关

题目描述: 这个大概是对常见问题的掌握和理解吧,多数问题都是大家讨论烂掉吧,不过或许出题人想看一些非主流答案,或者对效率苛刻一下? //完整copy对象,用个简单的实现吧(这道题的出题者想要的是深拷贝的写法^ ^)

JSON.parse(JSON.stringify(arr));

//写一个常规的,这个效率不是最优的,一会再写一篇这个效率的blog吧

s.replace(/(^\s*)|(\s*$)/g, "");

//写一个常规的,这个效率不是最优的,一会再写一篇这个效率的blog吧

s.replace(/(^\s*)|(\s*$)/g, "");

//最后一个利用slice特性将类数组转换

Array.prototype.slice.call(list,0);

第五关

题目描述: 考察分析能力以及简单的数学能力(动态规划),这个页面中的js我加了注释先写在下面吧。 里面有好几处细节写的超级棒!(yin dang,who’s author?)

看完代码,估计你也就知道我文章开头说的如何直接跳过做题一路next了吧… 但是我们还是继续把这个题做完吧,因为蛮好玩的! 实现工具如下:

但是腾讯前端小组的童鞋很机智的在common.js中声明了一个clear的函数,在页面中内联的脚本中把这货干掉了,并且这些都是在闭包中做的… 换言之,少年你直接写脚本搞不定滴水,当然如果你用fiddle之类的代理替换页面的也可以哟! 那么我们来用一种调试的思路快速搞定这些题吧!

先打开chrome调试工具,然后选择source,在当前HTML文档页面中找到压缩成一坨的代码,随便下个断, 然后在下面的Watch Expressions中添加一个变量“log”,然后刷新页面。

不出意外,浏览器中断了吧,查看我们监视的变量“log”的任何一个innerHTML/innerText/OuterHTML/OuterText,发现诸如这样的MD5字符串:”3b3d8a5f33d811ca00cf89bcdf03e6e1”,然后不要客气,复制出来吧。 (注意监视变量名称可以搜索源码中的log.innerHTML前的名称定义)

然后将页面源码中的诸如这样的代码复制出来。 以第一关为例,每一关由于压缩的原因,变量名不一致,但是方法是一致滴!

然后扔到console,回车一下,等待弹出下一关已经打开的提示窗,然后按一下页面中的下一关,继续闯关!

本文写于抑郁的11月中旬,如果冒犯或者损害到原作者的利益或者神马,请邮件告知,第一时间销毁处理。