JavaScript中的内置对象-8--1.Array(数组)-Array构造函数; 数组的栈方法; 数组的转换方法; 数组的操作方法; 删除-插入-替换数组项; ECMAScript为数组实例添加的两个位置方法;

JavaScript内置对象-1Array(数组)

学习目标

1.掌握任何创建数组

2.掌握数值元素的读和写

3.掌握数组的length属性

如何创建数组

创建数组的基本方式有两种：

1.使用Array构造函数

语法：new Array（）

小括号（）说明：

（1）预先知道数组要保存的项目数量

（2）向Array构造函数中传递数组应包含的项

2.使用数组字量表示法:由一对包数组项的方括号[]表示，多个数组项之间以逗号隔开。

数组元素的读写

读取和设置值时，使用方括号[]并提供相应的索引

说明：索引是从0开始的正整数

数组长度

语法：array.length

功能：获取数组array的长度

返回值：number

说明：

1.通过设置legth可以从数组的末尾移除项或向数组中添加新项。

2.当一个值放在超出当前数组大小的位置上时，数组就会重新计算其长度值，长度值等于最后一项的索引加1.

<script>
       // 创建一个保存颜色的数组
      /* var colors=new Array(3);
       colors[0]="#f00";
       colors[1]="#0f0";
       colors[2]="#00f";
       console.log(colors);
       var nums=new Array(1,3,6,9);
       //console.log(nums);
       var cols=["red","yellow","green"];
       //console.log(cols);
       var infos=[6,"marry",true];
       //console.log(infos);
       console.log(cols[5]);  // 读取cols这个数组中索引为1的值*/
       var arr=["a","b","c","d"];
       //console.log(arr.length);  // 4
       //arr.length=2;
       //arr[99]="z";
       //console.log(arr.length); // 100
       // 数组的遍历
       for(var i=0;i<arr.length;i++){
          console.log(arr[i]);
       }
     </script>

<script>
       // filter()
       var nums=[1,2,5,8,10,9,3,6];
       // 将nums这个数组中所有大于3的值都取出来存到一个新数组
       function filterArray(arr){
          var newArr=[],i,len=arr.length;
          for(i=0;i<len;i++){
            if(arr[i]>3){
               newArr.push(arr[i]);
            }
          }
          return newArr;
       }
       var newNums=filterArray(nums);
       //newNums.sort(function(a,b){return a>b});
       //console.log(newNums);

var newNums2=nums.filter(function(item,index,arr){
          return item>3;
       })
       // 将nums这个数组中所有的偶数打印出来
       var newNums3=nums.filter(function(item,index,arr){
           if(item%2==0) return item;
       })
       console.log(newNums3);
    </script>

<script>
        var nums=[1,6,8,9,11];
        var sum=nums.reduce(function(prev,cur,index,array){
           return prev+cur;   // prev 2
        })
        console.log(sum);
    </script>

<script>
        var nums=[3,8,5,7,6];
        var newNums=nums.map(function(item,index,array){
            return item*2;
        })
        console.log(nums);
        var strs=["display","transform","transition"];
        var newstrs=strs.map(function(item,index,array){
            return "-webkit-"+item;
        })
        console.log(newstrs);
        var colors=["red","green","blue"];
        colors.forEach(function(item,i,array){
           console.log(item);
        })
    </script>

学习目标

掌握数组的栈方法：

1.push()

2.unshift()

3.pop()

4.shift()

push()

语法：arrayObject.push(newele1,newele2,...,neweX)

功能：把它的参数顺序添加到arrayObject的尾部。

返回值：把指定的值添加到数组后的新长度。

unshift()

语法：arrayObject.unshift(newele1,newele2,...neweX)

功能：把它的参数顺序添加到arrayObject的开头。

返回值：把指定的值添加到数组后的线长度。

pop()

语法：arrayObject.pop()

功能：删除arrayObject的最后一个元素

返回值：被删除的那个元素

Shift()

语法：arrayObject.shift()

功能：删除arrayObject中的第一个元素

返回值：被删除的那个元素

<script>
       // push
       var colors=new Array("red","green");
       var len=colors.push("blue","yellow","blank");
       console.log(len);
       // unshift
       var nums=[2,7,8,6];
       var size=nums.unshift(99,66);
       // pop
       var n=nums.pop();
       console.log(nums);
       // unshift
       var m=colors.shift();
       console.log(m);
    </script>

学习目标

1.掌握数组的转换方法

2.掌握数组的重排序方法

Join()

语法：arrayObject.join(separator)

功能：用于把数组中所有元素放入一个字符串。

返回值：字符串。

Reverse()

语法：stringObject.reverse()

功能：用于颠倒数组中元素的顺序。

返回值：数组

Sort()

语法：arrayObject.sort(sortby)

功能：用于对数组元素进行排序。

返回值：数组

说明：

1.即使数组中的每一项都是数值，sort()方法比较的也是字符串。

2.Sort（）方法可以接受一个比较函数作为参数。

<script>
       // join
       var nums=[2,4,5];
       var str=nums.join();  //2,4,5
       var words=["border","left","color"];
       // border-left-color
       var wordstr=words.join("-");
       console.log(wordstr);
       // reverse
       nums.reverse();
       console.log(nums);
       var strs=["a","b","c","d"];
       // 返回dcba这个字符串
       var newstr=strs.reverse().join("")
       console.log(newstr);
       // 29,5,24,17,32
       var arr=[9,23,15,-99,88,12,-2];
       // 降序 return 参数1<参数2
       //arr.sort(function(a,b){return a<b});
       // 升序 return 参数1>参数2
       arr.sort(function(a,b){return a>b});
       console.log(arr);
    </script>

