- JS面向對象基礎
- 函數就是對象，對象就是函數。
- 方法直接調用爲函數，用new調用爲對象。
- JavaScript中沒有類的語法，是用函數閉包（closure）模擬出來的，下面講解的時候還是用C#中的類、構造函數的概念，JavaScript中String、Date等“類”都被叫做“對象”，挺怪，方便初學者理解，不嚴謹。JavaScript中聲明類（類不是類，是對象）。
- Example（寫一個Person對象）:
- function Person() { } //ok,就這麼簡單。
- 如何使用Perosn對象？
- var p=new Person();// “var p” 不是 “Person p”。
- p.Name=‘張三’;//動態語言，所以可以直接寫。
- p.Age=30;
- p.SayHello=function() { alert(‘Hi~’); }
- alert(p.Name);
- alert(p[‘Age’]);//另外一種動態訪問屬性的方式。
注：
閉包：簡單的理解就是在函數（“外部函數”）中又定義了函數（“內部函數”），並且可以在“外部函數”之外，使用“內部函數”。
JavaScript中沒有類的語法，是用函數閉包（closure）模擬出來的，下面講解的時候還是用C#中的類、構造函數的概念，JavaScript中String、Date等“類”都被叫做“對象”，挺怪，方便初學者理解，不嚴謹。JavaScript中聲明類（類不是類，是對象）。
- JavaScript同樣支持this關鍵字
- 構建一個帶參數的Person對象。通過this關鍵字爲對象的屬性賦值。
function Person(name, age) {
this.Name = name;
this.Age = age;
this.ShowInfo = function() {
alert('大家好，我叫' + this.Name + '，今年' + this.Age + '歲了。'); }}
var zjl = new Person('周杰倫', 20);
zjl.ShowInfo();
function Person(name,age)可以看做是聲明構造函數，Name、Age這些屬性也是使用者動態添加了。【var p1 = Person(“周杰倫", 20);//不要丟了new，否則就變成調用函數了，p1爲undefined。】new 相當於創建了函數的一個實例。
- String對象(*)
- length屬性：獲取字符串的字符個數。（無論中文字符還是英文字符都算1個字符。）
- charAt(index)方法：獲取指定索引位置的字符。（索引從0開始）
- indexOf(‘字符串’,startIndex)方法：獲取指定字符串第一次出現的位置。startIndex表示從第幾個開始搜索。
- split(‘分隔符’,limit);//根據分隔符將一個字符串返回爲一個數組。limit表示要返回的數組的最大長度（可自定義）。多個分隔符使用正則表達式：var msg = 'a★b★c☆d☆e#f';var vals = msg.split(/☆|★|#/);alert(vals);
- substr(startIndex,len)//從startIndex開始，截取len個字符。
- substring(startIndex,stopIndex)//從startIndex開始，截取到stopIndex位置（不包括stopIndex所在的字符）。
- toUpperCase()//轉換大寫、toLowerCase();//轉換小寫
- match()、replace()、search()方法，正則表達式相關
舉例：
var uname = new String('a我不h是美女haha10086');
1、charAt用法
alert(uname.length);
alert(uname.charAt(6)); //返回女，不是美,索引從0開始。
alert(uname.indexOf('h', 5)); //從索引爲5的字符開始搜索h,如果在索引爲3的字符前有h,也不予理會。
2、match用法
var reg = /\w+/g;
//當採用全局模式g,的時候直接把所有匹配的元素返回到一個數組當中
var result = uname.match(reg);
alert(result.length);
for (var i = 0; i < result.length; i++) {
alert(result[i]);
}//結果：3 a h haha10086
3、replace
//不要忽略這裏的全局模式g,否則只能匹配第一個符合的元素
//加上g以後，可以吧所有匹配正則表達式的元素都替換
var result = uname.replace(/a/g, 'X');
alert(result);//結果：X我不h是美女hXhX10086
4、match和search方法
//search()方法與indexOf()方法都是返回找到字符串的第一次出現的索引，
//只是search()方法可以用正則表達式，而indexOf()只能寫字符串。
var result = uname.search(/\d{5}/);
var resultIndexof = uname.indexOf('10086');
alert(result);//結果：11
alert(resultIndexof);//結果：11
5、split()用法：
//第一個參數是分隔符，第二個參數是要返回的最大元素個數。
var result = uname.split(',', 3);
alert(result.length);//結果：1
for (var i = 0; i < result.length; i++) {
alert(result[i]);
}//結果：a我不h是美女haha10086
6、substr()用法：
//從索引爲2的字符開始，截取3個字符，索引是從零開始的。
var result1 = uname.substr(2, 3);
alert(result1);//結果：不h是
7、substring()用法：
//從第2個索引開始截取，截取到第3個索引之前。（不包括第3個索引的字符）
var result2 = uname.substring(2, 3);
alert(result2);
- Array對象
- JavaScript中的Array對象就是數組，首先是一個動態數組，而且是一個像C#中數組、ArrayList、Hashtable等的超強綜合體。
- 數組的使用方式：
var names = new Array();//無需初始化長度，動態
names[0] = "tom";
names[1] = "jerry";
names[2] = "lily";
注：在JavaScript中數組時稀疏的。這意味着數組的一下標必須落在一個連續的數組範圍內，只有那些真正存儲在數組中的元素才能夠有JavaScript解釋器只給數組下標爲0和1000的元素分配內存，而並不給下標在0和1000之間的元素分配內存。
a[0]=1;
a[1000]=”this is element 1000”;
- 循環遍歷數組（for循環）：
for (var i = 0; i < names.length; i++) {
alert(names[i]);
}
當然這是假定數組時連續的，而且從0開始的。如果情況不是這樣的，就要重新檢測一下，看看每個元素是否被定義了。例：
for(var i=0;i<names.length;i++)
{
If (names[i])
Alert(names[i])
}
- 循環遍歷數組（forin循環）：類似於c#中的foreach.
for (var i in names) {
alert(names[i]);//如果直接輸出i是什麼？
}
使用forin循環可以遍歷對象的所有屬性。【演示：遍歷window對象】
forin循環其實遍歷的還是key.
- 數組的其他幾種聲明方式：
new Array();
new Array(size);
new Array(element0, element0, ..., elementn);
var arr = [‘China’, 2008, true, ‘Hello’];(推薦。)
arr[0]à'China'
arr[1]à2008
- 刪除數組元素
Delete運算符把一個數組設置爲undefined值，但是元素本身還繼續存在。
要刪除一個元素的方法：
Array.shift()方法刪除數組的第一個元素，Array.pop()方法刪除掉最後一個元素。Array.splice()方法從數中刪除一個連續範圍內的元素。
注：
================Array的其他方法========================
Array.join(“連接字符串”)//將數組中的元素通過指定的“連接字符串”連接起來，返回一個字符串。
Var a={1,2,3};
Var s=a.join();//s=”1,2,3”;
Array.reverse();//將數組中的元素反轉。
Array.sort();//排序
在原數組上對數組進行排序，返回排序後的數組，如果調用sort()時，不傳遞給它參數，那麼它將按照字母順序對數組進行排序。
var a = new Array("banana", "chery", "apple");
a.sort();
var s = a.join('|');
alert(s); //結果：apple | banana | chery
如果將數組按照別的順序，必須將一個比較函數作爲參數傳遞給sort().該函數確定他的兩個參數在排序數組中哪個在前，哪個在後。
SortByAsc(a,b){
return a-b;
}
Array.sort(SortByAsc);
例：
var a = new Array("banana", "chery", "apple","dfg");
a.sort(function(a, b) {
if (a > b) {
return -1;
}
else {
return 1;
}
});
var s = a.join('|');
alert(s); //結果：dfg|chery|banana|apple
concat()方法
能創建並返回一個數組，這個數組包含了調用concat()的原始數組元素，其後跟隨的是concat()的參數。如果其中有些參數是數組，那麼它將被展開，但是注意concat()方法並不能遞歸展開一個元素爲數組的數組。
var a = [1, 2, 3];
var b = a.concat(4, 5);//結果：1,2,3,4,5
var c = a.concat([4, 5]);//結果：1,2,3,4,5
var d = a.concat([4, 5], [6, 7]);//結果：1,2,3,4,5,6,7
var e = a.concat(4, 5, [6, [7, 8, 9]]);//結果：,1,2,3,4,5,6,[7,8,9]
for (var i in b)
{
alert(b[i])
}
slice()方法：返回指定數組的一個片段。
他的參數指定了要返回的片段的起止點。返回數組包含有第一個參數指定的元素和從那個元素開始到第二個參數制定的元素位置的元素，但是並不包含第二個參數所指定的元素。如果參數中只有一個參數，那麼返回的數組將包含從起始位置到原數組結束處的所有元素。如果是負數則是從最後一個元素而言。
var a = [1, 2, 3, 4, 5, 6];
var b = a.slice(0, 3);//結果：1,2,3
var c = a.slice(3);//結果：4,5,6
var d = a.slice(1, -1);//結果：2,3,4,5,
var e = a.slice(-3, -2);//結果：4
splice()方法是插入或刪除數組元素的通用方法。
Splice() 的第一個參數指定了要插入或刪除的元素在數組中的位置。第二個元素指定了要從數組中刪除的元素的個數。如果第二個參數被省略了，那麼將刪除從開始元素到數組結尾處的所有元素。Splice()返回的是刪除元素後的數組，如果沒有刪除任何元素，將返回一個空數組。
var a = [1, 2, 3, 4, 5, 6, 7, 8, 9];
a.splice(4);//結果：a=[1,2,3,4];
a.splice(1, 2);//結果：a=[1,4];
a.splice(1, 1);//結果：a=[1];
splice() 的前面連個參數指定了刪除的數組。這兩個參數之後還可以有任意多個參數，他們指定的是要從第二個參數制定的位置處開始插入的元素。
var a=[1,2,3,4,5];
a.splice(2, 0, 'a', 'b');//結果：a=[1,2,a,b,3,4,5]
a.splice(2, 2, [1, 2], 3);//結果：刪除a,b a=[1,2,[1,2],3,3,4,5]
- Dictionary
- JS中的Array是一個寶貝，不僅是一個數組，還是一個Dictionary，還是一個Stack（棧集合，不能是Dictionary）。
var pinyins = new Array();
pinyins["人"] = "ren";
pinyins["口"] = "kou";
pinyins["手"] = "shou";
alert(pinyins["人"]);
alert(pinyins.人);
- 字典風格的簡化創建方式：
var arr = {“人”:”ren”,“口”:”kou”};//json格式。
- 像Hashtable、Dictionary那樣用，而且像它們一樣效率高。
- 不能直接用for循環遍歷，需要用forin循環。
- Dictionary風格數組的length爲0。所以不能用for遍歷。
注：
只要有了Array你就同時擁有了數組、List、Hashtable。
var arr = new Array();
arr[0] = "tom";
arr[1] = "jim";
for (var i in arr) {//打印出來的是0、1、2……證明了數組用法是Dictionary用法的一個特例而已。
alert(i+arr[i]);
}
- Json對象
- 對象是一個無序的“‘名稱/值’對”集合。一個對象以“{”（左括號）開始，“}”（右括號）結束。每個“名稱”後跟一個“:”（冒號）；“‘名稱/值’ 對”之間使用“,”（逗號）分隔。
- 數組是值（value）的有序集合。一個數組以“[”（左中括號）開始，“]”（右中括號）結束。值之間使用“,”（逗號）分隔。
- 值（value）可以是雙引號括起來的字符串（string）、數值(number)、true、false、 null、對象（object）或者數組（array）。這些結構可以嵌套。
-
- var arr={“name”:”tom”,”age”:18,”email”:’[email protected]’};
- Json格式可以當做一個對象。
- arr.name、arr.age、arr.email
- var arr=[ {"name":"steve","age":18}, {"name":"steve","age":18}];//json對象數組。
- 在Ajax中使用JSON格式傳輸數據非常方便。
例：
====================JSON========================
1.
var personalInfo = { "name": "周杰倫", "age": 20, "address": { "city": "beijing", "country": "China"} };
alert(personalInfo.name);
alert(personalInfo.age);
alert(personalInfo.address.city);
alert(personalInfo.address.country);
2.
var students = [{ "id": "1001", "name": "james" }, { "id": "1002", "name": "bob"}];
for (var i = 0; i < students.length; i++) {
alert(students[i].id + "===>" + students[i].name);
}
- 擴展方法（*）
- 通過類對象的prototype設置擴展方法，下面爲String對象增加quote（兩邊加字符）方法
String.prototype.quote = function(quotestr) {
if (!quotestr) {
quotestr = "\"";
}
return quotestr + this + quotestr;
};
alert("abc".quote()); alert("abc".quote("|"));
- 擴展方法的聲明要在使用擴展方法之前執行。JS的函數沒有專門的函數默認值的語法，但是可以不給參數傳值，不傳值的參數值就是undefined，自己做判斷來給默認值。