引用类型-Array类型

EAMAScript数组的每一项可以保存任何类型的数据

1.创建数组

• 使用Array构造函数

var animals = new Array();                                    //无参数时，创建一个空数组
var animals = new Array(20);                                  //只有一个数字参数时，创建一个长度为20的空数组
var animals = new Array(20,9);                                //多个数字参数时，参数作为初始化数据，创建一个数组[20,9]
var animals = new Array("dog","cat","rabbit");                //创建一个包含3个字符串的数组
var animals = new Array("elephant");                          //创建一个包含一项的数组

• 数组字面量方法

var animals = ["dog","cat","rabbit"];          //创建一个包含3个字符串的数组
var animals = [];                              //创建一个空数组
var animals = [1,2,];                          //不推荐写法；会创建一个包含2项或3项的数组
var animals = [,,,,,]                          //不推荐写法；会创建一个包含5项或6项的数组

2.访问值和设置值

var animals = ["dog","cat","rabbit"]; 
console.log( animals[0] );               //dog；按索引访问显示数组第一项
animals[2] = "elephant";                 //修改数组第三项
console.log(animals);                    //["dog", "cat", "elephant"]
animals[3] = "zebra";                    //新增第四项
console.log(animals);                    //["dog", "cat", "elephant", "zebra"]

3.length属性

• 数组的项数也就是长度保存在length属性中
• length属性不是只读的
• 数组最后一项的索引是length - 1

var animals = ["dog","cat","rabbit"]; 
console.log(animals.length);           //3

animals.length = 2;                    //移除数组最后一项
console.log( animals[2] );             //undefined
console.log(animals);                  //["dog", "cat"]

animals.length = 3;                    //新增数组最后一项
console.log( animals[2] );             //undefined
console.log(animals.length);           //3

var animals = ["dog","cat","rabbit"];
animals[animals.length] = "elephant";      //末尾添加
console.log(animals);                      //["dog", "cat", "rabbit", "elephant"]

var animals = ["dog","cat","rabbit"];
animals[99] = "zebra";                    //在数组索引99添加一个字符串"zebra"
console.log(animals.length);              //100；该数组其中3-98索引的值都为undefined

4.转换方法

• toString()：调用数组每一项的该方法，返回由数组中的每个值的字符串形式拼接成的字符串；alert()要接收字符串参数，因此会后台调用 toString()方法

var animals = ["dog","cat","rabbit"]; 
console.log( animals.toString() );            //dog,cat,rabbit
alert(animals);                               //dog,cat,rabbit

• valueOf()：返回的还是个数组

var animals = ["dog","cat","rabbit"]; 
console.log( animals.valueOf() );            //["dog", "cat", "rabbit"]

• toLocaleString()：类似toString()方法，调用数组每一项的该方法并返回一个字符串
• join()：使用不同分隔符将数组连接成字符串；只接收一个参数，用来作为分隔符的字符串，返回包含所以数组项的字符串

var num = [1,2,3,4,5];
console.log( num.join("-") );          //1-2-3-4-5
console.log( num.join() );             //1,2,3,4,5；不传参的情况下，则默认使用逗号分隔，相当于toString()
console.log(num);                      //[1, 2, 3, 4, 5]；该方法不改变原数组

• split()：将一个String对象分割成字符串数组

var str = "hello my name is hunger";
console.log( str.split(" ") );       //["hello", "my", "name", "is", "hunger"]

5.栈方法

• 栈是一种LIFO（Last-In-First-Out）后进先出的数据结构，栈中项的推入和弹出只发生在栈的顶部
• push()：接收任意数量的参数，逐个添加到数组末尾，返回修改后数组的长度

var animals = ["dog","cat","rabbit"]; 
console.log( animals.push("elephant","zebra") );       //5
console.log(animals);                                  //["dog", "cat", "rabbit", "elephant", "zebra"]；改变原数组

• pop：从数组末尾移除最后一项，返回移除项

var animals = ["dog", "cat", "rabbit", "elephant", "zebra"]; 
console.log( animals.pop() );                          //zebra
console.log(animals);                                  //["dog", "cat", "rabbit", "elephant"]；改变原数组

6.队列方法

• 队列数据结构的访问规则是FIFO（First-In-First-Out）；队列在末端添加项，前端移除项
• unshift()：在数组前端添加任意个项并返回新数组的长度

var animals = ["rabbit", "elephant", "zebra"]; 
console.log( animals.unshift("dog","cat") );           //5
console.log(animals);                                  //["dog", "cat", "rabbit", "elephant", "zebra"]；改变原数组

• shift()：移除数组中的第一项并返回被移除项

