JavaScript基础(四)数组

数组:是值得有序集合。每个值叫做元素,每个元素在数组中都有数字位置编号,也就是索引。JS中的数组是弱类型的,数组中可以含有不同类型的元素。数组元素甚至可以使对象或其他数组。

var arr = [1 , true ,null , undefined , {x:1} , [1,2,3] ];

创建数组

var BAT = ["Alibaba","Tencent","Baidu"];

var students = [{name:'Bosen',age:27},{name:'Nunnly',age:3}];

var arr = ['Nunnlay' , 'is' , 'big' , 'keng' , 'B' , 123 ,true ,null];

var arrInArr = [[1,2],[3,4,5]];


var commasArr1 = [1,,2];//1,undefined,2

var commasArr2 = [,,];//undefined,undefined

数组最小长度0,最大长度2^23-1  4294967295


var arr = new Array();

var arrWithLength = new Array(100);//undefined*100

var arrLikesLiteral = new Array(true,false,null,1,2,"hi");


数组元素的读写

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

arr[1];//2

arr.lenght;//5


arr[5] = 6;//动态添加数组元素

arr.length;//6


delete arr[0];//删除数组长度仍然是6

arr[0];//undefined;


动态的、无需指定大小

var arr = [];

arr[0] = 1;

arr[1] = 2;

arr.push(3);//尾部添加3

arr;//1,2,3


arr[arr.lenght] = 4; //尾部添加4

arr;//1,2,3,4


arr.unshift(0); //在初始位置添加

arr;//0,1,2,3,4


delete arr[2];

arr;//0,1,undefined,3,4

arr.length;//5

2 in arr;//false 2没有在arr数组中


arr.length - = 1;

arr;//0,1,undefined,3    4被移除,并且改变了长度


arr.pop(); //移除最后一位

arr;//0,1,undefined  3被移除,并且改变了长度


arr.shift();//移除第一位

arr;//1,undefined

遍历数组

var i = 0 , n = 10;

var arr = {1,2,3,4,5};

for(;I<10 ;I++){

    console.log(arr[i]);//1,2,3,4,5

 }


for(I in arr){

console.log(arr[i]);//1,2,3,4,5

 }

注意如果修改原型链使用in遍历数组,原型链的数据一会被打印出来

Array.proptotype.x = "inherited";

for(I in arr){

    console.log(arr[i]);//1,2,3,4,5,inherited;

    //if(arr.hasOwnProperty(i)){

        //console.log(arr[i]);//1,2,3,4,5

    // }

 }


二维数组

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

var I = 0;j = 0;

for(;I<arr.length;i++){

    row = arr[I];

    for(;j<row.length;j++){

        console.log(row[j]);

     }

 }


稀疏数组

并不是含有从0开始的连续索引。一般length属性值比实际元素个数大;

var arr1 = [undefined];

var arr2 = new Array(1);

0 in arr1;//true 第0个元素是否有值

0 in arr2;//false

arr1.lengrh = 100;

arr1[99] = 123;

99 in arr1;//true

98 in arr1;//false 

var arr ={,,};

0 in arr;//false


数组使用方法(上)

{} => Object.prototype

[] => Array.prototype


//将数组准换成字符串做链接

Array.prototype.join

    var arr = {1,2,2};

    arr.join();//"1,2,3"

    arr.join("_");//"1_2_3";

    

    function repeatString(str,n){

        return new Array(n+1).join(str);

     }

    repeatString("q",3);//"qqq" 

    repeatString("Hi",5);//"HiHiHiHiHi"

//数组逆序排列

Array.prototype.reverse

    var arr = {1,2,3};

    arr.reverse();//[3,2,1]

    arr;//[3,2,1] 原数组被修改

//字符串排序

Array.prototype.sort

    var arr = ["a","b","d","c"];

    arr.sort();//["a","b","c","d"]


    var arr = [13,24,51,3];

    arr.sort();//原数组被修改

    arr;//[13,24,3,51]


    arr.sort(function(a,b)){

        return a - b;

     };//3,13,24,51


    arr = [{age:25},{age:35},{age:99}];

    arr.sort(function(item){

        return a.age - b.age;

     });

    arr.forEach(function(item){

        console.log("age",item.age);

     });//25 ,35 ,99

