请教如何提高 js 代码水平。

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

V2EX 提问指南

这是一个创建于 3762 天前的主题，其中的信息可能已经有所发展或是发生改变。

一年毕业菜狗，国企基本0经验。最近在面试互联网前端职位，严重感觉经验匮乏。很多公司用到的东西都没用过，写个js，代码写的一塌糊涂，代码结构很挫。跪求，大牛们给些建议。如何快速学会写出漂亮的js模块化代码

代码

前端

模块

25 条回复 • 2014-08-05 14:04:37 +08:00

sohu022

2014-08-04 09:23:24 +08:00

多读书,多看报，少吃零食多睡觉。基本功练到后可以多分析分析优秀的开源项目，会学到很多更有用的东西。

coinxu

2014-08-04 09:26:55 +08:00

如果是前端js，直接看jQuery源码，硬着头皮啃，看不懂google + 搜索别人的jQuery学习笔记

ssyz1988

2014-08-04 09:33:08 +08:00

@sohu022 能给提供一些比较好的开源项目吗？

ssyz1988

2014-08-04 09:33:46 +08:00

@sohu022 能给提供一些比较好的开源项目吗？
@coinxu 我想学一下，如何从面向对象的角度去写js

guitarkitten

2014-08-04 09:40:23 +08:00

secrets of javascript ninja

Navee

2014-08-04 09:41:36 +08:00

平时多折腾一下jQuery,熟悉了js之后可以尝试各种风骚的写法.

ssyz1988

2014-08-04 10:01:43 +08:00

@guitarkitten 这本书是不是没有中文版？我没找到，，

ChiChou

2014-08-04 10:02:14 +08:00

@ssyz1988

带评注的 underscore.js 源代码：
http://underscorejs.org/docs/underscore.html

lijsh

2014-08-04 10:23:07 +08:00

能问下为啥要面试前端吗？

loading

2014-08-04 10:43:09 +08:00 via Android

国企还知道面试？送礼吧！

美工第一！代码能跑就行！

ssyz1988

2014-08-04 10:49:53 +08:00

@lijsh 因为我相对比较喜欢前端，研究生期间包括工作之后，一直没有放弃前端。

ssyz1988

2014-08-04 10:51:05 +08:00

@loading 。。。我是在国企，想去互联网。。

wadee

2014-08-04 11:09:06 +08:00

@zythum 邀请一下。

jiyinyiyong

2014-08-04 11:20:46 +08:00

写 CoffeeScript, 生成 JavaScript..

otakustay

2014-08-04 11:35:49 +08:00

认真写上70W行，还不行建议转行

jings

2014-08-04 11:36:25 +08:00

javascript:R=0; x1=.1; y1=.05; x2=.25; y2=.24; x3=1.6; y3=.24; x4=300; y4=200; x5=300; y5=200; var DI= document.getElementsByTagName("img"); DIL=DI.length; function A(){for(i=0; i<DIL; i++){DIS=DI[ i ].style; DIS.position='absolute'; DIS.left=Math.sin(R*x1+i*x2+x3)*x4+x5+"px"; DIS.top=Math.cos(R*y1+i*y2+y3)*y4+y5+"px"}R++}tag=setInterval('A()',5 );document.onmousedown=function(){clearInterval(tag);for(i=0; i<DIL; i++){DI[i].style.position="static";}}; void(0)

lijsh

2014-08-04 12:01:06 +08:00 via Android

@ssyz1988 按你问题，其实你是会js的，需求都能实现出来，只是写得不优雅，是这个意思吧？

hxgdzyuyi

2014-08-04 12:59:32 +08:00

从头开始写 bootstrap 的 widget。没有头绪就翻源码看看。

前端应该是发展路径很短的，上手的话应该很容易。~ 相信自己，没问题的！

akfish

2014-08-04 13:06:23 +08:00

看lz主要是关心模块化和代码架构问题，大概这么几步
1. 把JS的OOP玩转，可以用CoffeeScript作为辅助能省不少事
2. 在项目里用上动态加载器，RequireJS、SeaJS等
3. 用一些框架开发有一定规模的前端程序，如Backbone.js

设计模式可以了解下，前端用得多的也就是MVP/MVC，别生搬硬套，别天天挂在嘴边，不然设计模式无脑黑分分钟来找你麻烦。
切忌过度设计。

ssyz1988

2014-08-04 14:19:34 +08:00

@lijsh 算是吧。项目经验比较少，写的少。

wolong

2014-08-04 14:42:15 +08:00

读jquery源码，v2上有一个网友卖打印好的jquery代码。
然后试着做一个类似windows桌面的页面，包括拖动图标右键菜单调整窗口什么的。感觉就差不多了。

frankzeng

2014-08-04 15:03:16 +08:00

自己造个轮子呗，每个程序员心中都有一个轮子梦，造轮子对业务没有什么帮助，但是可以提升自己的能力+项目经验+晋级申报

judasnow

2014-08-04 16:08:32 +08:00

读 sicp （完成课后习题）。

zangbianxuegu

2014-08-05 13:24:56 +08:00

@hxgdzyuyi 这个建议不错

zythum

2014-08-05 14:04:37 +08:00

上面说读jQuery源码的都是扯。jQuery都是各种黑科技。不适应初学者的。
你说对初学者说weekmap用重写valueof来实现有用么...
你说对初学者说用getBoundingClientRect来实现offset方法要比一直往上遍历父节点的top,left 来的效率高。但是如果做了transform scale缩放的话计算就不准了（除非orgin是0，0的）。有用么...

这些对初学没有意义。jQuery适合给初学者用。但是不适合给初学者当作范本看源码。

其实和大部分人说的。造轮子是个很好的方式。代码写多了。才能知道为什么需要这么设计。
不是为了设计去设计。生搬硬套不得。