Create your own awesome maps

Even on the go

with our free apps for iPhone, iPad and Android

Get Started

Already have an account?
Log In

前端JS规范http://JsLover.com by Mind Map: 前端JS规范http://JsLover.com
5.0 stars - 2 reviews range from 0 to 5

前端JS规范http://JsLover.com

前端JS开发规范

基于jquery框架

1个公站公用的js---base.js

全站全局变量, baseurl, uid, vuid, ...

全站全局方法, StringBulder, getHeadSrc, includeFile, ...

前端组件库

弹出层

选择组件

编辑器

FLASH上传组件

评论组件

分页组件

滚动条加载

文本框自动高度

日期控件

省市区控件

滚动条阅读

排序组件

页面对应js文件

每个页面都需要引用 jquery.js和base.js(通过模板页引用)

每个单页面加载1个页面对应的业务.js

页面中如果有需要调用到其它js文件,在业务.js头部通过includeFile方法引用

命名约定

js目录, /js, /js/lib, /js/lib/nd.uapselector, /js/lib/nd.comment, ..., /js/views, js/views/album/photolist.js, js/views/photoupload.js, ..., /js/jquery.latest.js, /js/base.js

js文件名, 组件(每个组件一个单独目录,nd.组件功能), nd.uapselector/nd.uapselector.js, nd.uapselector/nd.uapselector.css, nd.uapselector/demo.htm, 业务(每个模块一个单独目录,与php views对应), album/photolist.js, album/photoupload.js, 文件名全部用小写

js函数、变量命名, 匈牙利命名法, json或数组,逗号写前面, 变量名在js文件头部分组定义

前后端协作规范

AJAX数据传输格式约定

json传输

格式约定

AJAX方式, $.getJSON, $.post, $.get, $.load

组件、base.js完全由前端人员维护

业务.js文件由前端人员根据通用模板.js创建,定义好主要的变量及功能块

业务模板.js

后端人员实现业务.js中的业务功能

注意项: 1、如果需要添加修改公用方法(或组件),请与前端人员联系 2、根据前端人员提供的业务模板.js 完善主体业务功能 3、前后端业务的区分:复杂交互由前端人员完成,内容展示、分页、添加删除内容等操作由后端人员完成 4、完善的业务模块自觉进行极值测试、多浏览器测试等

删除操作模板

html拼接模板

分页方法模板

组件调用模板

前后端业务界定, 图片展示、消息交互、首页动态交互等复杂交互由前后端人员配合完成, 常见列表、表单提交、删除等业务处理由后端人员完成

momo前端js调整计划

目录结构与文件名规范调整

js文件引用方式优化调整

JS全部置于页面底部

模板页引用公用JS, jquery.lastest.js, base.js

每个页面对应一个业务.js, 文件名基本与php页面对应, 在js文件内部控制需要引用其它js

base.js 完善优化

整理和规范全局公用方法、变量, 对现有功能进行整合, 添加includeFile方法,用于在js文件内引用其它文件

原业务js中冗余方法统一与规范

代码评审,检测修复隐含BUG