//数组合并 原数组不发生改变

Array.prototype.concat

    var arr = {1,2,3};

    arr.concat(4,5);//1,2,3,4,5

    arr;//1,2,3

    

    arr.concat([10,11],13);//1,2,3,10,11,13

    arr.concat(1,[2,3]);//1,2,3,1,[2,3]

//返回部分数组 原数组不发生改变

Array.prototype.slice

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

    arr.slice(1,3);//2,3

    arr.slice(1);//2,3,4,5

    arr.slice(1,-1);//2,3,4

    arr.slice(-4,-3);//2

//数组拼接 原数组发生改变 删除不要的元素

Array.prototype.splice

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

    arr.splice(2);//3,4,5

    arr;//1,2

   

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

    arr.splice(2,2);//3,4

    arr;//1,2,5


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

    arr.splice(1,1,'a','b');//2

    arr;//1,'a','b',3,4,5

//数组遍历

Array.prototype.forEach(ES5)

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

    arr.forEach(function(x,index,a){

        console.log(x + '|' +index + '|' +(a===arr));

     });//值|索引|true 1|0|true,2|1|true,……

//数组映射 原数组不发生改变

Array.prototype.map(ES5)

    var arr = [1,2,3];

    arr.map(function(x){

        return x+10;

     });//11,12,13

    arr;//1,2,3

//数组过滤 原数组不发生改变

Array.prototype.filter(ES5)

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

    arr.filter(function(x,index){

        return index % 3 ===0 || x >= 8    

     });//1,4,7,8,9,10

    arr;//1,2,3,4,5,6,7,8,9,10

//数组判断

Array.prototype.every(ES5)  //对每一元素进行判断,一个为false,则为false,全部是true,则为true

    var arr = {1,2,3,4,5};

    arr.every(function(x){

        return x < 10;

     });//true;

    arr.every(function(x){

        return x < 3;

     });//false; 

Array.prototype.some(ES5) //一个为true ,则为true

     var arr = {1,2,3,4,5};

    arr.every(function(x){

        return x === 3;

     });//true;

    arr.every(function(x){

        return x === 100;

     });//false; 

 //reduce 数据两两拼接 从左至右 ,reduceRight 从右至左,数组不发生改变

Array.prototype.reduce/reduceRight(ES5)

    var arr = [1,2,3];

    var sum = arr.reduce(function(x,y){ return x+y},0);//6,两个两个相加求和

    var arr = [3,6,0];

    var max = arr.reduce(fucntion(x,y){

        console.log(x+"|"+y);

        return x>y?x:y;

     },0);//9 比较大小

//数组检索 返回第一次所在的位置的索引; indexOf从左到右 ,lastIndexOf 从右到左,第一参数是擦找的值,第二个参数是从什么位置开始

Array.prototype.indexOf/lastIndexof(ES5)

    var arr = [1,2,3,2,1];

    arr.indexOf(2);//1

    arr.indexOf(99);//-1

    arr.indexOf(1,1);//4

    arr.indexOf(1,-3);//4

    arr.indexOf(2,-1);//-1

    arr.lastIndexOf(2,-2);//3

    arr.lastindexOf(2,-3);//1

//判断是否是数组

Array.isArray(ES5)

Array.isArray([]);//是true,不是false

[] instanceof Array

({}).toString.apply([]) == '[object Array]';//true

[].constructor === array;//true



小结:

    数组 vs 一般对象

    相同                                               不同

    都可以继承                                       数组自动更新legth

    数组是对象,对象不一定是数组            按索引访问数组常常比访问一般对象属性明显迅速

    都可以当做对象添加删除属性               数组对象继承Array.proptotype上的大量数组操作方法


    字符串和数组

    var str = "hello world";

    str.charAt(0);//'h'

    str[1];//e


    Array.prototype.join.call(str,"_");//h_e_l_l_o_ _w_o_r_l_d


猜你喜欢

转载自blog.csdn.net/jianghai_csdn/article/details/79359529