var animals = ["rabbit", "elephant", "zebra"]; 
console.log( animals.shift() );                        //rabbit
console.log(animals);                                  //["elephant", "zebra"]；改变原数组

7.重排序方法

• reverse()：反转数组项的顺序

var num = [0,1,2,3,4,5];
console.log( num.reverse() );      //[5, 4, 3, 2, 1, 0]
console.log(num);                  //[5, 4, 3, 2, 1, 0]；改变原数组

• sort()：升序排列数组，调用数组的每一项的toString()方法，然后比较得到的字符串；即使数组中的每一项都是数值，比较的依然是字符串；但这种排序方式不太实用，因此sort()方法可接收一个比较函数作为参数，来确定哪个值位于哪个值的前面

var num = [0,1,5,10,15];
console.log( num.sort() );      //[0, 1, 10, 15, 5]；根据字符串排序的结果
console.log(num);               //[0, 1, 10, 15, 5]；改变原数组
//带参数的情况：
//比较函数接收2个参数，value1和value2，如果value1在value2之前则返回负数，如果value1等于value2则返回0，如果value1在value2之后则返回正数
var arr = [1,3,5,2,4,6];
function compare1(value1,value2){
      return value1 - value2;      
}
function compare2(value1,value2){
     return value2 - value1;
}
var result1 = arr.sort(compare1);
console.log(result1);                 //[1, 2, 3, 4, 5, 6]
var result2 = arr.sort(compare2);    
console.log(result2);                 //[6, 5, 4, 3, 2, 1]

8.操作方法

• concat()：用于拼接数组，基于当前数组中的所有项创建一个新数组

var animals = ["rabbit", "elephant", "zebra"]; 
var arr = animals.concat();                     //无参数时仅复制当前数组并返回新数组
console.log(arr);                               //["rabbit", "elephant", "zebra"]
var arr = animals.concat("dog",1,[2,3,4]);      //参数为数组时将数组中的每一项添加进去
console.log(arr);                               //["rabbit", "elephant", "zebra", "dog", 1, 2, 3, 4]；生成新数组
console.log(animals);                           //["rabbit", "elephant", "zebra"]；不改变原数组

• slice()：基于当前数组中的一个或多个项创建一个新数组；有2个参数时分别表示起始位置和结束位置，当只有一个参数时表示只有起始位置

var num = [0,1,2,3,4,5];
console.log( num.slice(1) );        //[1, 2, 3, 4, 5]；只有一个参数，表示从起始位置至当前数组末尾
console.log( num.slice(1,4) );      //[1, 2, 3]；有2个参数时，返回的新数组不包括结束位置的项
console.log( num.slice(4,1) );      //[ ]；起始位置小于结束位置时，返回空数组
console.log( num.slice(1,-1) );     //[1,2,3,4]；参数为负数时，用数组长度加上该数计算，则num.slice(1,5)
console.log(num);                   //[0,1,2,3,4,5]；不改变原数组

• splice()：最强大的数组方法，主要用途是向数组的中部插入项
  • 删除：可以删除任意数量的项，需指定2个参数：删除的起始位置和删除的项数

var num = [0,1,2,3,4,5];
console.log( num.splice(1,2) );        //[1, 2]；返回被删除的项
console.log(num);                      //[0,3,4,5]；改变原数组

• 插入：可以向指定位置插入任意数量的项，需提供3个参数：插入的起始位置，0（删除的项数，因为是插入所以为0）和要插入的项

var num = [0,1,2,3,4,5];
console.log( num.splice(2,0,"cat","milk") );         //[ ]；因为没被删除的项，所以返回空数组  
console.log(num);                                    //[0, 1, "cat", "milk", 2, 3, 4, 5]；改变原数组

• 替换：可以向指定位置插入任意数量的项，且删除任意数量的项，需3个参数：起始位置，要删除的项数和要插入的任意项；插入的项数与删除的项数不需要相等

var num = [0,1,2,3,4,5];
console.log( num.splice(1,4,"cat","milk") );     //[1, 2, 3, 4]；返回被删除的项      
console.log(num);                                //[0, "cat", "milk", 5]；改变原数组

9.位置方法

• indexOf()：返回要查找的项的索引（比较查找项与数组的每一项时使用全等操作符），从数组开头开始查找；接收2个参数：要查找的项和查找的起点位置（可选，默认从0开始）；
• lastIndexOf()：返回要查找的项的索引（比较查找项与数组的每一项时使用全等操作符），从数组末尾开始查找；接收2个参数：要查找的项和查找的起点位置（可选，默认从0开始）；

