深入浅出javascript数组

深入浅出javascript数组

javascript数组特点

1. javascript无处不对象，数组也是特殊的对象；
2. javascript数组是动态的及在创建数组时无需声明数组的长度；
3. javascript数组继承自Array.prototype中的属性，有一整套丰富的数组操作方法；

如何创建数组

1.使用数组直接量是最简单的方法

var array = [];  //创建一个空的数组
var array_1 = [1,true,"123",,]

2.使用构造函数

var array = new Array();
var array_1 = new Array(10);
var array_2 = new Array(1,2,true,,)

数组的读写

1. 使用 [ ] 可以对数组的一个元素进行读写操作

    var array = new Array(1,2,3,4,5,6,7);
    var i = 3
    array[i] = 4;
    array[array[i-1]] = array[i+1]

2. 数组与对象

数组其实是对象的特殊形式，它集成自Array.prototype。因此需要区分清楚对象的属性已经数组的索引。

所有的索引都是属性名，但只有在0~2^32-2之间的整数属性名才能是索引。所有的数组都是对象，可以为其创建任意名字的属性值。

1. 数组的长度
   每一个数组都有一个length属性，针对稠密数组（索引值连续），length属性值为数组中元素的个数，针对稀疏数字（索引值非连续），length属性值大于元素的个数。
   可以巧用length属性进行删除数组元素

var a = [1,2,3,4];
a,length = 3    // => a = [1,2,3]
a.length = 0   // 删除a数组中所有的元素

数组的 “查”——数组遍历

1. for();
   
var keys = Object.keys(o);
for(var i =0;i<keys.lengths;i++){} //最常用的方法
for(var i =0，len =keys.lengths;i<len;i++){} //优化后，其实没有必要每次都计算keys的长度

   但是这里有个问题，在遍历稠密数组时，并不会出现问题，可以一旦碰到稀疏数组，就会遇到不少麻烦，因此在使用for（）遍历稀疏数组时，最好可以加入判断语句
   
for(var i =0;i<a.length;i++){
if(!a[i]) continue; //跳过null、undefined、和不存在的元素
if( !(i in a) ) continue; //跳过不存在的元素；
}


2. for( … in …);
   有人认为for/in是更好的选择，其实不是。for/in在遍历时会遍历继承的属性名。因此还需要加一些判断(不建议使用)

   var keys = Object.keys(o);
   for( i in keys){
       if( ! keys.hasOwnProperty(i)) continue;
   }
   

3. forEach();
   fotEach是ES5中定义的一个新的方法，适合装逼

  var data = [1,2,3,4,5];
  var sumOfSqu = 0;
  data.forEach(function(x){
          sumOfSqu += x*x;
      })
  console,log(sumOfSqu )    // => 55   

数组的“增”与“减”

1.push（）与pop（）

1.push（）方法
push()方法允许将在数组尾部添加一个或多个数组，并返回新数组的长度。
2.pop（）方法
pop方法将从数组尾部删除一个元素，并将其返回；
因此push（）与pop（）相结合，可以组成一个先进后出的栈。

2.shift（）与unshift（）

1.unshift（）方法
unshift（）方法将在数组头部添加一个或多个数组，并重新计算索引值，并返回新的数组长度。
2.shift（）方法
shift（）方法将从数组的头部删除一个元素，并重现计算索引值，然后返回新的数组长度。

数组的“改”

1. join（）；

join（）方法将数组中的元素连接起来，并返回字符串，值得注意的有两点，a).join方法并不会改变原来的字符串，b).join（）方法可以制定一个参数作为连接的符号。c).当连接稀疏数组时会出现如下情况

var a = [1,2,3];
a.join()      // =>"1,2,3"   
a;            // => [1, 2, 3];
a.join("_")   // => "1_2_3"
a;            // => [1, 2, 3];
delete a[1]   // => true ;
a;            // => [1, undefined × 1, 3]
a.join()      // => "1,,3"
a = new Array(10)
a.join()      // => ",,,,,,,,,"

