JavaScript引用類型(一)
【Object類型】
在JavaScript中，引用類型是一種數據結構，用於將數據和功能組織在一塊兒（這有點相似於傳統編程語言中的「類」，但它不是「類」）,引用類型有時也被稱爲對象定義，由於它是描述一類對象所具備的屬性和方法，對象是某個特定類型的實例，即引用類型的值是一個對象，新對象是用new操做符 後面跟構造函數建立，JavaScript提供了不少原生的引用類型，以便平常計算。html
【Object類型】
在程序中存儲和傳送數據，Object類型是最經常使用的類型，建立Object類型有兩種方法前端
一：使用構造函數建立編程
var person=new Object(); person.name="Tom"; person.age=20;
二：使用對象字面量建立後端
var person={ name:"Tom", age:20 };
對象字面量定義法用於簡化建立包含大量屬性的對象；在使用字面量表示法建立Object對象時，屬性名也可使用字符串，使用逗號來分隔不一樣的屬性數組
定義帶有默認屬性和方法的Object對象數據結構
var person={}; person.name="Tom"; person.name=20;
若是把花括號中的內容置空，則至關於new Object()。當咱們使用對象字面量表示法建立對象的時候，是不會調用Object構造函數的。習慣上發人員更喜歡用對象字面量方法來建立Object類型編程語言
//定義一個接受args參數的函數displayInfo(args)
function displayInfo(args){ var output=""; if(typeof args.name=="string"){ //經過typeof操做符檢查數據類型
output+="Name: "+args.name+"\n"; } if(typeof args.age=="number"){ output+="Age:"+args.age+"\n"; } alert(output); } //調用函數，函數中使用了對象字面量來封裝多個可選參數
displayInfo({ name:"Jack", age:28 }); displayInfo({ name:"Tom" });
【訪問對象的屬性】函數
有兩種方法，訪問對象的屬性：spa
一： 與傳統的C++、Java、C#語言相似，能夠經過 點號 來訪問對象屬性code
二： 經過使用方括號 來訪問對象屬性 ，這時須要將屬性以字符串的形式放在 方括號 中
經過 點號 訪問
var person=new Object(); person.name="Tom"; person.age=20; alert(person.name);//訪問對象的屬性
經過 方括號 訪問
var person=new Object(); person.name="Tom"; person.age=20; alert(person["name"]);//訪問對象的屬性
在使用 方括號 訪問對象屬性的時候，應將屬性以字符串的形式放在 方括號 中，使用方括號訪問屬性的，有個優勢：能夠經過變量來訪問屬性
var person={ name:"TOM", age:20 }; var propertyName="name"; alert(person[propertyName]);
這是 點號 訪問方式沒法作到的，習慣上通常使用 點號 來訪問屬性，在必須使用 變量 訪問屬性時才使用 方括號 形式
【Array類型】
在JavaScript中的數組與其餘語言的數組，有着很大區別:
①數組元素的沒一項均可以使不一樣類型的數據
②數組大小自動可調整
【建立數組】
與建立Object對象同樣，建立數組類型也可使用：構造函數和字面量兩種方法建立
一： 使用Array()構造函數建立數組
var colors=new Array(); //調用構造函數建立數組 var colors=new Array(100);//指定length的值 var colors=new Array("green","red","blue");//設定數組的初始值 var colors=Array(100); //以上寫法均可以省略new關鍵字
須要注意的是在向數組傳入單個值的時候，若是傳入的是數值，就會形成給length 賦值
【使用字面量建立數組】
var colors=["green","blue","red"] //建立一個包含三個字符串的數組 var names=[]; //空數組
colors[colors.length]="black";
colors[colors.length]="brown";
【 檢測數組】
肯定某個對象究竟是不是數組，可使用JavaScript中新增的Array.isArray(object)方法，參考http://msdn.microsoft.com/en-us/library/ie/ff848265(v=vs.94).aspx
alert(Array.isArray(colors));
【轉換方法】
Javascript中的全部引用類型的對象都具備toLocaleString()、toString()、valueOf()方法
alert(colors.toLocaleString());//返回以逗號分隔的字符串 alert( colors.toString());//返回以逗號分隔的字符串 alert( colors.valueOf());//返回數組
三者的區別先看以下代碼輸出
/*按照定義全部引用類型的對象都具備toLocaleString()、toString()、valueOf()方法 *toLocaleString() * toString() 返回數組中，每一個值的字符串形式，以逗號拼接而成 * valeOf() 返回數組 */ //定義帶有方法的對象person1，如下是函數重寫嗎？ var person1={ toLocaleString:function(){ return "Tom"; }, toString:function(){ return "Tom"; } }; //定義帶有方法的對象person2 var person2={ toLocaleString:function(){ return "Jack"; }, toString:function(){ return "Lucy"; } }; //建立對象數組 var people=[person1,person2]; alert(people); //輸出Tom,Lucy 其實是調用people數組每一項的toString()方法 alert(people.toString()); //輸出Tom,Lucy alert(people.toLocaleString()); //輸出Tom,Jack
【棧方法】
JavaScript中的數組具備一種特殊的特性，它具備棧的特性，棧是一種LIFO(Last-In-First-Out後進先出)的數據結構
也就是說最新添加的項最先被移除。項的插入/推入和移除/彈出，只發生在棧頂一個位置。Javascript爲數組提供了push()和pop()
方法來完成相似棧的行爲。
push()方法:接受任意個參數，把它們逐個添加到數組末尾，而且返回修改後的數組長度
pop()方法:從數組末尾移除最後一項，減小數組的length值，而且方法被移除的項
示例以下：
//實現數組的棧操做 var students=new Array(); var count1=students.push("Tom","Jack","Lucy"); //output:4 var count2=students.push("Justin"); alert(count1);//output:3 alert(count2);//output:4 alert(students.length);//output:4 var item=students.pop(); // 移除數組最後一項，而且將被移除的數組元素保存在item中 alert(item); //output:Justin 顯示被移除的數組元素 alert(students.length);//output:3
【隊列方法】
棧的訪問規則是LIFO(後進先出)，而隊列的訪問規則是FIFO(先進先出)。隊列是在列表的末端添加項，前端移除項。因爲push()方法實現的是在末端添加項
，因此要模擬隊列，只須要有一個從隊列前端取得一個項的方法便可。實現這一操做的方法是shift()方法。
shift()方法:移除數組中的第一項，數組長度減小1，而且返回該項
因此實現隊列操做，須要push()方法和shift()方法結合使用。
示例以下：
//實現數組的隊列操做 var students=new Array(); var count1=students.push("Tom","Jack","Lucy"); //output:4 推入 var count2=students.push("Justin"); alert(count1);//output:3 alert(count2);//output:4 alert(students.length);//output:4 var item=students.shift(); // 移除數組第一項，而且將被移除的數組元素，保存在item中 alert(item); //output:Tom 顯示被移除的數組元素 alert(students.length);//output:3
從反方向來模擬隊列操做，Javascript中還未數組提供了unshift()方法，該方法與shift方法相反，它能在數組前端添加任意個項並返回新數組長度
所以同時使用unshift()方法和pop()方法，一樣能夠實現隊列操做
示例以下：
//從反方向實現隊列的操做 var students=new Array(); var count=students.unshift("Tom","Jack","Lucy"); //在數組前端添加三個元素，並返回數組長度存入count中 alert(count); //output:3 alert(students); //output:"Tom","Jack","Lucy" var count=students.unshift("Justin"); //再在數組前面添加一個元素 alert(students); //查看數組 output:"Justin","Tom","Jack","Lucy" //alert(count); var item=students.pop(); //從後端移除元素 alert(item); //output:Lucy alert(students); //"Justin","Tom","Jack" Lucy已經被移除了 var item=students.pop(); //繼續移除 alert(students); //此時Jack也被移除因此輸出是:"Justin","Tom"
棧和隊列操做的總結：
| 操做 | 特徵 | 說明 | 位置 | 方法 | 備註 |
| 棧 | LIFO(後進先出) | 列表中最新添加的項最先被移除 | 只發生在一個位置：棧頂 | 後端:push()插入 | 後端指的是棧頂 |
| 後端:pop()移除 | |||||
| 隊列 | FIFO(先進先出) | 列表末端添加項，前端移除項 | 發生在列表的前端和後端 | 後端:push()插入 | |
| 前端:shift()移除 | |||||
| 反方向隊列 | FIFO(先進先出) | 前端添加項，後端移除項 | 發生在列表的前端和後端 | 後端:pop()移除 | 實現的是反方向的先進先出 |
| 前端:unshift()插入 |
【排序方法】
首先看以下代碼輸出：
//實現數組位置反轉 var values=[0,1,2,3,4,5,6,7,8,9,10]; var testValue=[7,0,3,2,10,4,5,1,9,6,8] values.reverse(); testValue.reverse(); alert(values); //output:10,9,8,7,6,5,4,3,2,1,0 alert(testValue); //output:8,6,9,1,5,4,10,2,3,0,7 //實現數組排序 values.sort(); testValue.sort(); alert(values); //0,1,10,2,3,4,5,6,7,8,9 alert(testValue); //0,1,10,2,3,4,5,6,7,8,9
從上面能夠看出reverse()方法，用於對數組位置進行反轉，即首尾互換。而sort()方法用於對數組進行排序，比較的是值而不是位置。在默認狀況下sort()是按升序排列數組的
爲了實現排序sort()會調用每一個數組項的toString()方法進行轉型獲得字符串，即sort()方法比較的是字符串。
sort()方法還可接受一個比較函數，以便指定那個值在前。比較函數接受兩個參數，若是第一個參數應該位於第二個參數以前則返回負數，若是兩個參數相等則返回0，若是第一個參數應該位於第二個參數以後則返回正數
//接受比較函數
function compare(value1,value2){
if(value1<value2){
return -1;
}else if(value1>value2){
return 1;
}else{
return 0;
}
}
//實現數組排序
var values=[0,1,2,3,4,5,6,7,8,9,10];
var testValue=[7,0,3,2,10,4,5,1,9,6,8]
values.sort();
testValue.sort(compare);
alert(values);
alert(testValue);
【操做方法】
concat()方法能夠基於現有的數組建立一個新數組
var colors=["red","blue","green","black"]; var newColors1=colors.concat(); var newColor2=colors.concat("gold"); var newColors3=colors.concat("royalblue","gold",["grey","white"]); alert(newColors1); //red,blue,green,black alert(newColor2); //red,blue,green,black,gold alert(newColors3); //red,blue,green,black,royalblue,gold,grey,white
從上面輸出能夠看出：
一.在不給concat()傳遞參數的狀況下，concat()簡單複製原數組
二.當給concat()傳遞的不是數組時，concat()會將傳入的參數簡單的添加到新數組末尾
三.在給concat()傳遞一個或多個數組時，會合並這些數組添加到新數組中
slice()方法用於從當前數組項中的一項或多項建立新數組，它接受兩個數字參數分別，分別表示要返回項目的開始位置和結束位置
var values=[110,120,119,911,114,112,117]; var newValues1=values.slice(2); var newValues2=values.slice(3,5); var newValues3=values.slice(6,2); var newValues4=values.slice(-5,-2); //請注意從小到大 即-5<-2 alert(newValues1); //119,911,114,112,117 alert(newValues2); //911,114 alert(values); //110,120,119,911,114,112,117 alert(newValues3); //返回爲空 alert(newValues4); //119,911,114
從上面輸出能夠看出：
一.在只有一個參數的狀況，slice()方法返回從該參數指定位置到數組末尾全部項
二.在有兩個參數的狀況，slice()方法返回參數指定的開始項到結束項之間的全部項，但不包括結束位置項
三.slice()方法不影響原始數組
四.若是傳入的開始位置大於結束位置，則返回空數組
五.若是傳入的位置是負值，則將負值加上數組長度後，再進行計算輸出，好比上面的newValues4,values.slice(-5,-2) 與newValues4,values.slice(2,5)等價
splice()方法
splice()方法有不少種用法，，主要用途是向數組中部插入項，splice()方法返回的仍是數組，具體操做以下：
刪除：接受兩個參數，第一個參數指定要的第一項位置，第二個參數指定要刪除的項數
插入：接受三個參數，第一個參數指定起始位置，第二個參數0和要插入的項目
替換：接受三個參數，第一個參數指定起始位置，第二個參數指定要刪除的項和要替入的項
var person=["Jack","Tom","Lucy","Bob","Anne","Abby","Angelia"]; //原始數組，演示刪除操做 var person2=person.concat(); //複製原始數組，以備插入操做 var person3=person.concat(); //複製原始數組， var removedPerson=person.splice(2,2); //從第三項開始刪除，刪除二項，將刪除的結果存入removedPerson變量中 alert(removedPerson); //Lucy,Bob alert(person); //查看操做後的原始數組：Jack,Tom,Anne,Abby,Angelia //插入操做 var insertPerson1=person3.splice(3,0,"Justin","Ellen"); alert(insertPerson1); //返回爲空 alert(person3); //Jack,Tom,Lucy,Justin,Ellen,Bob,Anne,Abby,Angelia 當刪除項目爲0的時候，插入在開始位置以前 //替換操做 var insertPerson=person2.splice(3,1,"Justin","Ellen"); //從索引3開始刪除兩項 alert(insertPerson); //從索引3開始刪除一項：Bob 僅僅返回被刪除的那項 alert(person2); //Jack,Tom,Lucy,Justin,Ellen,Abby,Angelia ；Bob已被刪除了，新元素已替換好
【位置方法】
JavaScript數組有兩個位置方法:indexOf()和lastIndexOf(),它們都接受兩個參數，第一個參數要查找的項，第二項表示查找起點位置的索引；
indexOf()表示從頭查找，lastIndexOf()表示從尾查找，兩個方法都是返回要查找的項在數組中的位置，沒查找到的狀況下返回-1
var person=["Jack","Tom","Lucy","Bob","Anne","Abby","Angelia"]; alert(person.indexOf("Bob")); // 3 alert(person.indexOf("Bob",5)); //在指定的位置上面，沒找到 返回-1 alert(person.indexOf("Abby")); // 5 alert(person.lastIndexOf("Abby",2));//在指定的位置上面，沒找到 返回-1 alert(person.indexOf("Justin")); //-1 沒找到返回-1 alert(person.lastIndexOf("Justin")); //-1
【迭代方法】
Javascript爲數組定義了5個迭代的方法：every(),filter(),forEach(),map(),some()。5個方法都不會改變數組的內容
每一個方法接受兩個參數：要在每一項上運行的函數和運行該函數的做用域對象，如下是說明
every()方法示例：
1 // 定義回調函數 2 function CheckIfEven(value, index, ar) { 3 document.write(value + " "); 4 5 if (value % 2 == 0) 6 return true; 7 else 8 return false; //若是返回false就中止調用，返回true則繼續調用，直到數組項結束 9 } 10 // 建立示例數組 11 var numbers1 = [2, 4, 6, 6, 8,3,10,4]; 12 var numbers2 = [2,4,6,8,]; 13 14 // 檢查返回值 15 if (numbers1.every(CheckIfEven)) //numbers.every(CheckIfEven)返回的是布爾值 16 document.write("都是偶數"); 17 else 18 document.write("不全是偶數"); //2 4 6 6 8 3 不全是偶數 沒有所有檢查完 19 // 檢查返回值 20 if (numbers2.every(CheckIfEven)) //numbers.every(CheckIfEven)返回的是布爾值 21 document.write("都是偶數"); 22 else 23 document.write("不全是偶數"); //2 4 6 8 都是偶數；所有調用完
some()方法：
1 function CheckIfEven(value, index, ar) { 2 document.write(value + " "); 3 4 if (value % 2 == 0) 5 return true; 6 else 7 return false; 8 } 9 // 建立示例數組 10 var numbers3 = [1,3,5,2,6,8,7]; 11 var evens = numbers3.some(CheckIfEven); 12 document.write(evens); //1 3 5 2 true 找到了2
- 1. JavaScript引用類型——Array類型（一）
- 2. JavaScript引用類型
- 3. JavaScript 引用類型
- 4. javascript引用類型
- 5. JavaScript——引用類型
- 6. JavaScript引用類型——Array類型（二）
- 7. JavaScript引用類型——Object類型
- 8. JavaScript-基本類型和引用類型
- 9. javascript基礎類型和引用類型
- 10. JavaScript引用類型之Function類型
- 更多相關文章...
- • SQL 通用數據類型 - SQL 教程
- • ASP 引用文件 - ASP 教程
- • Kotlin學習（二）基本類型
- • Java Agent入門實戰（一）-Instrumentation介紹與使用
-
每一个你不满意的现在，都有一个你没有努力的曾经。