JavaScript基础(三)

JavaScript

---

一、数组基本概念

1、数组定义：类型相同的数据的集合
2、创建数组的方式：

（1)数组名 = newArray()
 (2)数组名 = [ ]

// 使用new Array()创建数组
var arr1 = new Array();
// 使用字面量来创建数组
var arr1 = [];

3、数组的访问：使用索引来访问数组中的元素（索引即为下标）

(1)数组的索引值从0开始到数组的长度减1
(2)数组创建后，都有一个属性length代表数组的长度(数组元素的个数)
(3)通过循环来访问数组元素

var arr = ['苹果', '橘子', '香蕉', '桃子'];
console.log(arr[0]);	// 输出结果：苹果
console.log(arr[1]);	// 输出结果：橘子
console.log(arr[2]);	// 输出结果：香蕉
console.log(arr[3]);	// 输出结果：桃子
console.log(arr[4]);
// 输出结果：undefined（数组元素不存在）

4、数组的遍历
数组遍历是将数组中的元素全部访问一遍，可以利用for循环来实现，在for循环中让索引从0开始自增,如果数组元素比较多时，计算数组元素的个数不太方便，这时候可以利用“数组名.length”来快速地获取数组长度

二、数组练习

1、获取数组元素中的最大值

var arr = [2, 6, 1, 77, 52, 25, 7, 99];
var max = arr[0];
for (var i = 1; i < arr.length; i++) {
  if (arr[i] > max) {    max = arr[i];   }
}
console.log('数组元素中的最大值是：' + max);	// 计算结果：99

2、数组转换为字符串

var arr = ['red', 'green', 'blue', 'pink'];
var str = arr[0];
var sep = '|';
for (var i = 1; i < arr.length; i++) {
  str += sep + arr[i];
}
console.log(str);	// 输出结果：red|green|blue|pink

三、数组元素操作

1、修改数组长度：使用“数组名.length”可以获取或修改数组的长度
①获取数组长度

var arr = ['a', 'b', 'c'];
console.log(arr.length);	// 输出结果：3

②修改数组长度

var arr1 = [1, 2];
arr1.length = 4; 		// 大于原有长度
console.log(arr1); 	// 输出结果：(4) [1, 2, empty × 2]
var arr2 = [1, 2, 3, 4];
arr2.length = 2;		// 小于原有长度 
console.log(arr2);     	// 输出结果：(2) [1, 2]

③访问空元素时，返回结果为undefined

var arr1 = [1, 2];
var arr = [1];
arr.length = 4;		// 修改数组的长度为4
console.log(arr);	 	// 输出结果：(4) [1, empty × 3]
console.log(arr[1]);	// 输出结果：undefined

④出现空元素的其他常见情况

/ 情况1：在使用字面量创建数组时出现空元素
var arr = [1, 2, , 4];
console.log(arr);	                // 输出结果：(4) [1, 2, empty, 4]
// 情况2：在new Array()中传入数组长度的参数
var arr = new Array(4);
console.log(arr);		// 输出结果：(4) [empty × 4]
// 情况3：为数组添加索引不连续的元素
var arr = [1];
arr[3] = 4;		// 向数组中添加一个元素，索引为3
console.log(arr);		// 输出结果：(4) [1, empty × 2, 4]

2、新增或修改数组元素：
如果给定的索引超过了数组中的最大索引，则表示新增元素，否则表示修改元素

var arr = ['red', 'green', 'blue'];
arr[3] = 'pink';	   // 新增元素
console.log(arr);	   // (4) ["red", "green", "blue", "pink"]
arr[0] = 'yellow';	   // 修改元素
console.log(arr);	   // (4) ["yellow", "green", "blue", "pink"]

3、筛选数组元素
案例：将一个数组中所有大于或等于10的元素筛选出来，放入到新的数组中

var arr = [2, 0, 6, 1, 77, 0, 52, 0, 25, 7];
var newArr = [];
var j = 0;
for (var i = 0; i < arr.length; i++) {
  if (arr[i] >= 10) {
    newArr[j++] = arr[i];    // 新数组索引号从0开始，依次递增
  }
}
console.log(newArr);       // 输出结果：(3) [77, 52, 25]

4、删除指定的数组元素
案例：将一个数组中的所有数值为0的元素删除

var arr = [2, 0, 6, 1, 77, 0, 52, 0, 25, 7];
var newArr = [];
for (var i = 0; i < arr.length; i++) {
  if (arr[i] != 0) {
    newArr[newArr.length] = arr[i];
  }
}
console.log(newArr);	// 输出结果：(7) [2, 6, 1, 77, 52, 25, 7]

