js數組(列表)的基本操做

　　本文主要介紹JS對數組(列表)的基本操做。習慣了用數據庫的操做順序來講明：增、刪、改、查；合併，裁剪，排序，格式化。

一.數組元素的添加(增長)

　　增長數組元素有三種方法：unshift()  push()  splice()

　　一、arrayObj.unshift([item1 [item2 [. . . [itemN ]]]]);// 將一個或多個新元素添加到數組開始位置(即頭部)，數組中的原元素自動後移；並返回數組新長度。

　　二、arrayObj. push([item1 [item2 [. . . [itemN ]]]]);// 將一個或多個新元素添加到數組結尾；並返回數組新長度。

　　3、arrayObj.splice(insertPos,0,[item1[, item2[, . . . [,itemN]]]]);//將一個或多個新元素插入到數組的指定位置，插入位置的元素自動後移，返回""。

　　舉例說明：

unshift()
var a = [1,2.5,"a","yes"];
var temp = a.unshift(-1,-2.2);
console.log(a);     //[-1, -2.2, 1, 2.5, "a", "yes"] console.log(temp);  //6 數組的長度 push()
var a = [1,2.5,"a","yes"];
var temp = a.push(-1,-2.2);
console.log(a);     //[1, 2.5, "a", "yes", -1, -2.2] console.log(temp);  //6 數組的長度   
splice()    將數據添加到原數組結尾
var a = [1,2.5,"a","yes"];
var temp = a.splice(a.length,0, -1,-2.2);    //此將數據添加到原數組結尾，同push()
console.log(a);     //a: [1, 2.5, "a", "yes", -1, -2.2] console.log(temp);  //[] 空數組 
splice()    將數據添加到原數組開頭
var a = [1,2.5,"a","yes"];
var temp = a.splice(0,0, -1,-2.2);   //此將數據添加到原數組開頭，同unshift()
console.log(a);     //a: [-1, -2.2, 1, 2.5, "a", "yes"] console.log(temp);  //[] 空數組 splice()    將數據添加到具體位置
var a = [1,2.5,"a","yes"];
var temp = a.splice(2,0, -1,-2.2);   //此將數據添加到第三個位置
console.log(a);     //a: [1, 2.5, -1, -2.2, "a", "yes"] console.log(temp);  //[] 空數組

 

二.數組元素的刪除

　　刪除數組元素有三種方法：shift()  pop()  splice()

　　一、  arayObj.shift();//刪除原數組第一項，並返回刪除元素的值；若是數組爲空則返回undefined 

　　二、  arrayObj.pop();//刪除原數組最後一項，並返回刪除元素的值；若是數組爲空則返回undefined

　　3、  arrayObj.splice(deletePos,deleteCount); //刪除從指定位置deletePos開始的指定數量deleteCount的元素，以數組形式返回所移除的元素

　　舉例說明：

shift()
var a = [1,2.5,"a","yes"];
var temp = a.shift();
console.log(a); //[2.5, "a", "yes"] console.log(temp);  // 1 原數組第一項       
pop()
var a = [1,2.5,"a","yes"];
var temp = a.pop();
console.log(a); // [1, 2.5, "a"] console.log(temp);  // yes 原數組最後一項 splice()    刪除指定位置開始的數據。第一個參數是指定位置，第二個參數是刪除從指定位置開始的數據個數
var a = [1,2.5,"a","yes"];
var temp = a.splice(1,1);       //刪除第2個位置開始的1個數據，
console.log(a); // [1, "a", "yes"] console.log(temp);  // [2.5] 以數組形式返回移除的元素 var temp = a.splice(1,2);       //刪除第2個位置開始的2個數據，
console.log(a); // [1, "yes"] console.log(temp);  // [2.5, "a"] 以數組形式返回移除的元素

 

三.數組元素的修改

　　數組元素值的修改：先按元素的索引查找到須要修改的元素; 而後進行元素值的修改。

　　舉例說明：

var a = [1,2.5,"a","yes"];
a[2] = "IT";
console.log(a); // [1, 2.5, "IT", "yes"]

　　還能夠經過splice()函數進行修改。splice(start,delCount,val1,val2,...):從start位置開始刪除delCount項後，並從該開始位置起插入val1,val2,...  固然刪除的元素個數和添加的元素個數必須相等。 

