已挂勿念...公司的前端和设计是这样写代码的... - V2EX
请不要在回答技术问题时复制粘贴 AI 生成的内容
aivier

已挂勿念...公司的前端和设计是这样写代码的...

  •  8
     
  •   aivier Jan 13, 2016 15233 views
    This topic created in 3772 days ago, the information mentioned may be changed or developed.

    截图

    没有力气多说了 - - , 欢迎大家围观截图...

    公司的其他前端说不知道什么是 less ,说 less 用起来麻烦、 CSS 写一行最好看,多行太丑...
    于是每次改其他人的代码都会累到想死的心都有了...还被人吐槽慢 T_T

    换成.NET 或是 JS 的写法,上面的相当于:

    System.FileSystem.Files.Directory.SmallAction.Rename.WithoutExtensionName.DoThisAction("FileName");


    this.document.elements.block.actions.readAction.getElementById('foobar').attribute('foo')

    120 replies    2016-01-20 18:38:15 +08:00
    1  2  
    Mcatt
        1
    Mcatt  
       Jan 13, 2016
    我天。。。
    zhpech
        2
    zhpech  
       Jan 13, 2016   2
    自带的压缩技能牛逼……他们怎么改代码的
    jjplay
        3
    jjplay  
       Jan 13, 2016
    我已窒息
    Pastsong
        4
    Pastsong  
       Jan 13, 2016 via iPad
    他们写 JS 是不是自带混淆的
    yrdr
        5
    yrdr  
       Jan 13, 2016
    我也喜欢一行,也懒得用 less 、 sass ,不过这一行太长了
    doublleft
        6
    doublleft  
       Jan 13, 2016
    看起来复用性这一技能掌握的很好啊哈哈哈哈哈哈哈哈哈
    aivier
        7
    aivier  
    OP
       Jan 13, 2016
    @zhpech 就这样改的...对于他们的查找和理解技能只能膜拜了

    @Pastsong 还好还好,各种缺分号,缩进和变量名莫名其妙而已

    @yrdr 结构复杂,又想不出那么多类名的话,感觉用 less 写起来很方便,也容易理解

    @doublleft 满屏都是“复用”...
    zhpech
        8
    zhpech  
       Jan 13, 2016
    @aivier 我也觉得 Less/Scss 的结构清晰,而且功能也强大,除非超小型的东西,否则找不出不用的理由=_=我只能说,他们的人脑格式处理能力太强了,佩服。
    cpylua
        9
    cpylua  
       Jan 13, 2016 via iPhone
    我就见过公司以前的外包写这样的代码,当时就被雷到了
    nealfeng
        10
    nealfeng  
       Jan 13, 2016   1
    自带保护自己饭碗功能,好评....
    boro
        11
    boro  
       Jan 13, 2016 via iPhone
    这不是手写,一次性导出?
    aitaii
        12
    aitaii  
       Jan 13, 2016
    @nealfeng 精辟 哈哈
    kisnows
        13
    kisnows  
       Jan 13, 2016
    强大。
    只能说强大。
    aivier
        14
    aivier  
    OP
       Jan 13, 2016
    @boro 亲眼所见...手写的...
    learnshare
        15
    learnshare  
       Jan 13, 2016
    要尊重人家的技术修养
    NemoAlex
        16
    NemoAlex  
       Jan 13, 2016
    刚想说这么写其实问题不大,结构还是挺清晰的。
    突然看到选择器里有逗号...
    有逗号!
    有逗号!

    崩溃了
    zeuss
        17
    zeuss  
       Jan 13, 2016
    @zhpech 自带压缩技能 - -
    hahasong
        18
    hahasong  
       Jan 13, 2016
    大神换工作了?
    think2011
        19
    think2011  
       Jan 13, 2016
    肯定用的是超长超宽超长超宽的显示器!!
    itommy
        20
    itommy  
       Jan 13, 2016
    "自带的压缩技能" 戳中笑点 @zhpech
    atan
        21
    atan  
       Jan 13, 2016
    太牛了,居然一屏看不到大括号
    gongpeione
        22
    gongpeione  
       Jan 13, 2016
    我天。。。。一定是用的超宽的显示器!
    tangbao
        23
    tangbao  
       Jan 13, 2016
    我上学期有个老师也是这么写的- -
    viko16
        24
    viko16  
       Jan 13, 2016
    自带命名空间
    subpo
        25
    subpo  
       Jan 13, 2016
    @NemoAlex 有逗号咋了...
    loading
        26
    loading  
       Jan 13, 2016 via Android
    选择器用得不错…这是浏览器复制过来的吧…
    xbb7766
        27
    xbb7766  
       Jan 13, 2016
    眼花了………………
    自带代码加扰防盗版
    aidevs
        28
    aidevs  
       Jan 13, 2016
    visual studio

    ctrl+k+d 自动格式化代码 ,推荐使用
    sneezry
        29
    sneezry  
       Jan 13, 2016
    我在想,如果你们前端知道 css 的 selector 是从右向左匹配的,可能就不会这么搞了吧~这不仅是要累死开发者,同时也要累死浏览器啊~
    zhouyg
        30
    zhouyg  
       Jan 13, 2016
    你们的设计也很牛掰啊
    jarlyyn
        31
    jarlyyn  
       Jan 13, 2016
    看下来也就逗号没有换行啊……
    Tink
        32
    Tink  
    PRO
       Jan 13, 2016 via iPhone
    天才
    itbeihe
        33
    itbeihe  
       Jan 13, 2016
    我天,我相信他们给你的代码一定是格式化后的,这种选择器长度如果是 less 或 sass 生成的我还相信,手写的话,太疯狂了。
    MiguelValentine
        34
    MiguelValentine  
       Jan 13, 2016
    自带混淆+ 1 哈哈哈哈
    ooTwToo
        35
    ooTwToo  
       Jan 13, 2016
    6666
    Niphor
        36
    Niphor  
       Jan 13, 2016
    之前公司的也这么写

    已经固化,你没法改变(除非你是上司,人家又不想走)
    xuhaoyangx
        37
    xuhaoyangx  
       Jan 13, 2016
    因为很多学校是这么教的。
    从来不会换行

    也遇到这种人,每次看他们的 css 我都得自己来吃手动格式化
    songpengf117
        38
    songpengf117  
       Jan 13, 2016
    貌似淘宝店铺的样式代码
    daysv
        39
    daysv  
       Jan 13, 2016
    人肉压缩机
    flyshu
        40
    flyshu  
       Jan 13, 2016
    微微一笑,我这儿的 css 是这样的
    item1{width:100%}
    item2{width:50%}
    ....
    item10{width:10%}
    cst4you
        41
    cst4you  
       Jan 13, 2016
    都是被 Discuz 带坏的.
    yhxx
        42
    yhxx  
       Jan 13, 2016
    这应该不是他们手写的吧。。。
    感觉是编译之后的啊
    yimity
        43
    yimity  
       Jan 13, 2016
    这应该是 Dreamweaver 生成的,然后他们改改吧?或者是以前用 DW 习惯了。
    pangnate
        44
    pangnate  
       Jan 13, 2016
    逗号没什么,格式化一下其实也还好。话说回来为什么需要你来改前端的 css 文件?
    LEFT
        45
    LEFT  
       Jan 13, 2016
    @yrdr 长因为这命名有先天优势呀
    yongd
        46
    yongd  
       Jan 13, 2016
    这个是淘宝和天猫店铺搜索列表模块的样式代码,是编译后的,但也不排除你们的前端直接把代码搬过来进行二次开发的。
    adoyle
        47
    adoyle  
       Jan 13, 2016
    目测是生成好的,然后接手的人不知道源文件的存在,直接在编译后的 .css 继续改下去的...
    不得不说,耐心真好。
    lwbjing
        48
    lwbjing  
       Jan 13, 2016
    哦,我的天。。。
    ZHenJ
        49
    ZHenJ  
       Jan 13, 2016
    看到我左眼和有眼都分开不同方向了
    yzlren
        50
    yzlren  
       Jan 13, 2016
    他的勇气来自哪里
    n6DD1A640
        51
    n6DD1A640  
       Jan 13, 2016
    自带 gzip 。。。
    s0f
        52
    s0f  
       Jan 13, 2016
    我擦。。
    zonghua
        53
    zonghua  
       Jan 13, 2016
    这技能不错
    Andy1999
        54
    Andy1999  
       Jan 13, 2016 via iPhone
    dw 生成的吧
    Chrome 有插件可以格式化 CSS JS
    tobeyouth
        55
    tobeyouth  
       Jan 13, 2016
    跟我刚毕业时第一家公司的风格很像...
    nijux
        56
    nijux  
       Jan 13, 2016
    mufeng
        57
    mufeng  
       Jan 13, 2016
    nanguo
        58
    nanguo  
       Jan 13, 2016
    生成后改的吧,不过看的习惯就没啥了,各有各习惯,不过还是要往 less 这方面发展的
    LioMore
        59
    LioMore  
       Jan 13, 2016
    这看感觉就是在看家谱,伦理关系写得一清二楚,并没什么卵用
    LINAICAI
        60
    LINAICAI  
       Jan 13, 2016
    卧槽,你确定这不是压缩的?
    allce231
        61
    allce231  
       Jan 13, 2016
    @NemoAlex 有逗号不是很正常 ?
    aivier
        62
    aivier  
    OP
       Jan 13, 2016
    @dbfox 在用 WebStorm

    @itbeihe 如楼上所说,从 F12 复制,然后剩下的手动在编辑器里复制

    @songpengf117 是淘宝模板

    @yhxx 亲眼所见是手写...

    @yimity 他们说....多行的写法是给初学者看的→_→当时就凌乱了

    @pangnate 我也是前端...

    @yongd 是设计直接从浏览器里复制粘贴写了一半的让我继续写

    @adoyle 浏览器里复制的

    @Andy1999 浏览器复制的, WS 也可以,但是改起来还是很麻烦
    aivier
        63
    aivier  
    OP
       Jan 13, 2016
    @nanguo 写的人不知道这东西是自动生成的

    @yongd 直接新建的是空的,然后...设计和另一个前端直接在浏览器里复制,越改越乱,然后就扔给我了...

    @flyshu 下班之前临时加了个任务,说是急,我就是这么写的→_→
    evakiss
        64
    evakiss  
       Jan 13, 2016
    浏览器 css 解析器三条黑线
    ivenlee
        65
    ivenlee  
       Jan 13, 2016   2
    怪不得屏幕越做越宽啦。
    如果是为了节约字节的话,请告诉她们有压缩工具。
    如果这是性取向问题,那么就随便吧。毕竟这只是不同的取向问题。
    jarlyyn
        66
    jarlyyn  
       Jan 13, 2016
    @aivier

    替换,把','替换为 ',\r\n'不久好了
    aivier
        67
    aivier  
    OP
       Jan 13, 2016
    @ivenlee 是“他们”,我们公司还是妹子写的代码好看...

    @jarlyyn 选择器太复杂,冲突太多,改起来心塞
    jarlyyn
        68
    jarlyyn  
       Jan 13, 2016
    @aivier

    选择器肯定是越长越容易改好不……

    不行么就 chrome 审查元素直接改。
    aivier
        69
    aivier  
    OP
       Jan 13, 2016
    @jarlyyn
    拿到手的时候会惊喜的发现好多重复的,语法错误,甚至手动修改后选择器把某个地方的样式应用到全局
    tcdw
        70
    tcdw  
       Jan 13, 2016 via Android
    我猜是人家看到别人的网站有这种风格的代码
    认为这本来就是这样写出来的
    而不是机器处理的
    theJian
        71
    theJian  
       Jan 13, 2016
    来来来,和我司前端 PK 一下
    cdxem713
        72
    cdxem713  
       Jan 13, 2016 via iPhone
    和我一起的前端就是这种奇葩,然后我就不让他写 css 了
    kn007
        73
    kn007  
       Jan 13, 2016
    亏写得出来。。。
    nareix
        74
    nareix  
       Jan 13, 2016
    给他们安利下 stylus ,保证用一次就不想再这样写了
    ljy2010a
        75
    ljy2010a  
       Jan 13, 2016
    好像格式化一下
    ilaipi
        76
    ilaipi  
       Jan 13, 2016
    @dbfox 卧槽,这快捷键要两只手一起按??
    Jaylee
        77
    Jaylee  
       Jan 13, 2016
    这个代码看着像是 scss 编译后生成的。
    wy315700
        78
    wy315700  
       Jan 13, 2016
    为了 KPI ,,,
    msg7086
        79
    msg7086  
       Jan 13, 2016
    @ilaipi 可以 (Ctrl-K)(Ctrl-D) 的吧。
    rupert
        80
    rupert  
       Jan 13, 2016 via iPhone
    Less 还没出来之前我也这么干过
    wbsdty331
        81
    wbsdty331  
       Jan 13, 2016
    自带压缩卧槽
    jydeng
        82
    jydeng  
       Jan 13, 2016
    @ilaipi 你可以按着 ctrl ,然后 k => d ,即可。
    loddit
        83
    loddit  
       Jan 13, 2016
    好奇这么多的嵌套, CSS 是什么性能
    Khlieb
        84
    Khlieb  
       Jan 13, 2016
    维护起来肯定是个大麻烦,估计到后面敷衍了事的就多起来了。
    murusu
        85
    murusu  
       Jan 13, 2016
    你司的前端脑力太吊了 233
    TTry
        86
    TTry  
       Jan 14, 2016
    这个选择器的长度和格式应该是 sass 生成出来的代码吧...
    maplerecall
        87
    maplerecall  
       Jan 14, 2016
    可以考虑撕逼…或者选择跳槽……

    或者选一段用 less 重构然后把清晰简单的代码甩他们一脸…
    fuermosi777
        88
    fuermosi777  
       Jan 14, 2016
    自带压缩机 啊哈哈哈哈。。。
    drvtwo
        89
    drvtwo  
       Jan 14, 2016
    @zhpech 哈哈哈,自带压缩
    louk78
        90
    louk78  
       Jan 14, 2016
    自带压缩技能
    warDoggie
        91
    warDoggie  
       Jan 14, 2016
    已收藏图片 准备发同事,作为学习楷模。
    MrEggNoodle
        92
    MrEggNoodle  
       Jan 14, 2016
    - =你确定这真是手写的???
    thinkmore
        93
    thinkmore  
       Jan 14, 2016
    好好珍惜它,从这段代码中可以看出来人家的查找,复用等各方面做的是极好的
    kvwror
        94
    kvwror  
       Jan 14, 2016
    ZeoKarl
        95
    ZeoKarl  
       Jan 14, 2016
    贵公司的人大脑自带格式化工具.
    weiwei202
        96
    weiwei202  
       Jan 14, 2016
    卧槽。。
    20015jjw
        97
    20015jjw  
       Jan 14, 2016
    实力铁饭碗
    aivier
        98
    aivier  
    OP
       Jan 14, 2016
    @kvwror WebStorm 也能格式化...只是改起来麻烦,外加本身一堆重复
    @MrEggNoodle 确实是手写...
    @maplerecall 已经在重构了,不然要累死的结构
    @TTry 没用过 sass ,只用过 less ,这个是他们从浏览器里复制的,也有一部分是手写的
    @murusu 我也是前端,然而没这么...我还是去用 less 好了...
    @tcdw 似乎非常正确
    paxster
        99
    paxster  
       Jan 14, 2016
    表示还是用很原始的写法,偶尔用用 SASS ,我只能说这哥们的写法以及 CSS 的命名和权重啥的写的太乱。。。。
    world
        100
    world  
       Jan 14, 2016
    我有强迫症,改代码的时候如果是一行的,一定会先分行再改,看到这样的代码有一种想打人的冲动
    1  2  
    About     Help     Advertise     Blog     API     FAQ     Solana     3345 Online   Highest 6679       Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 260ms UTC 13:59 PVG 21:59 LAX 06:59 JFK 09:59
    Do have faith in what you're doing.
    ubao msn snddm index pchome yahoo rakuten mypaper meadowduck bidyahoo youbao zxmzxm asda bnvcg cvbfg dfscv mmhjk xxddc yybgb zznbn ccubao uaitu acv GXCV ET GDG YH FG BCVB FJFH CBRE CBC GDG ET54 WRWR RWER WREW WRWER RWER SDG EW SF DSFSF fbbs ubao fhd dfg ewr dg df ewwr ewwr et ruyut utut dfg fgd gdfgt etg dfgt dfgd ert4 gd fgg wr 235 wer3 we vsdf sdf gdf ert xcv sdf rwer hfd dfg cvb rwf afb dfh jgh bmn lgh rty gfds cxv xcv xcs vdas fdf fgd cv sdf tert sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf shasha9178 shasha9178 shasha9178 shasha9178 shasha9178 liflif2 liflif2 liflif2 liflif2 liflif2 liblib3 liblib3 liblib3 liblib3 liblib3 zhazha444 zhazha444 zhazha444 zhazha444 zhazha444 dende5 dende denden denden2 denden21 fenfen9 fenf619 fen619 fenfe9 fe619 sdf sdf sdf sdf sdf zhazh90 zhazh0 zhaa50 zha90 zh590 zho zhoz zhozh zhozho zhozho2 lislis lls95 lili95 lils5 liss9 sdf0ty987 sdft876 sdft9876 sdf09876 sd0t9876 sdf0ty98 sdf0976 sdf0ty986 sdf0ty96 sdf0t76 sdf0876 df0ty98 sf0t876 sd0ty76 sdy76 sdf76 sdf0t76 sdf0ty9 sdf0ty98 sdf0ty987 sdf0ty98 sdf6676 sdf876 sd876 sd876 sdf6 sdf6 sdf9876 sdf0t sdf06 sdf0ty9776 sdf0ty9776 sdf0ty76 sdf8876 sdf0t sd6 sdf06 s688876 sd688 sdf86