5、反转数组元素顺序
案例：将一个数组中所有元素的顺序反过来

  A、借助中间临时数组
  B、通过下标的控制

var arr = [1,2,3,4,5,6,7,8];


//法一
// for(var i = 0;i < arr.length / 2;i++){
//     var t = arr[i];
//     arr[i] = arr[arr.length - 1 - i];
//     arr[arr.length - 1 - i] = t;
// }
// console.log(arr);

//法二
var i = 0;
var j = arr.length - 1;
while(i < j){
    var t = arr[i];
    arr[i] = arr [j];
    arr[j] = t;
    i++;
    j--;
}
console.log(arr);

四、查找算法

1、顺序查找：依次比较每个元素

var arr = [11,22,33,44,55,66,77,88,99];
var t = prompt("请输入要查找的数: ");

for(var i = 0;i < arr.length;i++){
    if(parseInt(t) === arr[i]){
        console.log('找到了，索引是：'+i);
        break;
    }  
}
if(i >= arr.length){
    console.log("没有找到");
}

2、二分法查找（折半查找）：被查找的序列(数组)必须是有序的

var arr = [11,22,33,44,55,66,77,88,99];
var t = prompt("请输入要查找的数: ");

var i = 0;
var j = arr.length - 1;
var mid = (i + j) / 2;

while(i < j){
    if(arr[mid] ==t){
        console.log(arr[mid]);
        console.log('找到了，下标是：'+mid);
        break;
    }else if(arr[mid] > t){
        j = mid - 1;
    }else{
        i = mid + 1;
    }
}
if(i > j){
    console.log("没有找到");
}

五、排序算法

1、冒泡排序（升序）:数组元素依次进行两两比较，若两个元素存在大小关系就进行交换，直到数组有序
核心代码

for(var i = 0;i < arr.length;i++){      //外循环:控制排序的趟数
    for(var j = 0;j < arr.length - 1;j++){  //内循环：让数据进行两两比较，若存在大小关系就交换
        if(arr[j] > arr[j + 1]){
            var t = arr[j];
            arr[j] = arr[j + 1];
            arr[j + 1] = t;
        }
    }
}

2、选择排序（升序）：每次从当前无序序列中找最小数记住其下标，让这个最小数与当前无序序列的第一个数进行交换，循环操作直到数组有序
核心代码：

for(var i = 0;i < arr.length;i++){
    var k = i;
    var min = arr[k];
    for(var j = i + 1;j < arr.length;j++){
        if(min > arr[j]){
            min = arr[j];
            k = j;
        }
    }
    if(k != i){
        var t = arr[i];
        arr[i] = arr[k];
        arr[k] = t;
    }
}

3、插入排序：通过构建有序数组元素的存储，对未排序的数组元素，在已排序的数组中从最后一个元素向第一个元素遍历，找到相应位置并插入
核心代码

for (var i = 1; i < arr.length; i++) {
//遍历并比较一个无序数组元素与所有有序数组元素
  for (var j = i; j > 0; j--) {if (arr[j - 1] > arr[j]) {
      var temp = arr[j - 1];
      arr[j - 1] = arr[j];
      arr[j] = temp;
    } }
}

六、二维数组

1、定义方式

(1) 数组名 = new Array(new Array(12,23,34),new Array(45,56,78))
(2) 数组名 = [[11,22,33,44],[55,66,77]]

2、数组元素访问方式：

 数组名[下标1][下标2]
 若"下标1"为行下标，"下标2"为列下标，则是按行优先访问
 若"下标1"为列下标，"下标2"为行下标，则是按列优先访问

3、练习
①二维数组求和

var arr = [[12, 59, 66], [100, 888]];
var sum = 0;
for (var i = 0; i < arr.length; i++) {	     // 遍历arr数组
  for (var j = 0; j < arr[i].length; j++) {   // 遍历arr[i]数组
    sum += arr[i][j];	                    // 二维数组元素累加
  }
}
console.log(sum);	// 输出结果：1125

②二维数组的转置

var arr = [
  ['a', 'b', 'c'], ['d', 'e', 'f'], ['g', 'h', 'i'], ['j', 'k', 'l']
];
var res = [];
for (var i = 0; i < arr[0].length; i++) {
  res[i] = [];
  for(var j = 0; j < arr.length; j++) {	
    res[i][j] = arr[j][i];	// 为二维数组赋值
  }
}
console.log(res);