var a = [1,2.5,10,"No","a","yes"];      經過指定位置先刪除再插入，達到修改數組的目的
var temp = a.splice(2,2,"You",0.1);
console.log(a);     // [1, 2.5, "You", 0.1, "a", "yes"] console.log(temp);  // [10, "No"] 其實就是刪除項，用數組形式返回

 

四.數組元素的查詢(訪問)

    獲取數組元素值通用的一個方法：按元素的索引獲取元素值; 返回改索引下的元素值

      注：一次只能返回一個元素值，不能切片分塊返回，也不能從數組末尾以負數形式返回

　　舉例說明：

var a = [1,2.5,"a","yes"];
var temp = a[1];
console.log(temp);  // 2.5 返回數組索引爲1的元素值 var temp = a[1,2]; var temp = a[-1];　　//這兩種都是錯誤的，沒法獲取想要的數據

 

五.數組元素的合併

   將兩個以上數組合併爲一個數組，經常使用的方法是concat()，此方法返回一個新的數組，而參與合併的原數組不變。

　　舉例說明：

var a = [1,5,2,15,6];
var b = ["You","No","a","yes"];
var temp = a.concat(b); //將b合併到a後面 var tempdata = b.concat(a);     //將a合併到b後面 console.log(temp);      // [1, 5, 2, 15, 6, "You", "No", "a", "yes"] console.log(tempdata);     //["You", "No", "a", "yes", 1, 5, 2, 15, 6]

　　經過concat()函數實現兩個以上數組的合併，其實經過循環使用unshift()和push()也能夠作到。

　　好比將b加在a後面/前面，能夠循環使用push()/unshift()函數。

var a = [1,5,2,15,6];
var b = ["You","No","a","yes"];
for(var i=0; i< b.length; i++){ a.push(b[i])        //將b加在a後面；若是但願將b加在a前面，則改用unshift（）
} console.log(a); // [1, 5, 2, 15, 6, "You", "No", "a", "yes"] console.log(b);  // ["You", "No", "a", "yes"]

　　這樣作將會改變宿主數組，若是不但願改變原數組的話，則新建一個新的空數組，將宿主數組(載體數組)拷貝給新數組，這樣原數組就能夠不改變。注：這裏的拷貝是深拷貝，而不是直接將a賦值給新數組，那樣的話新數組其實只是保存了原數組的一個地址，新數組被修改，則原數組同樣會被修改。

六.數組元素裁剪

    數組的裁剪：是在原數組基礎上截取出一個小的數組，以便於使用和存放。截取的元素組成一個新的數組副本，而原數組不發生改變。

　　數組的裁剪通常使用slice()函數，slice(start,end):返回從原數組中指定開始下標到結束下標之間的元素組成新的數組 ，若結束下標超出原數組總長，則以原數組結尾處下標爲結束下標。

　　舉例說明：

var a = [1,2.5,"a","yes",12,23];
var temp = a.slice(2,5); //裁剪下標爲2到下標爲5的元素；結束下標未超出數組總長
console.log(temp);  // ["a", "yes", 12] console.log(a);     // [1, 2.5, "a", "yes", 12, 23] 原數組不發生改變 var temp = a.slice(2,15);   //裁剪下標爲2到下標爲15的元素；結束下標超出數組總長
console.log(temp);  // ["a", "yes", 12, 23] 結束下標自動以原數組結尾下標爲結束下標 console.log(a);     // [1, 2.5, "a", "yes", 12, 23]

 

七.數組元素排序

     數組的排序：是在原數組的基礎上對數組元素進行整理，使得元素按照必定順序排列，不會生成副本。

     數組排序通常使用數組對象內置方法sort()。sort()方法用於對數組的元素進行排序。

　　　若是調用該方法時沒有傳入參數，將按字母順序對數組中的元素進行默認排序，是按照字符編碼的順序進行排序。若是想按其餘標準進行排序，則須要提供比較函數，該函數比較兩個值，而後返回一個數字來講明這兩個值的大小。比較函數具備兩個參數 a 和 b，其返回值以下：

　　若 a 小於 b，在排序後的數組中 a 應該出如今 b 以前，則返回一個小於 0 的值(-1)。

　　若 a 等於 b，則返回 0。

　　若 a 大於 b，則返回一個大於 0 的值。

　　舉例說明：