<script>
      // 写一个函数，返回某个值在这个数组中出现了多少次
      var nums=[8,2,5,6,8,6,7,9];
      function getTimes(arr,num){
         // 次数
         var times=0,i;
         // 遍历数组
         for(i=0;i<arr.length;i++){
            // 比较数组中的每一值是否和num相等
            if(arr[i]==num){
               // 次数+1
               times+=1;
            }
         }
         return times;
      }
      var times1=getTimes(nums,99);
      var times2=getTimes(["a","c","a","d"],"a");
      console.log(times1);
      console.log(times2);
      // 封装一个方法，实现reverse()的功能
      // 数组翻转
      function reverseArr(arr){
         // 新数组
         var newArr=[];
         // 遍历数组，从最后一个值开始取
        /* for(var i=arr.length-1;i>=0;i--){
            // 将每一个值追加到新数组的最后
            newArr.push(arr[i]);
         }*/
         for(var i=0;i<arr.length;i++){
            newArr.unshift(arr[i])
         }
         return newArr;
      }
      var newArr1=reverseArr([1,2,4,9,6]);
      var newArr2=reverseArr(["o","l","l","e","h"]);
      console.log(newArr1);
      console.log(newArr2.join(""));
    </script>

学习目标

1.掌握数组的操作方法：

concat()

Slice()

concat()

语法：arrayObject.concat(arrayX,arrayX,...,arrayX)

功能：用于链接两个或多个数组。

返回值：数组

slice（）

语法：arrayObject.slice(start,end)

功能：从已有的数组中返回选定的元素。

参数：Start（必需）规定从何处开始选取，如果是负数，那么它规定从数组尾部开

算起的位置。

End（可选）规定从何处结束选取，该参数是数组怕片断结束的数组下标。

说明：1.如果没有指定end，那么切分的数组包含从start到数组结束的所有元素。

2.如果slice()方法的参数中有一个负数，则用数组长度加上数来确定相应的位置。

返回值：数组。

<script>
      var arr1=["a","b","c"],
          arr2=["d","e",1,3],
          arr3;
      // concat
      arr3=arr1.concat(arr2,["m",99,8]);
      console.log(arr3);
      // slice(start,end) end下标
      var colors=["red","green","blue","yellow","orange"];
      //var newColors=colors.slice(1,3);
      //var newColors2=colors.slice(2,4);
      var newColors3=colors.slice(-4,3); // 1,3
      console.log(newColors3);
      // 完成以下代码段，实现b数组对a数组的拷贝，方法越多越好
      var a=[1,"yes",3],
          b;
      // 1、数组遍历,push
      /*b=new Array();
      for(var i=0;i<a.length;i++){
         b.push(a[i]);
      }*/
      // 2、concat()
      b=[].concat(a);
      // 3、slice();
      b=a.slice(0);
      console.log(b);
    </script>

学习目标

1.掌握使用splice()方法删除数组项

2.掌握使用splice()方法插入数组项

3.掌握使用splice()方法替换数组项

删除

语法：arrayObject.splice(index,count)

功能：删除从index处开始的零或多个元素。

返回值：含有被删除的元素数组。

说明：count是要删除的项目数量，如果设置为0，则不会删除项目。

如果不设置，则删除从index开始所有值。

插入

语法：arrayObject.splice(index0,item1,.....,itemX)

功能：在指定位置插入值

参数：Index:起始位置

0：要删除的项数

Item1....itemX:要插入的项

返回值：数组

替换

语法：arrayObject.splice(index,count,item1,....,itemX)

功能：在指定位置插入值，且同时删除任意数量的项

参数：Index:起始位置

count:要删除的项数

Item1,...itemX：要插入的项

返回值：从原始数组中删除的项（如果没有删除任何项，则返回空数组）

<script>
       var arr=["a","b","c","d","e","f"];
       // 删除
       //var delArr=arr.splice(2,3);
       // 插入
       //var insertArr=arr.splice(3,0,"m","n",88);
       // 替换
       var replaceArr=arr.splice(1,2,"x","y","z");
       console.log(arr);
       console.log(replaceArr);
    </script>

学习目标

1.掌握ECMAScript为数组实例添加的两个位置方法：

IndexOf()

lestIndexOf()

indexOf()

语法：arrayObject.indexOf(searchvalue,startIndex)

功能：从数组的开头（位置0）开始向后查找。

参数：searchvalue:必须，要查找的项；

startIndex:可选，起点位置索引。

返回值：number,查找的项在数组中的位置，没有找到的情况下返回-1.

lastIndextOf()

语法:arrayObject.lastIndexOf(searchvalue,startIndex)

功能：从数组的末尾开始向前查找。

参数：searchvalue：必须，要查找的项

startIndex:可选，起点位置的索引。

返回值：number,查找的项在数组中的位置，没有找到的情况下发回-1.

说明：1.在比较第一个参数与数组中的每一项时，会使用全等操作符，即要求查找的项必须严格相等。

2.数组的位置方法是ECMAScript为数组实例新增的，所以支持的浏览器只有：

IE9+、Firefox2+、Safari3、Opera9.5、Chrome。

<script>
       var nums=[1,7,5,7,8,1,6,9];
       //var pos=nums.indexOf(7,2);
       //var pos=nums.lastIndexOf(1);
       var pos=nums.indexOf("7");
       console.log(pos);
       // 封装一个方法实现indexOf的功能
       function ArrayIndexOf(arr,value){
          // 检测value在arr中出现的位置
          for(var i=0;i<arr.length;i++){
             if(arr[i]===value){
                return i;
             }
          }
          return -1;
       }
       var pos2=ArrayIndexOf(nums,"1");
       console.log(pos2);
    </script>