JavaScript 之 Array 对象

Array 对象

　　之前已经了解了 Array（数组）的定义和基本操作。数组的基本操作。

　　下面来学习更多的方法。

检测一个对象是否是数组

instanceof                   // 看看该变量是否是该对象的实例
 
Array.isArray(变量名/参数)     // HTML5 中提供的方法，有兼容性问题

　　注意：instanceof 用法

变量名 instanceof 构造函数

　　instanceof 不仅仅局限于数组，也可以用来检测其他的对象，用法相同。

输出数组

toString()                 // 把数组转化为字符串，用逗号分隔每一项

valueOf()                  // 返回数组对象本身

常用方法

　　1、栈操作（先进后出）

push()                    // 将一个或多个元素添加到数组的末尾，并返回该数组的新长度。
pop()                     // 去除数组中的最后一项，并返回该元素的值,修改 length 属性 

　　2、队列操作（先进先出）

push()                   // 将一个或多个元素添加到数组的末尾，并返回该数组的长度
shift()                  // 取出数组中的第一个元素，修改 length 属性
unshift()                // 在数组最前面插入项，返回数组的长度

　　3、排序方法

reverse()                // 翻转数组
sort()                   // 默认排序顺序是在将元素转换为字符串，然后比较它们的UTF-16代码单元值序列时构建的

　　4、操作方法

concat(参数)              // 把参数拼接到当前数组
slice(begin,end)         // 把当前数组中截取一个新的数组，不影响原来的数组（包括 begin,不包括 end）

splice()                 // 删除或替换现有元素或者原地添加新的元素来修改数组,并以数组形式返回被修改的内容。此方法会改变原数组。

　　5、位置方法

indexof()                // 返回在数组中可以找到一个给定元素的第一个索引，如果不存在，则返回-1。
lastindexof()            // 返回指定元素在数组中的最后一个的索引，如果不存在则返回 -1。从数组的后面向前查找，

　　6、迭代方法（不会修改原数组 HTML5中的方法）

every()                  // 测试一个数组内的所有元素是否都能通过某个指定函数的测试。它返回一个布尔值。(若收到一个空数组，此方法在一切情况下都会返回 true。)
filter()                 // 创建一个新数组, 其包含通过所提供函数实现的测试的所有元素。
forEach()                // 对数组的每个元素执行一次提供的函数
map()                    // 创建一个新数组，其结果是该数组中的每个元素都调用一个提供的函数后返回的结果。
some()                   // 测试是否至少有一个元素可以通过被提供的函数方法。该方法返回一个Boolean类型的值。

　　7、连接至字符串方法

join(参数)                // 将数组的所有元素使用参数连接到一个字符串，若没有参数，使用逗号进行连接

　　8、清空数组方法

arr = [];                // 推荐使用

arr.length = 0;

arr.splice(0,arr.length);

 案例：

　　1、将一个字符串数组输出为 | 分割的形式。如'a|b|c|d'。使用两种方式实现。

// 方式一
　　var array = [a,b,c,d,e,f];
　　console.log(array.join('|'));
// 方式二
function myJoin(array, seperator) {
  seperator = seperator || ',';
  array = array || [];
  if (array.length == 0){
    return '';
  }
  var str = array[0];
  for (var i = 1; i < array.length; i++) {
    str += seperator + array[i];
  }
  return str;
}
var array = [6, 3, 5, 6, 7, 8, 0];
console.log(myJoin(array, '-'));

 

　　2、将一个字符串数组的元素的顺序进行翻转。使用两种方式。

// 方式一
　　var array = ['a','b','c','e','f'];
　　console.log(array.reverse());
// 方式二
function myReverse(arr) {
  if (!arr || arr.length == 0) {
    return [];
  }
  for (var i = 0; i < arr.length / 2; i++) {
    var tmp = arr[i];
    arr[i] = arr[this.length - i - 1];
    arr[arr.length - i - 1] = tmp;
  }
  return arr;
}

var array = ['a', 'b', 'c'];
console.log(myReverse(array));

 

　　3、工资的数组[1500, 1200, 2000, 2100, 1800],把工资超过2000的删除。

// 方式一
var array =  [1500,1200,2000,2100,1800];
var tmpArray = [];
for (var i = 0; i < array.length; i++) {
  if(array[i] < 2000) {
    tmpArray.push(array[i]);
  }
}
console.log(tmpArray);
// 方式二
var array =  [1500, 1200, 2000, 2100, 1800];
array = array.filter(function (item, index) {
  if (item < 2000) {
    return true;
  }
  return false;
});
console.log(array);

 

　　4、["c", "a", "z", "a", "x", "a"]找到数组中每一个a出现的位置。

var array =  ['c', 'a', 'z', 'a', 'x', 'a'];
var  index = -1;
do {
  index = array.indexOf('a',index + 1);
  if (index !== -1){
    console.log(index);
  }
} while (index > 0);

 

　　5、编写一个方法去掉一个数组的重复元素。

function clear(arr) {
      // 1 如何获取数组中每一个元素出现的次数
      var o = {}; // 记录数组中元素出现的次数
      for (var i = 0; i < arr.length; i++) {
        var item = arr[i]; // 数组中的每一个元素
        // o[item] = 1;
        // 判断o对象是否有当前遍历到的属性
        if (o[item]) {
          // 如果o[item] 存在，说明次数不为1
          o[item]++;
        } else {
          // 如果o[item] 不存在，说明是第一次出现
          o[item] = 1;
        }
      }
      // console.log(o);

      // 2 生成一个新的数组，存储不重复的元素
      var newArray = [];
      // 遍历对象o中的所有属性
      for (var key in o) {
        // 判断o对象中当前属性的值是否为 1  如果为1 说明不重复直接放到新数组中
        if (o[key] === 1) {
          newArray.push(key);
        } else {
          // o对象中当前属性 次数不为1 ，说明有重复的，如果有重复的话，只存储一次
          // 判断当前的newArray数组中是否已经有该元素  
          if (newArray.indexOf(key) === -1) {
            newArray.push(key);
          }
        }
      }
      return newArray;
    } 

    var array = ['c', 'a', 'z', 'a', 'x', 'a'];
    var newArray = clear(array);
    console.log(newArray);

　　6、sort排序。

var arr = [25, 10, 108, 18];
    // 默认情况下的sort是对字符编码 从小到大排序
arr.sort();
console.log(arr);

// 除了默认排序外，还可以指定比较器
function compare1(a, b) {
  return a - b;
}
function compare2(a, b) {
  return b - a;
}
arr.sort(compare1);
arr.sort(compart2);

// 还可以直接指定比较器
arr.sort(function (a,b) {
   return a - b; 
})

 

　　7、模拟 sort 内部实现。

// 对数组排序，从小到大  -- 冒泡排序
    function sort(array, fnCompare) {
      // 外层循环 控制趟数
      for (var i = 0; i < array.length - 1; i++) {
        // 假设排好序了
        var isSort = true;
        // 内层循环 控制比较的次数
        for (var j = 0; j < array.length - 1 - i; j++) {

          if (fnCompare(array[j], array[j + 1]) > 0) {
            isSort = false;
            // 交换位置
            var tmp = array[j];
            array[j] = array[j + 1];
            array[j + 1] = tmp;
          }
        }
        // 判断是否排好了
        if (isSort) {
          break;
        }
      }
    } 

    var arr = [56, 10, 1, 17];
    

    sort(arr, function (a, b) {
      return b - a;
    })

    console.log(arr);