2. reverse（）

reversr()方法用来颠倒数组的排序，并返回排序后的数组。需要注意的是这里采用了替换，直接修改了原数组。

var b = [1,2,3,4,[5,6],7];
b.reverse()      // => [7, [ 5 , 6 ], 4, 3, 2, 1]
b;               // => [7, [ 5 , 6 ], 4, 3, 2, 1]

3. sort（）

sort()用来进行数组排序，当没有指定排序函数时，默认按照字母表进行排序，并将undefined甩至数组尾部，并返回新的数组。sort()同样修改了原数组。
sort()方法可以传递一个排序函数，

var a = [2,1,4,3,7];
a.sort();               // => [1, 2, 3, 4, 7];
a;                      // => [1, 2, 3, 4, 7];
a.sort(function(a,b){
    return b-a;        //返回0,顺序不变；返回-1；a在前；返回1；b在前；
})                     // => [7, 4, 3, 2, 1]

4. concat（）；

concat（）的功能是创建并返回一个新的数组，直接举栗子。

var a = [1,2,3,[4,5]];
a.concat(6,7,[8,[9,10]]);   //  => [1,2,3,[4,5],6,7,8,[9,10]];
a；                         //  => [1,2,3,[4,5]];

我们可以注意到，concat（）方法不会修改数组本身，其次，如果concat（）参数中如果有数组的话，它会将直接连接数组的元素。但是只能‘拆解’一层，无法实现递归，使数组扁平化。

5. slice（）；

slice（）用来切割返回新的数组 ，并不对原数组进行修改；
slice（）参数可正可负，当为非负时，默认从右边第一位开始，对应的参数值为0，当为正时，默认从左边第一位开始，切割至结束数组尾部；

var a = [1, 2, 3, [4, 5], 6, 7, 8, [9, 10]];
a.slice(-3);       // => [7, 8, [9, 10]]
a.slice(-1);       // => [9, 10];
a.slice(5);        // => [7, 8, [9, 10]]
a.slice(-3,-1);    // => [7, 8]
a.slice(3,5);      // => [[4, 5], 6]
a;                 // => [1, 2, 3, [4, 5], 6, 7, 8, [9, 10]]

6. splice（）；

不同于 concat（）与 slice（）方法，splice（）会修改原数组。还有一个特点是splice（）可以同时完成删除与添加操作，且会重新计算索引。splice（）的参数同样可以为负数。

var a = [1,2,3,4,5];
a.splice(-2);       // => [4, 5]     第一个参数为删除元素的其实位置
a;                  // => [1, 2, 3]
var a = [1,2,3,4,5];
a.splice(1,2,'a','b','c');  // => [2, 3]  第二参数为删除元素的个数
a；   // => [1, "a", "b", "c", 4, 5]
     // 从第三个参数开始为添加的元素。

7. map（）；

map（）方法将数组中的每个元素传递给调用的函数，并返回新的数组。

var a = [1,2,3,4,5]
b = a.map(function(e){
            return e*e;
        })
b;                //  =>  [1, 4, 9, 16, 25]

8. filter（）；

filter（）用来筛选数组

var a = [1,2,3,4,5]
a.filter(function(e){ return e>3})  // => [4, 5]

9. every（）与some（）；

every（）用来判断所有的数组原则均满足条件，而some只需有一个即可。

var a = [1,2,3,4,5];
a.every(function(e){return e<7})  // => true
a.every(function(e){return e<3})  // => false
a.some(function(e){return e<3})   // => true

10. reduce（）与reduceRight（）

var a = [1,2,3,4,5];
a.reduce(function(a,b){return a+b},0); // => 15  数组求和
a.reduce(function(a,b){return a*b},1); // => 120 数组连乘
a.reduce(function(a,b){return (a>b)?a:b}); // => 求最大值 

11. indexOf（）与lastIndexOf（）

用来搜素数组，并返回首次出现的位置，没有匹配到则返回-1。indexOf从头至尾搜索，lastIndexOf从尾至头搜索。

---