javascript中最基礎的資料結構-----數組-js教程-PHP中文網

1.1 Javascript中對陣列的定義

數組的標準定義：一個儲存元素的線性集合，元素可以透過索引來任意存取，索引通常是數字，用來計算元素之間儲存位置的偏移量。
不過javascript中的陣列是一種特殊的對象，用來表示偏移量的索引是該對象的屬性，索引可能是整數。 however，這些數字索引在內部轉換為字串類型，是因為javascript物件中的屬性名稱必須是字串。

2.2 使用陣列

2.2.1 建立陣列

var nums = [1,2,3,4]; || 此方法更有效率

var nums = new Array(1,2,3,4) ;

2.2.2 讀寫數組

在一條賦值語句中，使用[] 操作符將資料賦給數組，例如下面的循環，將1~100的數字賦給一個數組：

var nums = [];for (var i =0; i<100;i++){
    nums[i] = i+1;}

登入後複製

還可以用[ ] 運算子讀取陣列中的元素：

var nums = [1,2,3,4];
var sum = nums[0]+nums[1]+nums[2]+nums[3];
console.log(sum)

登入後複製

2.2.3 由字串產生陣列中的元素：

var sentence = "the quick brown fox jumped over the lazy dog"; 
var  words = sentence.split(" ");
for (var  i=0; i<words.length;i++){
    console.log("word " + i + ":" +words[i]);
}

登入後複製

2.2.3 由字串產生陣列

var nums = [];
for (var i = 0; i<10;i++){
    nums[i] = i+1;
}
var samenums = nums;

登入後複製

在上述程式中，呼叫splite()方法，透過單字之間的空格分隔符，講一句話分成及部分，並將每個部分作為一個元素保存於一個新建的陣列中。

2.2.4 對數組整體性的操作

1.將一個數組賦值給另外一個數組

var nums = [];
for (var i = 0; i<10;i++){
    nums[i] = i+1;
}
var samenums = nums;
nums[0] = 400;
console.log(samenums[0]);  //显示400

登入後複製

但是如上賦值操作，只是為被賦值的數組增加一個新的引用。當透過原引用修改了數組的值，另一個引用也會改變。

//写个深复制函数function copy(arr1,arr2){
    for (var i = 0;i<arr1.length;i++){
        arr2[i] = arr1[i];
    }}var nums = [];for (var i = 0; i<10;i++){
    nums[i] = i+1;}var samenums = [];copy(nums,samenums);nums[0] = 400;console.log(samenums[0]);   //显示1

登入後複製

這種行為是淺複製，新數組依然指向原來的陣列。

更好的方案是深複製，將原始數組中的每個元素複製一份到新數組中。

var itDiv = ["Mike","Clayton","Terrill","Raymond","Cynthia","Danny","Jennifer"]; 
var dmpDept = itDiv.splice(3,3);  // Raymond,Cynthia,Danny print(cisDept);
var cisDept = itDiv; 
console.log(dmpDept);// Mike,Clayton,Terrill,Jennifer

登入後複製

2.3 存取函數

2.3.1 找出元素 =====indexOf()

用來找出傳進來的參數在目標陣列中是否存在。如果目標數組包含該參數，則傳回元素在數組中的索引；如果不包含，就傳回-1。

2.3.2 陣列的字串表示 ===== join() 和 toString()

這兩個方法都傳回一個包含陣列所有元素的字串，各個元素之間用逗號分隔開。

2.3.3 由已有陣列建立新陣列 =====concat() 和 splice()

concat()方法可以合併多個陣列建立一個新陣列。

splice()方法截取一個陣列的子集來建立一個新陣列。此方法第一個參數是截取的起始索引，第二個參數是截取的長度。

var nums = [2,3,4,5]; console.log(nums); // 2,3,4,5 var newnum = 1;
 nums.unshift(newnum); 
 console.log(nums); // 1,2,3,4,5 
 nums = [3,4,5];
  nums.unshift(newnum,1,2); 
  console.log(nums); // 1,2,3,4,5

登入後複製

2.4 可變函數

2.4.1 為陣列加入元素======push()和unshift()

push()方法將一個元素加入陣列末尾。

unshift()方法可以將元素加入到陣列的開頭。

var nums = [1,2,3,4,5,9]; 
nums.pop(); 
console.log(nums); // 1,2,3,4,5

登入後複製

2.4.2 從陣列中刪除元素 pop()和 shift()

pop()方法可以刪除陣列末端的元素。

var nums = [9,1,2,3,4,5];
 nums.shift(); 
 console.log(nums); // 1,2,3,4,5

登入後複製

🎜shift()方法可以刪除陣列第一個元素。 🎜

var nums = [9,1,2,3,4,5];
 nums.shift(); 
 console.log(nums); // 1,2,3,4,5

登入後複製