一、純字符串排序
var a = ["zhao","qian","sun","li","zhou","wu","zheng"];
var temp = a.sort();
console.log(a); // ["li", "qian", "sun", "wu", "zhao", "zheng", "zhou"] console.log(temp);  // ["li", "qian", "sun", "wu", "zhao", "zheng", "zhou"] 返回排好序的原數組 先按第一個字母排序，第一個相同則按第二個排序，以此類推。 二、字符串和數字混雜
var a = ["zhao","qian",1,"li","zhou","wu",2];
var temp = a.sort();
console.log(a); //[1, 2, "li", "qian", "wu", "zhao", "zhou"] 先排數字，後排字符串，其實這的1,2排序看似正確，其實不是按照他們的大小排的，而是按照1和2的編碼順序排的。從下面這個例子能夠看出。 
三、  純數字排序(但不提供比較函數)
var a = [11,5,1,13,20,-1,2];
var temp = a.sort();
console.log(a);  // [-1, 1, 11, 13, 2, 20, 5] 從這就能夠看出默認排序是按照字符編碼順序排的，而不是大小 四、  純數字正確排序(須要提供排序函數) var a = [11,5,1,13,20,-1,2];
var temp = a.sort(sortNumber);
console.log(a);  // [-1, 1, 2, 5, 11, 13, 20] 這纔是正確的從小到大排序
function sortNumber(a,b) 這是從小到大排序
{
    return a - b
}
function sortNumber(a,b) 這是從大到小排序
{
    return b – a
}
console.log(a);  // [20, 13, 11, 5, 2, 1, -1] 這是從大到小排序結果    

 

八.數組的格式化

　　數組也有尷尬的時候，有時候咱們須要將數組轉化爲字符串進行傳參，或者進行數據存儲等，那麼這時候就須要將數組轉化成字符串。

　　join() 方法用於把數組中的全部元素放入一個字符串，元素經過指定的分隔符進行分隔。Join方法返回一個新的字符串副本，不會對原數組進行修改。

　　語法格式：arrayObject.join(separator)     返回一個字符串，該字符串是經過把 arrayObject 的每一個元素轉換爲字符串，而後將這些字符串鏈接起來，在兩個元素之間插入separator 字符而生成。

　　舉例說明：

var a = [1,2.5,"a","yes",12,23];
var temp = a.join();  //默認格式化，不提供鏈接字符
console.log(temp); //1,2.5,a,yes,12,23 console.log(a);　　// [1, 2.5, "a", "yes", 12, 23] var a = [1,2.5,"a","yes",12,23];
var temp = a.join(「|」);   //提供鏈接字符,但鏈接字符必須是字符(「x」)形式 console.log(temp); // 1|2.5|a|yes|12|23 console.log(a);　　// [1, 2.5, "a", "yes", 12, 23]

 

九.數組的創建

　　var arrayObj = new Array();　//建立一個數組 經過內置對象Array()進行建立

　　var arrayObj = new Array([size]);　//建立一個數組並指定長度，注意不是上限，是長度

　　var arrayObj = new Array([element0[, element1[, ...[, elementN]]]]);　//建立一個數組並初始化賦值

　　var arrayObj = [];    //也能夠建立一個數組，並已完成初始化,只不過是個空的,沒有實際元素

　　注：須要說明的是，雖然第二種方法建立數組指定了長度，但實際上全部狀況下數組都是變長的，也就是說即便指定了長度爲5，仍然能夠將元素存儲在規定長度之外的，注意：這時長度會隨之改變。

　　數組是JavaScript提供的一個內部對象，它是一個標準的集合，咱們能夠添加(push)、刪除(shift)裏面元素，還能夠經過for循環遍歷裏面的元素。

附件：數組對象內置操做方法

Array 對象方法

方法	描述
concat()	鏈接兩個或更多的數組，並返回結果。
join()	把數組的全部元素放入一個字符串。元素經過指定的分隔符進行分隔。
pop()	刪除並返回數組的最後一個元素
push()	向數組的末尾添加一個或更多元素，並返回新的長度。
reverse()	顛倒數組中元素的順序。
shift()	刪除並返回數組的第一個元素
slice()	從某個已有的數組返回選定的元素
sort()	對數組的元素進行排序
splice()	刪除元素，並向數組添加新元素。
toSource()	返回該對象的源代碼。
toString()	把數組轉換爲字符串，並返回結果。
toLocaleString()	把數組轉換爲本地數組，並返回結果。
unshift()	向數組的開頭添加一個或更多元素，並返回新的長度。
valueOf()	返回數組對象的原始值