重學前端之（3）陣列、排序

why前端_小牛_到犀牛發表於2019-04-09
前端陣列排序

陣列

  • 所謂陣列， 就是將多個元素 （通常是同一型別），按一定順序排列放到一個集合中 ， 那麼這個多個元素的集合我們就稱之為陣列

  • 思考 :

    // 為什麼要有陣列?
//1. 我們知道,,一個變數能夠儲存一個值, 當我們想要儲存多個值的時候, 就可以使用陣列。比如儲存一個班級裡面所有學生的名字;
//2. 使用陣列可以對多個相同型別的值統一的管理,,儲存起來方便,,操作的時候,也會很方便;
複製程式碼

  • 特點 : 有順序,有長度;

  • 用途 : 儲存大量的資料

  • 總結 :

    ​ 陣列 : 多個元素的集合,,這個集合有順序,有長度。用途是儲存大量的資料.

陣列初體驗

在js裡,陣列是一個有序的列表,,可以在陣列中存放任意的資料

初體驗 :

var arr = ['why','lisa','love'];

// 總結 : 
//1. 變數 :  numbder->num1 string-str1, boolean->b1 flag array->arr1 
//2. [] , 用[] 來代表陣列 => () 小圓 [] 中方 {} 大花
//3. 陣列裡的每一個值,稱之為元素
//4. 型別可以不一樣,,但是最好一樣
//5. 逗號

//4. 陣列是有長度的 length
//5. 下標決定了陣列的順序 

// 下標的用法?
//  6. 獲取元素  陣列[下標]


var arr = ['why','lisa','love'];
console.log(arr);
console.log(arr[0]);
console.log(arr[1]);
console.log(arr[2]);
複製程式碼

建立陣列

  1. 通過 建構函式 建立陣列

    var arr = new Array();//建立了一個空陣列
var arr = new Array(1,2,3,4);//建立了一個陣列，裡面存放了4個數字
var arr = new Array(4);//建立了一個陣列，長度為4,裡面全是空值
複製程式碼

    ​

  2. 通過 陣列字面量 建立陣列

    var arr1 = []; //建立一個空陣列
var arr2 = [1, 2 , 3, 4]; //建立一個包含4個數值的陣列，多個陣列項以逗號隔開
var arr3 = [4]; // 建立一個陣列,元素只有1個,,,元素是4
複製程式碼

陣列的長度與下標

  • 陣列的長度 : 跟字串一樣,,,陣列有一個length 屬性,, 指陣列中存放的元素的個數 ;

    var str1 = 'abc';
console.log(str1.length);

var arr = [1,3,5,8];
console.log(arr.length);
複製程式碼

    ​

  • 陣列的下標 : 因為陣列有序的,有序的就應該有自己的序號,,而這個序號就是每個元素對應的下標, 下標從0 開始 , 到 arr.length-1 結束

      var arr = ['why','lisa','love'];
    arr[0];//下標0對應的值是why
    arr[2];//下標2對應的值是love

  var arr = ['why','lisa','love'];

  //           0    1    2

  // 下標 :  0 開始     arr.length-1 結束     長度:3 arr.length

複製程式碼

陣列的取值與賦值

  • 陣列的取值

    //格式：陣列名[下標]
//功能：  獲取陣列下標對應的那個值，如果下標不存在，則返回undefined。
// 下標範圍 :  0 ~ arr.length-1
var arr = ["red", "green", "blue"];
//
列印 : arr[0];//red
列印 : arr[2];//blue
列印 : arr[3];//這個陣列的最大下標為2,因此返回undefined
複製程式碼

    ​

  • 陣列的賦值

    //格式：陣列名[下標] = 值;
//如果下標有對應的值，會把原來的值覆蓋，
var arr = ["red", "green", "blue"];
arr[0] = "yellow";//把red替換成了yellow
// 如果下標不存在，會給陣列新增一個元素。
arr[3] = "pink";//給陣列新增加了一個pink的值

// 如果下標有跨度,,中間全是empty 不合法

// 特殊 : arr[arr.length] = 值
  arr[arr.length] = '哈';  
  arr[arr.length] = '你妹';  
複製程式碼

    ​

  • 思考 : 如何給一個陣列新增新的元素???? [重要]

    • arr[arr.length] = 值
    • arr.push(值)

陣列的遍歷

遍歷 : 對陣列的每一個元素都訪問一次就叫遍歷

陣列遍歷的基本語法：

// 傳統遍歷
arr[0];
arr[1]

// for遍歷 1-100 的演變

// 下標 :  0  arr.length-1
//   
for(var i =0; i < arr.length; i++) {
	//陣列遍歷的固定結構
}
複製程式碼

氣泡排序

  1. 初級版本
  2. 中級版本

宣告：我們今天主要是學習陣列遍歷的語法，對於這種數學燒腦類的題目，想不到是很正常的 ,

//1. 介紹什麼氣泡排序?

思考1 : i < arr.length 是遍歷幾次   i < arr.length-1  是遍歷幾次     
思考2 : 交換兩個變數
思考3 :陣列中的最大值放到最後    var arr  = [5, 4, 3, 2, 1]; 

//2. 氣泡排序演算法的運作如下：
//比較相鄰的元素。如果第一個比第二個大，就交換他們兩個。
//對每一對相鄰元素作同樣的工作，從開始第一對到結尾的最後一對。在這一點，最後的元素應該會是最大的數。
//針對所有的元素重複以上的步驟，除了最後一個。
//持續每次對越來越少的元素重複上面的步驟，直到沒有任何一對數字需要比較。 [1] 
複製程式碼

5 4 3 2 1

1,2,3,5,4

var isJiaoHuan = '沒有交換';


//思路：判斷，如果一趟下來，一次交換都沒有做，說明就已經排好序，就不需要繼續比
//var arr = [65, 97, 76, 13, 27, 49, 58];
var arr = [1, 2, 3, 4, 5, 6, 7];

var tang = 0;
var ci = 0;
for (var i = 0; i < arr.length - 1; i++) {
  tang++;
  var count = 0;//記錄交換的次數
  //思路： 兩兩比較，如果前面的大於後面的，交換位置
  for (var j = 0; j < arr.length - 1 - i; j++) {
    ci++;
    if (arr[j] > arr[j + 1]) {
      count++;
      var temp = arr[j];
      arr[j] = arr[j + 1];
      arr[j + 1] = temp;
    }
  }
  console.log(count);
  if (count == 0) {
    //說明，沒有進行交換
    break;
  }
}


console.log(arr);
console.log(tang, ci);
複製程式碼

相關文章