陣列
陣列,實際上就是將一大堆相似的資料有秩序的放在格子箱中,十分像藥房裡的那些櫃子.
| 資料1 | 資料2 | 資料3 | 資料4 | 資料5 | 資料6 |
用程式碼建立陣列
var arr = new Array();//Array和Date一樣,也是一個內建物件,需要使用new運算子建立 arr[0]="資料1";//向陣列中新增一個元素,陣列中的元素是有編號的,並且要注意的是,編號從0開始 //上面一行程式碼就向陣列中的第一個箱新增了一個元素 arr[1]="資料2";//方括號用以指定下標1 arr[2]="資料3"; arr[3]="資料4"; arr[5]="資料6"; arr[4]="資料5"; alert(arr);//將會輸出"資料1,資料2,資料3,資料4,資料5,資料6" 是以逗號分隔的字串 //並且這些字串的連線是按(下標)順序的 alert(arr[0]);//當然,我們也可以直接訪問其中第一個元素 alert(arr[1]);//第二個 alert(arr.length);//遇到的第一個陣列物件的屬性,length屬性用以表示陣列中元素的個數,輸出6
遍歷陣列 for 迴圈
for (var i=0;i< arr.length;i++) { arr[i]+=" ---changed";//將陣列中每個元素(字串)後面連上一個" ---changed" } alert(arr);//變了
建立陣列的其它方式
var arr; arr = new Array();//這樣建立了一個空陣列 alert(arr);//輸出為空,因為沒有元素 arr = new Array(3);//在申明時只放一個正整數表示陣列的長度 alert(arr.length);//輸出3 alert(arr);//輸出兩個逗號,它裡面放了3個空元素 //申明時指定了陣列的長度,然後修改指定位置的值 arr[2]="end";//將最後一位修改為"end" alert(arr); //並不是在陣列申明時指定了長度就不能更改,更改長度很簡單 arr[8]="super";//陣列長度將自動增長到8 //記住,JavaScript中陣列長度會自動增長,並且length屬性會自動更新 alert(arr.length);//輸出9,JavaScript中陣列下標是從0開始的 alert(arr[8]); //也可以在建立陣列時就指定值 arr = new Array(1,2,3,4,5,6,7,8); alert(arr); //如果在建立陣列時只指定一個值,並且是正整數 arr = new Array(6);//將得不到預期效果,因為這是在宣告一個長度為6的空陣列 //需要這樣 arr = new Array(); arr[0]=6; //還可以使用陣列字面量的方式 arr = [];//是的,一個空中括號 //與下面一句幾乎是等價的 arr = new Array(); //但更靈活和簡便 arr =[3];//將建立一個長度為1,第一個元素為3的陣列 arr = [2,3,4,6];//多個元素以逗號分隔 alert(arr[0]);//輸出2,下標的順序與在中括號中出現的順序相關 //陣列中可以混合存放字串,數值,布林值...,幾乎所以型別的值,包括陣列 arr = new Array(1,0,true,"some string",new Array("a",3));//第五個元素放的是一個陣列 alert(arr[4]);//輸出"a",3 alert(arr[4][0]);//輸出"a"
陣列的按引用傳值的特性
var arr = [2,3,4] ; var arr2 =arr;//這相當於給arr取了個別名 arr2[0]=234; alert(arr[0]);//輸出234,因為arr與arr2是同一個物件
向陣列中新增,刪除元素(push,delete)
var arr = [2,4]; arr.push(6);//push方法將元素新增到陣列未尾 alert(arr.length);//輸出3 arr.push("a","b");//可以一次新增多個元素 alert(arr.length);//輸出5 alert(arr[5]);//輸出"b" alert(arr.push(123));//push方法執行後會返回陣列的新長度值,輸出6 //事實上將元素新增到陣列未尾的最簡單的方法是 arr = [4,5]; arr[arr.length]="new element";//利用陣列長度自動增長的特性 alert(arr.length);//輸出3 //為了更明瞭的明白push的工作原理,我們可以使用一個簡單的自定義函式來完成這項工作 function array_push(element,arr) {//第一個引數為要新增的元素,第二個引數為該陣列 arr[arr.length]=element; return arr.length; } arr = [1,2,3]; array_push(345,arr); alert(arr.length);//輸出4 alert(array_push("some string",arr));//輸出5 alert(arr); //刪除一個元素 arr = ["#","$","%"]; alert(arr); delete arr[2]; alert(arr); alert(arr.length);//元素被刪除了,但陣列長度並沒有變化,因為這樣能使我們使用相同的下標訪問以前的元素 //使用delete與下面的語句效果一樣 arr = ["#","$","%"]; alert(arr); arr[2]=undefined;//undefined是一個值 alert(arr);
join方法,返回陣列中的所有元素以指的分隔符間隔的字串
var arr = [2,3,4]; alert(arr.join("#")); //事實上當我們直接輸出陣列時,系統會自動呼叫這樣的方法 alert(arr); alert(arr.join(","));//兩句的輸出效果是一樣的
物件
物件是一堆屬性的集合,其實它和陣列是相通的
var obj = new Object();//建立一個物件 obj.property = "value";//使用點語法給物件新增屬性 alert(obj);//只會輸出含糊的[object Object] alert(obj.property);//真正的資料全儲存在它的屬性上面
物件嗎?就當和現實中的物件一樣:一個"人"物件
var person = new Object(); person.age = 18; person.weight = "123kg"; person.height = "170cm"; person.arm = 2;//兩個臂膀 person.leg = 2;
上面建立的物件,描述了現實中的人的一些特性:年齡 18;重量 123kg;身高 170cm;不是殘疾(這個是我推斷的); 其實陣列也能完成這樣的工作
var person = new Array(); person[0] = 18; person[1] = "123kg"; person[2] = "170cm"; person[3] = 2; person[4] = 2;
但是這樣的表達方式,沒人能看出這是一個"人"物件,使用數字下標沒有物件的屬性明瞭,程式碼難於理解. 其實陣列可以使用字串下標的
var person = new Array(); person["age"] = 18;//注意,中括號裡的下標是一個字串,所以需要使用引號 person["weight"] = "123kg"; person["height"] = "170cm"; person["arm"] = 2; person["leg"] = 2;
我說過了,陣列和物件是相通的
var arr = new Array(); var obj = new Object(); alert(typeof arr);//object alert(typeof obj);//object
所以,陣列用字串下標,事實上也是在給其新增屬性
var arr =[1,2,3]; arr["property"]="some data"; alert(arr.property);//"some data" //但注意的是,陣列的length屬性只能報告具有數字下標的元素的個數 alert(arr.length);//3
而物件也可以使用類似語法訪問它的屬性
var obj = new Object(); obj.property = "some data"; alert(obj["property"]);//"some data" //當然也可以使用數字下標 obj[1]=123; alert(obj[1]);//123 alert(obj.property);//"some data" alert(obj.length);//但與陣列不同的是,它沒有length屬性
與陣列字面量相對應的,也有物件字面量的宣告方式
var obj = { a:123,//這裡的a,b等同樣是物件的屬性名 b:456 //注意,最後沒有逗號 }; alert(obj.a); alert(obj.b); //還可以這樣寫 obj = { "a":345, //雖然如果用引號引起來就可以使用空格等不符合變數命名規範的字元,但強烈不推薦 "b":333 }; alert(obj.a);//345
對於陣列,我們可以使用for對其進行遍歷,但for迴圈只能遍歷具有數字下標的元素
var arr =[1,2,3,4]; arr["stringIndex"]="some data";//這個不會被遍歷到 alert(arr.length);//arr.length屬性也不報告包含此元素 for (var i=0;i< arr.length;i++) { alert(arr[i]);//i只會是數字,所以不能遍歷字串下標的元素 }
我們之前看到,對陣列使用字串下標實際上是給這個陣列物件新增屬性,這個時候我們會發現,物件的屬性還沒有什麼好的方法列舉出來,for.. in...迴圈出現了 (對於研究物件,for in迴圈太有用了)
var obj={ age:12, height:170 }; for (var i in obj) {//i將會被列舉為鍵名,就是所說的字串的下標 alert(i+"\n"+obj[i]);/*將會以類似 age 12 這樣的格式分別輸出它的鍵名鍵值對 */ }
for in 迴圈不但是用來遍歷物件屬性,它也可以遍歷出陣列的具有數字下標的元素
var arr = [1,2,3,4,5,6]; arr["property"]=78;//會被遍歷到,因為它是屬性 for (var i in arr) { alert(i+" : "+arr[i]); }
瞭解這些之後,我們可以使用它們來儲存一些資料:一個班的學生的成績(該用陣列還是物件呢?這確實是一個問題)
//該是物件就是物件,該是陣列就是陣列 var myClass=[];//建立一個陣列,放置每個學生的資訊,以學生的學號作為陣列下標 myClass[1]={ "name":"HUXP", "Chinese":60, "English":70, "Math":80, "Grade":"C" }; myClass[2]={ "name":"發哥", "Chinese":80, "English":80, "Math":80, "Grade":"B" }; myClass[3]={ "name":"Per", "Chinese":66, "English":77, "Math":88, "Grade":"B" }; myClass[4]={ "name":"小虎子", "Chinese":60, "English":60, "Math":770, "Grade":"C" }; myClass[5]={ "name":"DBD", "Chinese":70, "English":70, "Math":70, "Grade":"B" }; myClass[6]={ "name":"○", "Chinese":77, "English":77, "Math":80, "Grade":"B" }; myClass[7]={ "name":"Me", "Chinese":100, "English":100, "Math":100, "Grade":"A", "Saying":"哇哈哈!" }; //當然,做了這些還沒什麼意義 alert(myClass[5].Chinese)//如果有學號,輸出對應學號的學生的語文成績太簡單了 //更復雜的,搜尋學生姓名,返回他的所有資訊,是使用函式的時候了 function searchByName(name) { for (var i=1;i< myClass.length;i++) { if (myClass[i].name == name) { return myClass[i]; } } } alert(searchByName("○").Math);
String物件以及一些用於字串的方法和屬性
建立String物件
var str = new String(); alert(str);//輸出空字串 str = new String("some string here"); alert(str);//輸出字串"some string here" //表面上看,這和直接建立的字串是一樣的效果 str = "some string here"; alert(str);
但由於使用new String();所以建立出來的是物件
var str = new String(); alert(typeof str);//object //因為是物件,所以自然有很多屬性和方法 //但字串本身也存這樣的方法
有很多用於處理字串的方法以及一些屬性
- length 屬性,返回字串的長度
- indexOf 方法,返回字串內第一次出現子字串的字元位置
- lastIndexOf 方法,返回字串中子字串最後出現的位置
- charCodeAt 方法,返回一個整數，代表指定位置上字元的 Unicode 編碼
- fromCharCode 方法,從一些 Unicode 字元值中返回一個字串
- replace 方法,進行文字替換,返回替換後的字串的複製
- substr 方法,返回一個從指定位置開始的指定長度的子字串
- substring 方法,返回位於 String 物件中指定位置的子字串
- toLowerCase 方法,返回一個字串，該字串中的字母被轉換為小寫字母
- toUpperCase 方法,返回一個字串，該字串中的所有字母都被轉化為大寫字母
- split 方法,把字串分割為字串陣列。
var str ="some string here"; alert(str.length);//16 alert(str.indexOf("s"));//0,字串的位置從0開始計數 alert(str.indexOf("o"));//1 alert(str.indexOf("k"));//沒有找到時返回-1 alert(str.lastIndexOf("e"));//15,從後往前查詢 alert(str.charCodeAt(0));//115,小寫s的Unicode編碼 alert(String.fromCharCode(65,66,67,68));//返回ABCD,注意fromCharCode是String物件的靜態方法 alert(str.replace("some","much"));//"much string here" alert(str.substr(1,2));//uc,從下標1開始向後擷取2個字元 alert(str.substring(1,2));//c,從下標1開始擷取到下標2,不包括結束位置的字元 alert(str.toLowerCase()); alert(str.toUpperCase()); alert(str.split(" "));//some,string,here