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 = new Object() 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, {})