pop() 和 shift() 方法都将删掉的元素作为方法的返回值返回，因此可以使用一个变量来保存删除的元素：

var nums = [6,1,2,3,4,5]; 
var first = nums.shift(); // first gets the value 9 
nums.push(first);
 console.log(nums); // 1,2,3,4,5,6

登入後複製

2.4.3 从数组中间位置添加和删除元素=====splice()

用splice()方法为数组添加元素，需提供如下参数：

起始索引（就是希望开始添加元素的地方）

需要删除的元素个数（添加元素时该参数设为0）

想要添加进数组的元素
such as:

var nums=[1,2,3,7,8,9];
var newElements = [4,5,6];
nums.splice(3,0,newElements);
console.log(nums);   //1,2,3,4,5,6,7,8,9

登入後複製

下面是用splice()删除数组元素的例子：

var nums = [1,2,3,100,200,4,5];
nums.splice(3,2);
console.log(nums);   //1,2,3,4,5

登入後複製

2.4.4 为数组排序

1.reverse() ====> 将数组中元素的顺序进行翻转

2.sort() ======>对字符型的元素按字典顺序进行排序

对于数字类型的元素，如果要用sort()排序，可以在调用方法时传入一个大小比较函数，排序时，sort()方法会根据该函数比较数组中两个元素的大小，来决定整个数组的顺序。

function compare(num1,num2){
return num1-num2;
}
var nums = [3,4,1,80,27];
nums.sort(compare);

登入後複製

sort()使用了compare()函数对数组按照数字大小进行排序，而不是按照字典顺序。

2.5 迭代器方法

2.5.1 不生成新数组的迭代器方法

1.forEach()

接受一个函数作为参数，并对数组中的每个元素使用该函数。

    function square(num){
      console.log(num,num*num);
    }
    var nums = [1,2,3,4,5,6];
    nums.forEach(square);

登入後複製

2.every()

接受一个返回值为布尔型的函数，对数组中的每个元素使用该函数。如果对于所有的元素，该函数都返回true，则该方法返回true。

function isEven(num){
    return num%2 == 0;
}
var nums = [2,4,6,8];
var even = nums.every(isEven);
if(even){
    console.log("all numbers are even");
}else{
    console.log("not all numbers are even");
}

登入後複製

可以改改数组里的元素试试。

3.some()

some() 方法也接受一个返回值为布尔类型的函数，只要有一个元素使得该函数返回 true，该方法就返回 true.

function isEven(num) {   
     return num % 2 == 0;
      } 
 var nums = [1,2,3,4,5,6,7,8,9,10]; 
 var someEven = nums.some(isEven); 
 if (someEven) {    
        console.log("some numbers are even"); 
 } else {   
        console.log("no numbers are even");
   }
    nums = [1,3,5,7,9]; 
    someEven = nums.some(isEven); 
    if (someEven) {    
            console.log("some numbers are even");
     } else {    
          console.log("no numbers are even");}

登入後複製

4.reduce()

接受一个函数，返回一个值。该方法会从一个累加值开始，不断对累加值和数组中的后续元素调用该函数，直到数组中的最后一个元素，最后返回得到的累加值。
下面这个例子展示了如何使用 reduce() 方法为数组中的元素求和：

function add(runningTotal,currentValue){
    return runningTotal + currentValue;
}
var nums = [1,2,3,4,5,6];
var sum = nums.reduce(add);
console.log(sum);

登入後複製

reduce() 方法和 add() 函数一起，从左到右，依次对数组中的元素求和。
reduce() 方法也可以用来将数组中的元素连接成一个长的字符串：

function concat(accumulatedString,tiem){
    return accumulatedString + item;
}
var words = ["the ", "quick ","brown ", "fox "]; 
var sentence = words.reduce(concat);
console.log(sentence);

登入後複製

2.5.2 生成新数组的迭代器方法

1. map()

map() 和 forEach() 有点儿像，对数组中的每个元素使用某个函数。两者的区别是 map() 返回一个新的数组，该数组的元素是对原有元素应用某个函数得到的结果。

function curve(grade){
    return grade += 5;
}
var grades = [78,89,92,74];
var newgrades = grades.map(curve);
console.log(newgrades);  // 83,94,97,79

登入後複製

2. filter()

filter() 和 every() 类似，传入一个返回值为布尔类型的函数。和 every() 方法不同的是，当对数组中的所有元素应用该函数，结果均为 true 时，该方法并不返回 true，而是返回一个新数组，该数组包含应用该函数后结果为 true 的元素。

function passing(num) {    
        return num >= 60;
 } 
 var grades = []; 
 for (var i = 0; i < 20; ++i) {    
        grades[i] = Math.floor(Math.random() * 101); 
    }
 var passGrades = grades.filter(passing);
console.log("All grades: "); 
console.log(grades);
console.log("Passing grades: "); 
console.log(passGrades);

登入後複製