V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
xiaomajia008
V2EX  ›  程序员

吐槽:jquery 真是给了一些人乱搞的机会~

  •  
  •   xiaomajia008 · 2014-05-12 15:36:54 +08:00 · 7216 次点击
    这是一个创建于 3848 天前的主题,其中的信息可能已经有所发展或是发生改变。
    满篇的$,什么都$,id class element 就这样搞,一点都不考虑以后万一换标签换样式了怎么办?

    校验,全是 append("<span>错误信息</span>"),懒得想也起码在页面上配置一下阿,以后改文字错误信息还找你?错误信息的样式以后怎么定制?

    整个文件看下来乱糟糟一点规划都没有。。。

    更牛的是明明用不到的js也乱引,还好jquery 容错不报错。。。

    我还是建议初涉前端的开发人员慎用。。方便的同时 会让你丢很多东西。
    第 1 条附言  ·  2014-05-13 14:44:02 +08:00
    哎,我从来没说反对用jquery,为啥你们都认为我在吐槽jquery呢?

    难道我的意思不是因为它便利,所以有人胡乱写?

    虽然那样没错。但是给后人维护带来了不便。
    47 条回复    2014-05-13 15:01:36 +08:00
    flynngao
        1
    flynngao  
       2014-05-12 15:50:24 +08:00
    lz是菜鸟?
    qazwsxedc121
        2
    qazwsxedc121  
       2014-05-12 16:06:15 +08:00
    整个js都是这样吧,脑子里有数的人自然会写出靠谱的代码来,想瞎搞的人你给他再严的框架他也能瞎写
    loading
        3
    loading  
       2014-05-12 16:09:55 +08:00 via Android
    您是说我用getElementbyId就不能瞎搞了?

    您是在大公司上班吧,欢迎到我们民间来视察!
    loading
        4
    loading  
       2014-05-12 16:10:46 +08:00 via Android
    #反正以后重(bu)构(guan)
    66beta
        5
    66beta  
       2014-05-12 16:12:22 +08:00
    初涉的应该用吧,学习上手快高级了就写原生了
    jsonline
        6
    jsonline  
       2014-05-12 16:14:01 +08:00   ❤️ 11
    jQuery: 怪我咯?
    ddyy
        7
    ddyy  
       2014-05-12 16:15:52 +08:00
    jquery就是用来写一些外围的东西的,你还打算用它担大梁?
    zakokun
        8
    zakokun  
       2014-05-12 16:17:47 +08:00
    怪jQuery!?
    akfish
        9
    akfish  
       2014-05-12 16:18:49 +08:00
    错的不是菜刀,而是用菜刀的人。
    Ricky123
        10
    Ricky123  
       2014-05-12 16:20:50 +08:00
    都不知道槽点在哪里。。
    learnshare
        11
    learnshare  
       2014-05-12 16:22:09 +08:00
    jQuery 的定位可能不是这个,但它可以这么用。
    jsonline
        12
    jsonline  
       2014-05-12 16:24:19 +08:00   ❤️ 2
    50%以上的JS都是门外汉写的。——鲁迅
    hinobou
        13
    hinobou  
       2014-05-12 16:26:45 +08:00
    感觉jQuery躺枪了
    zythum
        14
    zythum  
       2014-05-12 16:27:52 +08:00
    jQuery: 怪我咯?
    hkongm
        15
    hkongm  
       2014-05-12 16:31:12 +08:00
    工具是死的,人是活的
    sanddudu
        16
    sanddudu  
       2014-05-12 16:38:24 +08:00   ❤️ 1
    @jsonline
    写 JS 的人中,60% 在使用 jQuery,但是之中 50% 的人都是门外汉。 ——白岩松
    xiaomajia008
        17
    xiaomajia008  
    OP
       2014-05-12 16:40:32 +08:00
    我可能没描述好,我是觉得一些代码能组织一下就组织一下。

    第一行 $('#a').xxxx
    第三行 $('#a').xxxx

    连续几行这样的。

    难道就不能先 var a = $('#a');
    然后下面再 a.xxxx?

    再者

    <div id="boxA">
    <p class="abc"></p>
    <p class="abc"></p>
    <p class="abc"></p>

    </div>

    类似这种的
    $('.abc') 满篇都是的,
    没说不可以用,确实能实现效果
    但是多了以后性能问题怎么办呢?

    那么$('#boxA .abc') 这样会不会好点?维护人员也知道是哪里的问题


    练习可以随便搞,公司产品上线的东西可不能随心所欲了。
    soundbbg
        18
    soundbbg  
       2014-05-12 16:41:58 +08:00
    和jquery没有关系,开发本身不太给力。
    Mac
        19
    Mac  
       2014-05-12 17:40:08 +08:00
    LZ你该怪的是HTML标准,尼妹的哪来这么多ID SPAN DIV标签,直接用一图片格式解析不就得了嘛。。。。
    chrisyipw
        20
    chrisyipw  
       2014-05-12 18:03:58 +08:00
    @xiaomajia008 这明显和 jQuery 无关,是开发者的水平问题,不过 jQuery 过于易用、易上手的特性确实导致开发者水平走极端了。
    zzNucker
        21
    zzNucker  
       2014-05-12 18:31:25 +08:00
    叫你们小码农去看下jQuery最佳实践就行了。
    zhouquanbest
        22
    zhouquanbest  
       2014-05-12 19:08:13 +08:00
    jQuery:怪我啰
    xcc7624
        23
    xcc7624  
       2014-05-12 19:22:59 +08:00 via Android
    感觉现在的工具易用性比以前好了许多,随便学几个月就自称程序员,实际上是个码农,其实像我这种菜鸟程序员就应该转行!
    xcc7624
        24
    xcc7624  
       2014-05-12 19:23:43 +08:00 via Android
    感觉现在的工具易用性比以前好了许多,随便学几个月就自称程序员,实际上是个码农,其实像我这种菜鸟码农就应该转行!
    muzuiget
        25
    muzuiget  
       2014-05-12 19:30:40 +08:00
    和 JQuery 没关系,开发者水平问题,用原生接口也会这个德性。
    i8d0g
        26
    i8d0g  
       2014-05-12 21:17:39 +08:00
    同属于乱搞界的 楼主不妨给点干货 怎么写jquery才高端 才不是乱搞
    mtmzorro
        27
    mtmzorro  
       2014-05-12 23:19:05 +08:00
    同LS 有人提到的,开发人员不力不要怪语言、框架。。

    就jQuery而言,推荐 写这代码的人去 看看 http://www.ruanyifeng.com/blog/2011/08/jquery_best_practices.html jQuery 最佳实践。
    soulteary
        28
    soulteary  
       2014-05-13 00:57:30 +08:00
    @xiaomajia008 不满足现状可以让你变的更好,但是只是抱怨却不思考现有方案的益处不利于成长。似乎上面这句话说的太空,那么留三道题给楼主,如你所说:


    ````
    第一行 $('#a').xxxx
    第三行 $('#a').xxxx

    连续几行这样的。

    难道就不能先 var a = $('#a');
    然后下面再 a.xxxx?
    ````


    **Q1:是否有场景下,使用JQ必须重新获取元素。**


    ````
    满篇的$,什么都$,id class element 就这样搞,一点都不考虑以后万一换标签换样式了怎么办?
    ````

    **Q2:且不论这句话语句是否通顺,如果要进行大规模迭代,什么样子的方式可以较为合理的组织代码。**


    ````
    校验,全是 append("<span>错误信息</span>"),懒得想也起码在页面上配置一下阿,以后改文字错误信息还找你?错误信息的样式以后怎么定制?
    ````

    **Q3:这种情况如果该如何回归组件&模块化设计,所谓配置,应该包含哪些要素。**


    三人行必有我师,或许直面所有的问题,逐个解决会让你变的更好。
    chshouyu
        29
    chshouyu  
       2014-05-13 01:12:41 +08:00   ❤️ 2
    “菜刀真是给了一些人砍人的机会~”
    sneezry
        30
    sneezry  
       2014-05-13 01:16:43 +08:00
    @soulteary 又看到认为v2支持md的小伙伴了,喜闻乐见,哈哈
    bakac
        31
    bakac  
       2014-05-13 07:01:33 +08:00
    不靠谱的人写不靠谱的代码, 看来楼主也属于不靠谱的人
    xiaomajia008
        32
    xiaomajia008  
    OP
       2014-05-13 09:26:39 +08:00
    @soulteary

    感谢回复,我也只是就自己看到的问题吐槽而已,因为jquery提供了很方便的东西,所以造成很多人开发的时候不会思考问题。

    Q1:
    当然,有些条件下是需要重新获取元素。

    我这里说的是指这样的:

    <div id="abc"></div>

    $('#abc').bind('click',function(){
    $('#abc').html('')
    $('#abc').xxx
    $('#abc').xxx
    $('#abc').xxx
    })

    还有这样的

    for(var i = 0, i < xxx ; i ++){
    $('#abc').xxxx
    }

    这是让我吐槽的地方,当然如果写原生的也会试这样,跟开发人员水平有关。

    那么我之所以说 jquery 给一些开发人员乱搞的机会,那么看Q2

    Q2:
    满篇都是$.
    再举我上面的例子
    div#abc

    p.pic
    p.pic
    p.pic

    直接上来就是$('.pic'),试问,这样真的保险?
    如果是原生js,会让人那么容易取到?谁能保证其它开发人员不会改class 不会增加 相同的class?
    所以我说,如果要用那么也最好 $('#abc .pic'),这样最起码后面改代码的人知道你获取的是哪些节点。这样你大规模的换代码以这个区域就会失效,否则一直$('.xxx')难免会出错。

    我自己观点还是以id会钩子比较好。

    Q3:

    不说一些模块化配置这么高深的。因为方便,我看到很多人直接

    $('xxxx').append('<div>......</div>')

    append进一大堆东西进去。

    一个最简单的问题,当要换append里面的模板会不会造成要大量改js的时候?
    可以写一些简单的封装函数,可惜我这里情况并没有。。

    有些公司 html js 是分开的。。如果每次更新模板都要找相关的js人员,岂不是太痛苦?

    还是那点,如果是原生js。不会这么方便的 append,最起码你会一个个create,看到大量代码或许你会想到封装起来。

    当然,你也可能偷懒,直接 innerHTML('xxxx')

    但是,又有问题来了。你如果在有事件不会空得元素后面直接innerHTML 会导致事件失效。。这是不是又是一个可以触发开发人员想办法解决的点?

    所以我才会有以上吐槽。
    tobyzw
        33
    tobyzw  
       2014-05-13 09:42:55 +08:00
    LZ吐槽的是“编码规范“
    tititake
        34
    tititake  
       2014-05-13 10:17:25 +08:00
    难道不应该是
    $('#a').xxx1()
    .xxx2()
    .xxx3();
    belin520
        35
    belin520  
       2014-05-13 11:25:47 +08:00
    jQuery:怪我咯?
    miniwade514
        36
    miniwade514  
       2014-05-13 11:55:48 +08:00 via Android
    @xiaomajia008
    17楼,追求性能就不要写 $('#boxA .abc') 这种东西,想表明嵌套关系可以用注释
    xiaomajia008
        37
    xiaomajia008  
    OP
       2014-05-13 12:34:12 +08:00
    @miniwade514 我只是举个例子说实在想$ class 还不如 那样
    t2doo
        38
    t2doo  
       2014-05-13 12:49:50 +08:00
    混口饭吃,能用就行,这么讲究干嘛
    soulteary
        39
    soulteary  
       2014-05-13 13:09:56 +08:00   ❤️ 1
    @xiaomajia008 还是之前的那句回复,额外的不需要多说。

    @tititake 将this链式转送这个是个不错的语法糖,不过可惜po主举例没有提到。(扯远了

    Q1同样存在极限状况,当触发事件不唯一时,click的fn不能保证元素是否还是缓存中的this||e.target,

    Q2简洁、高效、易于维护,一直以来是以奇怪的关系维持在一起的,有时相生,有时此消彼长,原始作者的意图在一次次的迭代后可能不会太清晰,作为维护者唯一的职责就是尽可能的延续他正确的风格,修缮他不正确的地方。

    Q3如果你们公司是如此,那么不妨使用前端渲染的方式逐步迭代掉叫你痛苦的部分,而且如你所愿,定义在统一的模版文件中,或者页面打印config,改动量也不会特别大吧,那么修改掉就好,何必吐槽呢。

    私以为知行合一才是我们这些维护者该做的。

    几年前看到和自己风格迥异的代码,我也会不淡定,不过现在会细心观察别人代码架构和细节的可取之处,他山之石可以攻玉,勉之。
    superbear
        40
    superbear  
       2014-05-13 13:36:50 +08:00
    Jquery是用来吸引新手的,展现javascript的魅力
    Seita
        41
    Seita  
       2014-05-13 13:41:52 +08:00
    我经常

    第一行 $('#a').xxxx
    第三行 $('#a').xxxx

    连续几行这样的。
    nickelchen
        42
    nickelchen  
       2014-05-13 13:52:47 +08:00
    jQuery多省事
    当你要一个个createElement 然后不断的appendChild时,多怀念
    $("<div><input type="text"><span></span>")
    这种东西。
    还有删除一个 node 的父节点时,原生的是要多啰嗦
    node.parentNode.parentNode.removeChild(node.parentNode)
    全部都应该使用jQuery,不要问为什么。
    yolio2003
        43
    yolio2003  
       2014-05-13 14:10:57 +08:00
    壮哉,终于看出来我大jquery的气势啦,没事怪神马jQuery
    towser
        44
    towser  
       2014-05-13 14:20:44 +08:00
    不怪代码猴,怪行业分工不细致。后端代码猴兼写前端就是这个样子。这是社会主义发展的副产物。——孙海英
    jarlyyn
        45
    jarlyyn  
       2014-05-13 14:44:22 +08:00
    1.一般来说,是$('abc').xxx().xxx()这样吧?要么就是 $(xxx).each(function(){$(this).xxx})吧?感觉楼主的场景很少见啊。
    2.$(.xxx)我觉得没问题啊,这个就是类怎么定义的问题了。这玩意至少也要和css里对应的元素定义相匹配。
    gouflv
        46
    gouflv  
       2014-05-13 14:53:36 +08:00
    低端黑, 看不惯代码自己写呗, 吐槽有什么意义
    fundon
        47
    fundon  
       2014-05-13 15:01:36 +08:00
    代码也不是都是一步到位的,吐嘈该吐嘈的,分享该分享的,且看且实践

    https://www.google.com.hk/search?q=jquery+best+practice
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   911 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 25ms · UTC 21:51 · PVG 05:51 · LAX 13:51 · JFK 16:51
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.