引用型別----物件和陣列

阿新 • • 發佈：2018-12-24

1. 建立物件：物件（引用型別的值，是引用型別的一個例項）

建立Object例項。

方法一：使用new操作符後跟Object建構函式。

var person = new Object();

person.name = "Nicholas";

person.age = 29;

方法二：使用物件字面量表示法-----不會呼叫Object建構函式

var person = {

name : "Nicholas", //注意，這裡是逗號

age : 29

}

也可以將屬性名使用字串

var person = {

"name" : "Nicholas",

"age" : 29,

5 : true //數值屬性名會自動轉換成字串

}

此外，使用物件字面量時，可一隻使用{}---作用於new Object()類似，只包含預設屬性和方法

2. 訪問物件的屬性

① 點表示法：person.name

② 方括號表示法：person["name"]----優勢是(1) 可以使用變數訪問屬性，(2) 屬性名包含會導致語法錯誤的字元或者屬性名使用的是關鍵字或保留字如：

（1） var propertyName = "name";

alert(propertyName);

（2）person["first name"] = "nicholas";

3. 建立陣列：Array型別-----陣列的每一項都可以儲存任何型別的資料。

方法一：使用Array建構函式

var colors = new Array();

var colors = new Array(10); //建立的陣列的大小為10，但陣列的大小不是固定的，尅動態改變

var colors = new Array("red", "blue", "green"); //建立了包含三個字串值的陣列

注意：給建構函式傳遞一個值時，有兩種意思

var colors = new Array(3); //建立一個包含三項的陣列

var colors = new Array("Greg"); //建立一個包含一項，值為Greg的陣列

方法二：使用陣列字面量表示法

var colors = ["red", "blue", "green"]; //包含3個字串的陣列

var colors = []; //一個空陣列

3. 動態的增加陣列的長度

var colors = ["red"];

arr.length = 2; // colors[0] = "red" colors[1] = undefined

colors[2] = "blue"; //colors[0] = "red" colors[1] = undefined colors[2] = "blue"

4. 檢測某個值是不是陣列: Array.isArray(value)

5. 陣列的轉換方法：toString() valueOf() toLocaleString() ------所有的物件都有這三個方法

① toString() 方法，會呼叫陣列的每一項的toString() 方法

② valueOf() 方法，返回的是陣列本身

③ toLocaleString() 方法，會呼叫陣列每一項的toLocaleString() 方法

如：

(1) var colors = ["red", "blue", "green"];

colors.toString(); // red,blue,green

colors.valueOf(); //red,blue,green

alert(colors); //red,blue,green -----這裡是因為alert() 函式要接收字串引數，所以在後臺會呼叫toString()方法

(2) var person1 = {

toLocaleString: function (){

return "Nikolaos";

}

toString: function (){

return "Nikolaos";

}

var person2 = {

toLocaleString: function (){

return "Grigorios";

}

toString: function (){

return "Greg";

}

var people = [person1,person2];

alert(people); //Nicholas,Greg

alert(people.toString()); //Nicholas,Greg

alert(people.toLocaleString()); //Nicholas,Grigorios

6. 棧方法和佇列方法

① 棧方法：先進後出棧的插入（推入）移除（彈出）都發生在棧的頂部。

ECMAScript為陣列提供了pop() -----在陣列末尾移除元素，返回被移除的值和 push() -----在陣列末尾增加項數，返回陣列的長度方法來模擬棧

var colors = new Array();

colors.push("red","green"); //red green 返回2

color.pop(); //green

② 佇列方法：先進先出在列表的末端新增項，從列表的前端移除項

模擬佇列：（1）push從後端進，shift 從前端移除

var colors = new Array();

colors.push("red","green");

color.shift(); //red

（2）unshift從前端進，pop從後端移除

7. 陣列的重排序方法：reverse() sort()

其中sort()函式可以傳一個引數，用來控制準確度，也可以通過該引數來確定正序還是逆序。

array.reverse() array.sort()

8. 陣列的操作方法：concat() slice() splice()

concat()：用來拼接陣列。先建立當前陣列的一個副本，然後再將接收到的引數新增到陣列的末尾，最後返回一個新陣列。不會改變原來陣列的值。

① 沒有任何引數，即只是複製當前陣列。

② 有一個或多個引數，將引數依次新增到陣列末尾

var colors = ["red", ''green", "blue"];

var c1 = colors.concat("yellow"); //c1：red green blue yellow

var c2 = colors.concat(["black", "brown"]); // c2： red green blue black brown

slice()：切割--將給定陣列按照函式的引數，切割成想要的陣列，最後返回的是一個新陣列：引數從指定起始位置到指定結束位置（不包含結束位置）的所有項。不會改變原來陣列的值

① 只有一個引數：返回的是該引數指定的位置至陣列末尾的所有項數。

var colors = ["red", "green", "blue", "yellow", "purple"];

var c1 = colors.slice(1); // c1：green blue yellow purple

② 兩個引數：返回的是引數從指定起始位置到指定結束位置（不包含結束位置）的所有項

var c2 = colors.slice(1,3); // c2：green blue

splice()：膠接--用於刪除，插入，替換陣列。會改變原來的陣列，返回的是一個數組，包含刪除的原陣列的項數

① 刪除：

var colors = ["red", "green", "blue"];

var c1 = colors.splice(0,2); // colors：blue。c1：red green刪除原陣列的前兩項。0代表從陣列的起始位置開始，2代表刪除原陣列的項數。

② 插入：

var colors = ["red", "green", "blue"];

var c2 = colors.splice(1,0,"yellow","orange"); // colors：red yellow orange green blue。c2：空陣列。1代表從陣列的第二項開始，0代表不刪除陣列的任何元素，後面的兩項代表要插入的項數

③ 替換：注意，替換的項數可以不等於刪除項數

var colors = ["red", "green", "blue"];

var c3 = colors.splice(0,2,"black"); // colors：black blue。c3：red green。0代表從陣列的第一個元素開始，1代表陣列的第二個元素要被替換掉，black代表要替換的項。

9. 陣列的位置方法：indexOf() lastIndexOf()-----返回指定位置的索引。是嚴格意義上的相等（===）

① 一個引數

var num1 = [1, 2, 3, 4, 5, 4];

alert(num1.indexOf(4)); // 3---4代表尋找陣列中第一個項的值為4的索引

② 兩個引數

var num1 = [1, 2, 3, 4, 5, 4];

alert(num1.indexOf(3,1)); // 2---3代表要尋找的項的值為3,1代表從陣列的第二個位置尋找。

注意：嚴格意義上的相等（物件只有地址相同才相等）

var person = {name:"Nicholas"};

var people = [{name:"Nicholas"}];

var morepeople = [person];

people.indexOf(person); //-1 沒有找到相關的項的值，就返回-1

morepeople.indexOf(person); //0

10. 陣列的迭代方法（遍歷陣列）：every() some() filter() map() foreach()----都包含兩個引數，第二個是可選的，第一個是指定的在每一項上執行的函式。而該函式有三個引數---陣列項的值，該項在陣列中的位置，陣列物件本身。

① every()---返回值為true或false。對陣列的每一項執行給定函式，如果每一項都返回true，則該函式就返回true，否則，返回false。