javascript编程开发修炼之道
提要文摘附注: 本文的核心内容是围绕javascript前端开发的编程技术要素，来深入地探讨编写高质量的javascript代码的方法、技巧、规范和最佳实践，从而为编写易于维护的Web前端代码打下坚实的基础。
作者：贵源网络
1.javascript基础类库
2.创建静态对象 var obj = {}、window['obj']={};
3.创建实例对象 function fn(){} fn.prototype = {}
4.function对象自执行函数(function(){})()
5.判断对象类型 typeof(obj) == 'number|string|boolean|object|function|undefined'
6.JSON数据传输
7.数组与对象并用
8.ajax数据交互
9.创建common文件
10.类库特效开发
11.运算符与简化写法
12.cookie记录
13.url参数操作
14.正则表达示/expression/
15.扩展内置对象
______________________________________________________
http://www.36ria.com/demo/hover/demo.html
1.javascript基础类库
jQuery.js/jQuery.form.js/jQuery.cookie.js JSON.js FIS.js
2.创建静态对象 var obj = {}、window['obj']={} 、var obj=new Object();
创建对象：
|
以下结果等价 |
||
|
var obj = {} obj.name=‘sn’ |
window['obj']={} obj.name=’sn’ |
var obj = obj.name=’sn’ |
|
var obj = { id:1, } |
window[‘obj’]={ id:1, } |
|
|
主要用途：定义全局变量、当做函数参数调用 |
||
3.创建实例对象
function fn(){} fn.prototype = {}
|
以下结果等价 |
|
|
function fn(){} fn.prototype.set=function(){} |
function fn(){} fn.prototype={ get:function(){} } |
|
主要用途：复杂动能的实现 |
|
4.function对象自执行函数(function(){})()
|
以下结果等价 |
|||
|
(function(){ })() |
(function(){ }()) |
(function(){ |
!function(){} |
|
主要用途：复杂动能的实现 |
|||
5.判断对象类型 typeof(obj) == 'number|string|boolean|object|function|undefined'
typeof 是一个一元运算，放在一个运算数之前，运算数可以是任意类型。
它返回值是一个字符串，该字符串说明运算数的类型。
●
"undefined"——如果这个值未定义或未初始化时；
●
"boolean"——如果这个值是布尔值；
●
"string"——如果这个值是字符串；
●
"number"——如果这个值是数值，
1）true和false将分别被替换为1和0
2）如果是null值，返回0
3) 如果是undefined，返回NaN
●
"object"——如果这个值是对象或null；
●
"function"——如果这个值是函数；
6.JSON数据传输
JSON序列化和反序列化
JSON是“名值对”的集合。结构由大括号'{}'，中括号'[]'，逗号'，'，冒号'：'，双引号'“”'组成，包含的数据类型有Object，Number,Boolean,String,Array, NULL等。
7.数组与对象并用
8.ajax数据交互
//所有 AJAX 请求设置默认
jQuery.ajaxSetup({
dataType: "json",
type: "POST"
});
//当 AJAX 请求开始时，显示“加载中”的指示
jQuery(document).ajaxStart(function () {
jQuery.colorbox({
html: '<div id="loader"><img src="oading.gif"/><span>
正在提交请求...</span></div>',
opacity: 0.3,
overlayClose: false,
escKey: false,
close: ""
})
});
9.创建common文件
实现公共方法的文件，此部分可以由自己平时的积累得到或是知复制别人的代码；
10.类库特效开发
/* 1.键盘提交 */
var form = this.form =
$("#stepForm");
this.form.bind("keypress",
function(event) {
var
key_code = event.keyCode;
if(key_code
== "13" || key_code == 13) {
me.submit();
return
false
}
});
11.运算符与简化写法
12.cookie记录
jQuery.cookie.js
13.url参数操作
14.正则表达示/expression/
15.扩展内置对象
1）使用jQuery库扩展（Math、String、Array、Number）
jQuery.extend(Math, {})
2）扩展jQuery对象
jQuery.extend({});
3.对象合并
jQuery.extend(true, C, {})
jQuery.extend(C, {})