var arr = [0,3,9,"milk",2,9,"cat",5];
console.log( arr.indexOf(9) );          //2；从开头查找第一个数字9
console.log( arr.indexOf(9,3) );        //5；从下标为3的位置（"milk"）开始查找数字9
console.log( arr.lastIndexOf(9) );      //5；从末尾开始查找数字9，返回其在数组中的索引值
console.log( arr.lastIndexOf(9,3) );    //2；从末尾下标3查找
console.log( arr.lastIndexOf(4) );      //-1；没找到时返回-1

10.迭代方法

• 每个方法都接收2个参数：要在每一项都运行的函数和运行该函数的作用域对象（影响this的值，可选）；其中每个函数接收3个参数：数组每一项的值，索引值及数组对象本身
  • every()和some()：都用于查询数组的项是否满足某个条件，返回一个布尔值

var num = [1,2,3,4,5,4,3,2,1];
var everyResult = num.every(function(item,index,array){
        return (item > 2);        //如果数组的每一项都大于2返回true，否则返回false
})
console.log(everyResult);     //fasle；如果函数对每一项都返回true，则返回true，否则返回false
console.log(num);             //[1, 2, 3, 4, 5, 4, 3, 2, 1]；不改变原数组

var num = [1,2,3,4,5,4,3,2,1];
var everyResult = num.some(function(item,index,array){
        return (item > 2);        //如果数组中任意一项大于2返回true，否则返回false
})
console.log(everyResult);     //true；如果函数对任意一项返回true就返回true，否则返回false
console.log(num);             //[1, 2, 3, 4, 5, 4, 3, 2, 1]；不改变原数组

• filter()：利用指定函数确定是否包含某一项；对查询是否符合某些条件很有用，返回一个满足函数的数组项组成的数组

var num = [1,2,3,4,5,4,3,2,1];
var everyResult = num.filter(function(item,index,array){
        return (item > 2);        //返回一个所有数值都大于2的数组
})
console.log(everyResult);     //[3, 4, 5, 4, 3]；创建一个新数组每一项都满足函数 
console.log(num);             //[1, 2, 3, 4, 5, 4, 3, 2, 1]；不改变原数组

• map()：返回每次函数调用的结果组成的数组

var num = [1,2,3,4,5,4,3,2,1];
var everyResult = num.map(function(item,index,array){
        return (item * 2);        //让数组每一项都乘2
})
console.log(everyResult);     //[2, 4, 6, 8, 10, 8, 6, 4, 2]；返回数组每一项都执行函数后的结果组成的新数组
console.log(num);             //[1, 2, 3, 4, 5, 4, 3, 2, 1]；不改变原数组

• forEach()：对数组的每一项执行给定函数，没有返回值；本质上与for循环遍历数组一样

var num = [1,2,3,4,5,4,3,2,1];
var everyResult = num.forEach(function(item,index,array){
        //执行某操作
})

11.归并方法

• reduce()和reduceRight()：遍历数组，调用回调函数，将数组元素组合成一个值并返回；reduce从索引最小值开始，reduceRight反向；接收2个参数：函数和初始值（可选）

var num = [1,2,3,4,5];
var value = num.reduce(function(prev,cur,index,array){     //4个参数分别为前一个值、当前值、索引值和数组对象
        return prev + cur;
})
console.log(value);     //15
//第一次迭代发生时，数组前两项分别是第一、二个参数，函数的返回值会作为第一个参数传给下一项
//比如第一次迭代1+2=3，那么3就作为下一次迭代的第一个参数
console.log(num);       //[1, 2, 3, 4, 5]；不改变原数组

var num = [1,2,3,4,5,6];
var value = num.reduceRight(function(prev,cur,index,array){
        return prev - cur;
},100)                  //初始值（prev）为100，
console.log(value);     //79
console.log(num);       //[1, 2, 3, 4, 5]；不改变原数组 

12.用splice实现push、pop、shift、unshift方法

var arr = [1,2,3,4,5];
var pushArr = arr.splice(arr.length,0,9,99,999);        //[1, 2, 3, 4, 5, 9, 99, 999]
var popArr = arr.splice(arr.length-1,1);          //[1, 2, 3, 4]
var shiftArr = arr.splice(0,1);            //[2, 3, 4, 5]
var unshiftArr = arr.splice(0,0,9,99,999);         //[9, 99, 999, 1, 2, 3, 4, 5]

13.写一个find函数，实现下面的功能

var arr = [ "test", 2, 1.5, false ];
find(arr, "test");          // 0
find(arr, 2);               // 1
find(arr, 0);               // -1

var arr = [ "test", 2, 1.5, false ];

