文件命名

页面、js文件命名:采用中划线连接方式,比如说: error-report.html

js文件夹命名:scripts

公共js命名:common.js

文件结构组织

每个页面中中独有的js文件,/scripts文件夹下js文件结构应与页面结构一致

JS语法

变量声明
function doSomethingWithItems(items) {

    var value = 10,    // 注释啊,注释啊,亲
result = value + 10 // 注释啊,注释啊 for (var i=0, len=items.length; i < len; i++) {
doSomething(items[i]);
}
}
所有函数内变量声明放在函数内头部,只使用一个 var,也必须使用var
标准变量采用驼峰标识
var thisIsMyName;
函数声明
var doSomething = function (item) {
// 内容
};
括号对齐

if (condition) {
  doSomething()
}
花括号必须要,即使内容只有一行
在方法之间、单行或多行注释前、逻辑块之间加入空行,增加可读性  
 逗号、分号后留一个空格
var values = [ 1, 2, 3, 4, 5, 6, 7 ],
  i, len; for (i=0, len=values.length; i<len; i++) {
  process(values[i]);
}
字符常量统一使用单引号'
var str = '123';
for-in
var prop;

for (prop in object) {

    // 注意这里一定要有 hasOwnProperty 的判断, 否则 JSLint 或者 JSHint 都会有一个 warn !
if (object.hasOwnProperty(prop)) {
console.log("Property name is " + prop);
console.log("Property value is " + object[prop]);
}
}
switch

switch (condition) {
case "first":
// code
break; case "third":
// code
break; default:
// code
}
switch和括号之间有空格
break之后跟下一个case中间留一个空行
构造函数,大写第一个字母
function Person(name) {
  this.name = name;
}
使用的ID的地方一定全大写
var goodID;
使用的URL的地方一定全大写
var reportURL;
常量采用大写字母,下划线连接的方式
var MAX_COUNT = 10;

页面js代码内部结构组织

在这,首先要说的是,我们是后端人员,在部门刚起步前后端未分离的情况下,负责了页面中js的编码

下面写的在前端看来是些很烂的东西,但路要一步步走,只能在考虑我们工作难度的基础上实现代码的部分规范

真正的前端甚至可以用MVC框架,但我们不可以,在这首先要考虑的是工作量与新人的适应性

页面js代码内部分为4部分

第一部分

<script language="javascript">
//唯一全局变量
var thisPage = {};
</script>

第二部分

/*页面数据复杂初始化或回填*/
(function ($) { //大多数页面此处为空,复杂回填在此进行,每个操作上方用/**/标明功能,内部用//注释 /*美化html控件*/
$(document).myFormElement(); })(jQuery);

第三部分

/*页面方法——基本用于事件绑定*/
(function ($) { //每个函数上方用/**/标明功能,内部用//注释 /*快捷搜索*/
thisPage.quickSearch = function(pageNum){
//内部实现
alert(pageNum);
}; })(jQuery);

第四部分

/*页面方法——事件绑定*/
(function ($) { //每个事件绑定上方用/**/标明功能,内部用//注释 /*搜索按钮点击事件*/
$(".qs").on('click', function(){
myIndex.quickSearch(1);
}) })(jQuery);

