一枚菜鸟前端工程师月度工作总结

前言

每个月进行工作总结，有利于自己回顾在这个月完成了什么工作，有哪些地方做的好，想想还能不能做的更好；哪些地方做的不好遇到哪些问题，记录下来，审视自己避免重蹈覆辙。以下从技术、工作、学习上来总结一下自己这个月遇到了什么问题，有哪些感悟以及未来如何去做一个梳理。

技术

在技术上的收获来源于具体的场景和解决的问题。这周遇到了两个问题。一是如果是多条件判断赋值怎么进行优化代码；二是页面左右外边距固定，中间是两列自适应的多个盒子内容，两列之间有20px的外边距怎么实现这个布局。
一多条件判断赋值怎么进行优化代码
在这里，同事给我的建议是通过对象的键值实现

//bad code
let name;
function getName(index) {
  if (index == 'zhangsan') {
    name = '张三'
  } else if (index == 'lisi') {
    name = '李四'
  } else if (index == 'wangwu') {
    name = '王五'
  }
}

//good code 
let obj = {
  zhangsan: {
    name: '张三'
  },
  lisi: {
    name: '李四'
  },
  wangwu: {
    name: '王五'
  }
let name;
function getName(index) {
  name = obj[index].name;
}
}

二是如何实现中间两列自适应
刚开始我的思路是通过calc()这个函数来计算自适应的宽度，不过小组负责人说使用这个方法可能存在性能问题，于是和同事讨论得到了一个更好的解决方案：在外层再包个盒子，给外层盒子50%的宽度，外层父盒子宽度100%，外层盒子的外边距通过子盒子外边距撑开，具体实现代码如下：

<style>
  .wrap {
    box-sizing: border-box;
    padding: 0 100px;
    background-color: pink;
  }
  .wrap .content {
    width: 100%;
  }
  .wrap .item {
    width: 50%;
    float: left;
    margin-top: 10px;
  }
  .wrap .content-area {
    background-color: green;
  }
  .wrap .item:nth-of-type(2n+1) .content-area{
    margin-right: 10px;
  }
  .wrap .item:nth-of-type(2n) .content-area{
    margin-left: 10px;
  }
  .clearfix:after {
    content: ".";
    display: block;
    height: 0;
    visibility: hidden;
    clear: both;
  }
  .clearfix {
    zoom: 1;
  }
</style>

<div class="wrap">
  <div class="content clearfix">
    <div class="item">
      <div class="content-area">1</div>
    </div>
    <div class="item">
      <div class="content-area">2</div>
    </div>
    <div class="item">
      <div class="content-area">3</div>
    </div>
    <div class="item">
      <div class="content-area">4</div>
    </div>
  </div>
</div>

通过这两个问题的解决，打开了我思考问题的门，以前在学校思考解决问题的方法时，只要想出一种解决方案就行了，可是在工作中讲究的是最优的解决方案，给出思考后最好的解决方案。同时，自己写的代码要经过审查，要考虑代码的可读性和优化自己的代码，提高自己代码的性能。

工作

工作上要持有认真负责的态度，要懂得合作，实时保持沟通交流。作为一名合格的前端工程师，不仅仅是完成自己的工作，在工作过程中要和产品经理，UI工程师，后台工程师合作。工作中要和产品经理确认需求，讨论需求可不可行，合不合理，知道这个需求是在什么场景下使用的，解决用户的什么问题；设计上和UI工程师确认这样设计的目的是什么，这样的设计对于代码的实现能不能做到，合不合理，代码实现后和预效果是否保持一致，有没有更好的方式提升用户的体验；实现功能上要和后台工程师确认接口，需要给后台传什么样的接口，参数是什么类型的，同时后台返回什么数据给前端。对用户操作错误后如何友好的给出提示，同时考虑代码的安全性，如何让自己的程序更健壮更安全；这些都是自己在工作中要做到和学习的。

学习

在目前工作的公司学习氛围很浓，每星期都有技术分享和交流会，在交流学习方法时，项目经理的话使我印象很深刻。引用他的话意思就是说学习要讲究方式方法，我们不能只是想学就去找些资料看看就完了，而是要制定自己的学习计划，通过什么标准来衡量自己的学习成果。
我很赞同他的观点，学习要细化自己的学习目标，将一个大的学习计划进行一步一步划分，具体到每季度每个月每周每天要学习什么，同时检验自己的学习成果，以前在学校学习的时候是通过考试来检验自己的学习成果，现在是通过写博客输出，技术交流，技术演讲或者做项目的方式来检验自己的学习成果。

2019年的展望

现在距离2019只有不到十天的时间了，自己2019的学习计划也将被提上日程，相信在2019年自己不仅仅收获技术上和经验上的提升，自己的视野和各项综合能力也能得到进一步发展。