js数组

85 阅读3分钟

1.数组是值的有序集合。每个值叫做元素,每个元素在数组中都有索引。js数组是弱类型的,数组中可以含有不同类型元素。数组甚至可以是对象或其他数组。

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

2.数组创建 数组大小(0到2^23-1)

  • 字面量创建
var BAT = ["Alibaba","Tencent","Baidu"];
var students = [{name:'Bson',age:27},{name:'Nunnly',age:3}];
var arr = [1, true, null, undefined,{x:1},[1,2,3]];
var arrInArr = [[1,2],[3,4,5]];
var Arr = [,,1,2];
  • new Array
var arr = new Array();
var arrWithLength = new Array(100); //undefined*100
var arRLikesLiteral = new Array(true,false,null,1,2,"hi");//等价于[true,false,1,2,"hi"];

3.数组元素读写

var arr = [1,2,3,4,5];
arr[1]; //2
arr.length; //5
arr[5] = 6;
arr.length = 6;
delete arr[0];
arr[0]; //undefined

4.数组元素增删(数组元素是动态的,无需指定大小

var arr = [];
arr[0] = 1;
arr[1] = 2;
arr.push(3);
arr; //[1,2,3]

arr[arr.length] = 4; //equal to arr.push(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

arr.length -= 1;
arr; //[0,1,undefined,3]   4 is removed

arr.pop(); //3returned by pop
arr; //[0,1,undefined]    3 is removed

arr.shift(); // 0 returned by shift
arr; //[1,undefined]

5.数组迭代

for循环 for···in循环

图片.png 6.二维数组 稀疏数组

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

7.数组方法 {}=>Object.prototype []=>Array.prototype

图片.png

  • join 数组转字符串(默认,)
var arr = [1,2,3];
arr.join(); //"1,2,3"
arr.join("_"); //"1_2_3"

function repeatString(str,n){
    return new Array(n+1).join(str);
}
repeatString("a",3); // "aaa"
repeatString("Hi",5); //"HiHiHiHiHi"
  • reverse 逆序 会修改原数组
var arr = [1,2,3];
arr.reverse(); // [3,2,1]
arr; //[3,2,1]  原数组被修改
  • sort 排序 (默认字母顺序) 会修改原数组
var arr = ["a","d","c","b"];
arr.sort(); // ["a","b","c","d"]

arr = [13,24,51,3];
arr.sort(); //[13,24,3,51]
arr; //[13,24,3,51]

arr.sort(function(a,b){
    return a-b;
}); //[3,13,24,51]

arr = [{age:25},{age:39},{age:99}];
arr.sort(function(a,b){
    return a.age - b.age
});
arr.forEach(function(item){
    console.log('age',item.age)
});
//result:
//age 25
//age 39
//age 99
  • 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]]   参数是数组,数组中还是数组,不会被拉平
  • 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]   -1表最后一个元素
arr.slice(-4,-3); //[2]
  • splice 数组拼接 改变原数组
var arr = [1,2,3,4,5]
arr.splice(2); // returns [3,4,5]
arr; //[1,2];

arr = [1,2,3,4,5];
arr.splice(2,2); //returns  [3,4]   第二个参数代表删除元素个数
arr; //[1,2,5]

arr = [1,2,3,4,5];
arr.splice(1,1,'a','b'); //returns [2]   第一个参数表示从第几个,第二个参数代表删除几个,第三个代表添加的元素
arr; //[1,"a","b",3,4,5]
  • forEach 数组遍历 第一个参数表示元素值 第二个参数表示索引 第三个参数表示数组本身 ie9及以上
var arr = [1,2,3,4,5];
arr.forEach(function(x,index,a){
    console.log(x+'|'+index+'|'+(a===arr));
});
// 1|0|true
// 2|1|true
// 3|2|true
// 4|3|true
// 5|4|true
  • map 数组映射 不改变原数组 数组中每个元素转换
var arr = [1,2,3];
arr.map(function(x){
    return x+10
}); //[11,12,13]
arr; //[1,2,3]
  • filter 数组过滤 不改变原数组
var arr = [1,2,3,4,5,6,7,8,9,10];
arr.filter(function(x,index){
    return index % 3 === 0 || x >= 8;
}); //return [1,4,7,8,9,10]
arr; //[1,2,3,4,5,6,7,8,9,10]
  • every some 数组判断
var arr = [1,2,3,4,5];
arr.every(function(x){
    return x < 10;
}) //true
arr.every(function(x){
    return x<3;
}); //false
var arr = [1,2,3,4,5];
arr.some(function(x){
    return x === 3;
}) //true
arr.some(function(x){
    return x === 100;
}) //false
  • reduce reduceRight 原数组不改变
var arr = [1,2,3];
var sum = arr.reduce(function(x,y){
    return x+y
},0); //6  第二个参数可选
arr; //[1,2,3]

arr = [3,9,6];
var max = arr.reduce(function(x,y){
    console.log(x+"|"+y);
    return x>y?x:y
});
//3|9
//9|6
max; //9

max = arr.reduceRight(function(x,y){
    console.log(x+"|"+y);
    return x>y?x:y
});
//6|9
//9|3
max; //9
  • indexOf lastIndexOf 数组检索 返回元素位置或-1
var arr = [1,2,3,2,1];
arr.indexOf(2); //1
arr.indexOf(99); //-1
arr.indexOf(1,1); //4   查找1,从第二个元素开始查
arr.indexOf(1,-3); //4
arr.indexOf(2,-1); //-1
arr.lastIndeXOf(2); //3
arr.lastIndexOf(2,-2); //3
arr.lastIndexOf(2,-3); //1
  • Array.isArray() 判断元素是否是数组
Array.isArray([]); //true
[] instanceof Array; //true
({}).toString.apply([]) === '[object Array]'; //true
[].constructor === Array; //true

8.数组vs一般对象

图片.png

9.数组vs字符串

图片.png