在学校敲代码的时候，可能想的是这个功能怎么实现，怎么把这个功能做的很酷，但是到了公司，你会发现代码可能让这个功能实现是一方面。你的代码还需要良好的代码风格、命名约定、可读性、易维护性、性能等等，所以出现了下面的文章（欢迎指出错误，侵删）1命名规则遵循约定，ECMAScript标识符采用驼峰式标识符：指变量、函数、属性或函数参数的名称小驼峰式：第一个单词的首字母小写，后面单词的首字母大写；例如：textHeight是大驼峰大小写：单词的每个字母都大写；eg：TextHeigh1.1变量命名方式：小驼峰命名规则：前缀名词eg：letminCount=10letprice=100注意：全局变量单词全部大写eg：varPRICE=1001.2常量命名方式：所有单词全部大写eg:constPRICE=1001.3Function函数的命名应该能够描述函数和函数命名方式：小骆驼命名命名规范：前缀动词Eg:functiongetHeight(){};functionsetHeight(){};1.4命名方式对于类和构造函数：大驼峰命名约定：前缀名称例如：classPerson{constructor(name){this.name=name;}}varperson=newPerson('dadan');eg:functionPerson(name){this.name=name;}varperson=newPerson('dadan');2注释2.1单行注释说明：单行注释//用法：注释代码（文本）代码之间保留一个空格2.2多行注释说明：多行注释以/*开头，以*/结尾：如果开始/*和结束*/在一行，建议使用单行注释。如果至少有三行注释，第一行是/*，最后一行是*/3松散耦合3.1html/js虽然html和js天生就需要交互，但是有些方法耦合的太紧了，如下/div>';上面的代码有问题。这个错误很难定位，因为首先要看页面源码才能找到插入的HTML，但是找不到，因为是动态生成的，如果改了数据或者布局，也会需要改js，所以html渲染尽量和js分离。3.2css/js有时候css和js耦合的太紧eg:触发焦点时，改styleelement.style.color='red';如果以后需要更改样式表，css和js文件都可能需要修改，不利于开发者维护，所以需要对这两个层次进行明确的划分，让耦合变得更松散，因此如下所示element.className='edit';只修改一个元素的css类，这样js可以改变Style类，但不会直接影响元素的样式。任何显示问题都可以追溯到css而不是js。会好很多吗？3.3应用程序逻辑/事件处理器耦合document.addEventListener('keypress',function(event){if(event.keyCode===13){varvalue=(Math.random()+1)*5;if(value<7){console.log(值);}}});这个事件处理除了应用逻辑，程序还有事件处理。这种方法的问题是双重的。首先，除了通过此事件之外，没有其他方法可以执行应用程序逻辑。如果代码有问题，是调用前有问题还是Problemsinapplicationlogic中有问题？那样会造成调试困难，其次，如果后续的事件需要相同的逻辑，就需要重新copy代码，所以我们需要一个好的解决方案解决方案：将应用逻辑和事件处理器分离，将应用逻辑单独封装成一个函数functiongetValue(value){if(value<7){console.log(value);}document.addEventListener('keypress',function(event){if(event.keyCode===13){varvalue=(Math.random()+1)*5;getValue(value);}});4语义化标签语义化是指从名字一眼就能看出内容是什么，HTML标签是通过易于理解的元素名称和属性名一目了然，内容和作用是什么，有利于代码更好的维护但是说到标签，刚从学校进公司的小白们最能想到的就是div标签+span标签。还记得刚来公司举个例子，从标签的使用，到变量、函数的命名。至于代码之间的规范，无一不让师傅头疼的，因为写代码的时候太随意了，真的太随意了，虽然现在也有点随意。如果让我写一个页面，我可能会使用所有的div标签，甚至标签中的id名称写完后也只会是div1或div2。显然，这样的代码极难维护。如果将标签改为