互联网部-供应商团队js规范的更多相关文章

  1. 前端开发规范:命名规范、html 规范、css 规范、js 规范

    上周小组的培训内容是代码可读性艺术,主要分享如何命名.如何优化代码排版,如何写好的注释.我们都知道写出优雅的代码是成为大牛的必经之路. 下面感谢一位前端开发小伙伴总结的前端开发规范,通过学习相关开发规 ...

  2. 中小型前端团队代码规范工程化最佳实践 - ESLint

    前言 There are a thousand Hamlets in a thousand people's eyes. 一千个程序员,就有一千种代码风格.在前端开发中,有几个至今还在争论的代码风格差 ...

  3. js规范

    js规范 Array 和 Object 直接量 为了避免这些歧义, 我们应该使用更易读的直接量来声明. var a = [x1, x2, x3]; var a2 = [x1, x2]; var a3 ...

  4. Git常用命令和Git团队使用规范指南

    转自:https://wsgzao.github.io/post/git/ 前言 在2005年的某一天,Linux之父Linus Torvalds 发布了他的又一个里程碑作品——Git.它的出现改变了 ...

  5. 【重点突破】—— Easy Mock的使用及Mock.js规范

    前言:在线使用Easy Mock可视化工具,可以提供快速生成“模拟数据”的持久化服务: Mock.js是一个JS插件,指定了一套规范,而Easy Mock工具就遵循这些规范.  一.Easy Mock ...

  6. 前端开发规范之命名规范、html规范、css规范、js规范

    在学习编程的时候,每次看到那些整齐规范的代码,心里顿时对这个程序员表示点点好感,有时,比如看到自己和朋友写的代码时,那阅读起来就是苦不堪言,所以,一些基本的开发规范是必须的,是为了自己方便阅读代码,也 ...

  7. iOS团队代码规范

    iOS团队代码规范 工程之始可能需要的工具: 1.使用CocoaPods类库管理工具.CocoaPods安装和使用教程. 2.下载安装注释插件VVDocumenter-Xcode. 一.项目结构管理 ...

  8. 腾讯Alloy团队代码规范

    概述 我个人很看重代码规范,因为代码是写给别人看的,按规范写别人才更容易理解.之前苦于没有代码规范的资料,现在在github上面看到了腾讯Alloy团队的代码规范,于是学习了一下,并记录下我自己还没怎 ...

  9. JS规范2

    百度SS Javascript编码规范 1.变量.方法命名必须匹配正则:/^[$_a-zA-Z]\w*$/ /** * 虽然Javascript引擎支持多种格式命名的变量, * 比如下面这样的变量,J ...

随机推荐

  1. python学习之路---day07

    一:先看什么事赋值? 以例子举例说明:. a=[1,2,3,[11,22,33]] b=a print(b) -->b=[1,2,3,[11,22,33]] 01):赋值 浅拷贝:我们创建a时, ...

  2. C++_IO与文件3-用cin进行输入

    接下来讨论的是如何给程序提供数据? cin对象将标准输入表示为字节流. 通常情况下是通过键盘来生成这种字节流 cin对象根据接收值得变量类型,使用其方法将字符序列转换为所需的类型. cin>&g ...

  3. es6 封装一个登录注册的验证滑块

    1,需求分析 滑块从左滑到右,开始滑.结束滑两种状态.两种状态显示的内容和样式的不同. 这是淘宝注册验证滑块的示例图 2,代码分析 const render = Symbol('render') co ...

  4. python-基础学习篇(一)

    python基础学习(一) 不积硅步,无以至千里.基础的学习越加透彻,才能更清楚的理解和分析需求,我贯彻基础学习“永无止境”的理念,故把自学的知识梳理在博客中,基础学习篇无限更新. python介绍 ...

  5. yum lnmp全家桶

    ######################################################### #by:kingle # #use: lnmp # #version:1.0 # # ...

  6. (转)Linux 系统性能分析工具图解读(一、二)

    Linux 系统性能分析工具图解读(一.二) 原文:http://oilbeater.com/linux/2014/09/08/linux-performance-tools.html 最近看了 Br ...

  7. JavaScript设计模式(二) - 单例模式

    什么是单例模式? 单例模式从字面上的理解是不困难的,js上就是指只有一个对象实例. 为什么需要单例模式? 我们可以将一些成员变量封装在一个单例对象中,每次访问这些变量都只能从这个单例对象进行访问,这样 ...

  8. Java反射机制一 概念和简单的使用方法。

    一 概念 java反射机制属于 java动态性之一  ,指的是可以运行时加载,探知,使用编译期间完全未知的类,程序在运行状态中,可以动态的加载一个只有, 名称的类,对于任意一个已加载的类,都能够知道这 ...

  9. 白话SpringCloud | 第十一章:路由网关(Zuul):利用swagger2聚合API文档

    前言 通过之前的两篇文章,可以简单的搭建一个路由网关了.而我们知道,现在都奉行前后端分离开发,前后端开发的沟通成本就增加了,所以一般上我们都是通过swagger进行api文档生成的.现在由于使用了统一 ...

  10. bzoj 3576: [Hnoi2014]江南乐

    Description 小A是一个名副其实的狂热的回合制游戏玩家.在获得了许多回合制游戏的世界级奖项之后,小A有一天突然想起了他小时候在江南玩过的一个回合制游戏. 游戏的规则是这样的,首先给定一个数F ...