function find(array,item){
    if ( array.length > 0 ){
        for(var i=0;i<array.length;i++){
            if ( item === array[i] ) {
                return i;        //本题关键是一旦匹配到相符的就立即return，不然函数会一直执行下去直到return -1;
            }
        }
    }
    return -1;
}

console.log( find(arr, "test") );        // 0
console.log( find(arr, 2) );             // 1
console.log( find(arr, 0) );             // -1

14.写一个函数，把数组arr中的数字过滤出来赋值给新数组newarr， 原数组arr不变

var arr = ["a", "b", 1, 3, 5, "b", 2];

var narr = arr.filter(function(item){
    return (typeof item === 'number');
})
console.log(narr);          //   [1,3,5,2]
console.log(arr);           //["a", "b", 1, 3, 5, "b", 2]

15.写addClass、removeClass函数

var obj = {
          className: 'open menu'
};

function addClass(object,cls){
    var arr = object.className.split(" ");
    for(var i=0;i<arr.length;i++){
        if( arr[i] === cls ){
            return "已存在";
        }
        if( i === arr.length-1 ){
            arr.push(cls);
            return object.className = arr.join(" ");       //对原始数组遍历结束之后就可以return了，不然新增项之后数组改变了，会继续遍历
        }
    }
}

function removeClass(object,cls){
    var arr = object.className.split(" ");
    for(var i=0;i<arr.length;i++){
         if( arr[i] === cls ){
            arr.splice(i,1);
            object.className = arr.join(" ");
            return object.className;
        }
        if( i === arr.length-1 ){
                    return "无匹配项";
        }
    }
}

console.log( addClass(obj,'new') );           //open menu new
console.log( addClass(obj,'open') );          //已存在
console.log( addClass(obj,'me') );            //open menu new me

console.log( removeClass(obj,'open') );       //menu new me
console.log( removeClass(obj,'blabla') );     //无匹配项

16.写一个camelize函数，把my-short-string形式的字符串转化成myShortString形式的字符串

function camelize(str){
    var arr = str.toLowerCase().split("-");
    for(var i=1;i<arr.length;i++){
        arr[i] = arr[i].substring(0,1).toUpperCase() + arr[i].substring(1);
    }
    return arr.join("");
}

console.log( camelize("background-color") );        //backgroundColor
console.log( camelize("list-style-image") );        //listStyleImage
console.log( camelize("my-short-string") );         //myShortString

17.写一个函数isPalindrome,判断一个字符串是不是回文字符串（正读和反读一样，比如abcdcba是回文字符串，abcdefg不是）

function isPalindrome(str){
    var arr = str.split("");
    if( arr.length % 2 != 0 ) {
            var arr1 = arr.slice(0, (arr.length - 1) / 2);
            var arr2 = arr.slice((arr.length + 1) / 2);
            var str1 = arr1.reverse().join("");
             var str2 = arr2.join("");
             if ( str1 === str2 ) {
                   return "回文";
             }
     }
     if( arr.length % 2 == 0 ){
          var arr1 = arr.slice(0, (arr.length) / 2);
          var arr2 = arr.slice((arr.length) / 2);
          var str1 = arr1.reverse().join("");
          var str2 = arr2.join("");
          if ( str1 === str2 ) {
                return "回文";
          }
     }
      return "不是回文";
}

console.log( isPalindrome("abcba") );           //回文
console.log( isPalindrome("abccba") );          //回文
console.log( isPalindrome("abcdcba") );         //回文
console.log( isPalindrome("aa") );              //回文
console.log( isPalindrome("abcdba") );          //不是回文

18.写一个ageSort函数实现数组中对象按age从小到大排序

var john = { name: "John Smith", age: 23 }
var mary = { name: "Mary Key", age: 18 }
var bob = { name: "Bob-small", age: 6 }
var people = [ john, mary, bob ];

function ageSort(arr){
    arr.sort(function(a,b){
          return a.age - b.age;
    })
    console.log(arr);
}

ageSort(people);             // [ bob, mary, john ]

19.写一个filter(arr, func)函数用于过滤数组，接受两个参数，第一个是要处理的数组，第二个参数是回调函数(回调函数遍历接受每一个数组元素，当函数返回true时保留该元素，否则删除该元素)

function isNumeric(el){
     return typeof el === 'number';
}
function isPositive(val){
     return  typeof val === "number" && val > 0
}
arr = ["a",3,4,true, -1, 2, "b"];

function filter(arr,func){
    for(var i=0;i<arr.length;i++){
         if( !func(arr[i]) ){
                  arr.splice(i,1);
        }
    }
console.log(arr);
}
filter(arr,isNumeric);        //[3, 4, -1, 2]
filter(arr, isPositive);      //[3, 4, 2]