zoukankan      html  css  js  c++  java
  • 好的编程习惯(1)

    概述

    我们程序员写代码就是为了给别人看的嘛,所以代码易读性很重要。这里我总结一些看别人代码时觉得不错的习惯,记录下来,慢慢地向他们学习。

    代码换行

    有时候我们会写出很长一行代码,虽然编辑器有换行功能,但是挤在一起会非常难看。

    对于html,一个标签太长了肯定是因为属性多了,所以可以把每一个属性进行换行,如下所示:

    <div
      id="wrapper_wrapper"
      style="display: block;">
    </div>
    

    对于js,由于编辑器不会在多元运算符后面加分号,所以可以在多元运算符后面换行,如下所示:

    (project.name && project.name.toLowerCase().indexOf(this.searchProject.toLowerCase()) !== -1) ||
      (project.creator.username &&
        project.creator.username.toLowerCase().indexOf(this.searchProject.toLowerCase()) !== -1));
    

    需要注意的是,每次换行我们都要缩进一下。另外由于我们会常常换行,所以缩进2个空格比较合适。

    容错

    在方法里面,如果一个函数或者变量声明了,但是没有值,可能就会报错,如下所示:

    const haha = cb => cb();
    
    const haha2 = a => console.log(a);
    
    const haha3 = a => console.log(a.b);
    
    // 执行haha()会报错
    haha();
    
    // 执行haha2()不会报错
    haha2();
    
    // 执行haha3()会报错
    haha3();
    

    由于js是单线程的,所以一旦报错,就不会执行后面的代码了。所以为了增加代码的健壮性,最好在可能报错的地方加上判断:

    const haha = cb => {
      if(typeof cb === 'function') {
        cb();
      }
    }
    // 执行haha()不会报错
    haha();
    
    const haha3 = a => {
      if(a) {
        console.log(a.b);
      }
    }
    // 执行haha3()不会报错
    haha3();
    

    当然,多加的判断肯定会对性能有影响,所以看自己权衡,如果肯定不需要判断就不要加了。

    const

    能用const的时候一定要用const!!!

  • 相关阅读:
    react 和 vue 的优缺点总结
    解决js小数求和出现多位小数问题
    同步循环发请求用promise
    hook中ref使用
    只能输入数字和保留三位的小树
    react添加右键点击事件
    redux
    深拷贝和浅拷贝区别及概念
    pointer-events的css属性。使用该属性可以决定是否能穿透绝对定位元素去触发下面元素的某些行为
    React 使用link在url添加参数(url中不可见)
  • 原文地址:https://www.cnblogs.com/yangzhou33/p/10080743.html
Copyright © 2011-2022 走看看