编写可维护的JS 05
5.UI层的松耦合
- 松耦合定义 每个组件尽量独立,修改一个不影响其他的组件
- 将Js从css中抽离 不要使用css表达式,因为浏览器会以高频率重复计算css表达式,严重影响性能,IE9不支持表达式
- 将Css从Js中抽离 Js应只负责添加、移除类,不应该设置style。除了操作运动
- 将Js从HTML中抽离 不要写在标签里,用事件绑定,将Js语句放在外置文件中
- 将HTML从Js中抽离
- 从服务器加载 将模板放在远程服务器
- 简单的客户端模板 在HTML注释中包含模板文件,
type=text/x-my-template的script标签 - 复杂的模板 模板引擎等 handlebars库
6.避免使用全局变量
- 不使用
var会产生全局变量 - 不能跟全局变量重名
- 单全局变量方式
- 命名空间
Y.MyY.Mail - 模块
- YUI模块
- 异步定义模块 AMD define
- requireJs
- CommonJs
- 零全局变量 很少情况下有
编写可维护的JS 05的更多相关文章
- 前端小白想要编写可维护的js
我是一名前端小白,之前没写过多少代码,心里没有代码质量这个概念,人人都说代码是团队的产物,应该将代码写规范,但是我对具体什么样的代码是可维护的是茫然的. 我没写过多少代码,本来好多东西就不咋会,每次给 ...
- 编写可维护的js代码
在工作中,制定一套统一的编码风格,可以提高开发效率,维护起来的也要容易很多,也能避免一些不必要的错误出现. 项目中常用的检查编码风格的工具JSLint.JSHint.JSCS.ESLint,,在这呢, ...
- 编写可维护的JS 01
1.编程风格 缩进层级 使用制表符进行缩进 2个/4个空格缩进 语句结尾 不省略分号 行的长度 不超过80个字符 换行 在运算符后面换行 空行 在以下场景中添加: 方法之间 在方法中局部变量与第一条语 ...
- 编写可维护的JS 06
7.事件处理 //典型用法 function handlerClick(event){ var popup = document.getElementById('popup'); popup.styl ...
- 编写可维护的JS 04
4.变量.函数和运算符 变量 变量声明提前,单var 函数声明 先声明fn再执行 函数声明不应出现在语句块中 函数调用间隔 函数名与左括号间无间隔 立即调用函数 (fuction(){}) 严格模式 ...
- 编写可维护的JS 03
3.语句和表达式 所有语句都应当使用花括号 if else语句 for 循环 while 循环 do...while try...catch...finally 花括号对齐方式 左括号在第一行语句末尾 ...
- 编写可维护的JS 02
2.注释 单行 //单行注释 多行 /* 多行注释 */ /** * 多行注释 * */ 使用注释 使用注释的原则是让代码更清晰 难于理解的代码 难于理解的代码都应添加注释 可能被误认为错误的代码 应 ...
- 如何使用 require.js ,实现js文件的异步加载,避免网页失去响应,管理模块之间的依赖性,便于代码的编写和维护。
一.为什么要用require.js? 最早的时候,所有Javascript代码都写在一个文件里面,只要加载这一个文件就够了.后来,代码越来越多,一个文件不够了,必须分成多个文件,依次加载.下面的网页代 ...
- 如何编写可维护的面向对象JavaScript代码
能够写出可维护的面向对象JavaScript代 码不仅可以节约金钱,还能让你很受欢迎.不信?有可能你自己或者其他什么人有一天会回来重用你的代码.如果能尽量让这个经历不那么痛苦,就可以节省不少时 间.地 ...
随机推荐
- servlet上传图片 服务器路径(转)
1.在servlet中上传图片,上传的文件夹是imge在webroot下,主要代码如下 private void saveImage(HttpServletRequest request, HttpS ...
- Thrift入门 (一)
Install Go to thrift page download thrift. 1 2 3 4 brew install boost ./configure --without-python s ...
- enum flags 枚举Flags标示 位运算符
C#位运算 详见:http://wenku.baidu.com/link?url=4KUNkwuVTm8dwhmPLXeyYytmnDOJnmLG1L2C77kP-rY0On33ksQxwchoTlq ...
- Linux学习笔记1:配置Linux网络和克隆虚拟机并更改配置
一.配置Linux网络 在安装Linux的时候,一定要保证你的物理网络的IP是手动设置的,要不然会在Linux设置IP连通网络的时候会报network is unreachable 并且怎么也找不到问 ...
- oracle 物化视图导入导出报错
1.exp导出报EXP-00008: 遇到 ORACLE 错误 1455,ORA-01455: 转换列溢出整数数据类型 2.imp导入报.注: 表包括 ROWID 列, 其值可能已废弃,不是警告也不是 ...
- ruby on rails出现的问题ActiveModel::ForbiddenAttributesError
首先分清楚我们在搞rails时.看资料和所使用的环境的版本号是否同样.看的资料是rails3.2,电脑配置的环境是4.0,就会出现这样的安全防范措施的问题. 这类问题大多出如今new或者create两 ...
- C#小性能知识
字符串比较 string s = ""; 1) if(s == ""){} 2) if(s == string.Empty){} 3) if (string.I ...
- android入门——Service
简单记录一下四大组件之一的Service的简单实用. 先是最简单的用法,服务的开关,onBind方法的使用 package com.example.wkp.service; import androi ...
- XML CDATA(Mybatis mapper and XML)
Tip:must be followed by either attribute specifications, ">" or "/>". 所有 X ...
- [重写库函数]atoi
算法分析 1. 若字符串开头是空格,则跳过所有空格,到第一个非空格字符,如果没有,则返回0. 2. 若第一个非空格字符是符号+/-,则标记isPositive的真假,这道题还有个局限性,那就是在c++ ...