您的位置:首页 > Web前端 > JavaScript

Javascript数组详解

2017-09-06 19:50 316 查看

javascript数组

创建数组

使用Array构造函数

var colors=new Array();//使用构造函数创建
var colors=new Array(20);//创建一个length值为20的数组
var colors=new Array("red","green","blue");//创建并初始化值


也可以省略new操作符(不建议)

var colors=Array(3);
var colors=Array("red");


使用数组字面量表示法

var colors=[];
var colors=["red","blue","yellow"];


!!!错误事例

var values=[1,2,];//这样会创建一个包含2项或者3项的数组
var names=[,,,,];//这样会创建一个包含4项或者5项的数组


为什么会出现数组项数不确定的现象呢?

原因是IE8及之前版本中的ECMAScript实现在数组字面量方面存在bug,在IE8及之前版本,values会成为一个包含3项且每项为1,2和undefined的数组,names会成为一个包含5项且每项都为undefined的数组

在其他浏览器(Chrome,Firefox,IE9+,Opera,Safari)中,values会成为一个包含2项且每项为1,2的数组,names会成为一个包含4项且每项都为undefined的数组。由于IE的实现和其他浏览器不一致,因此强烈建议不要使用这种语法。

Array的Length属性

length属性返回数组长度

利用length属性方便地在数组末尾添加新项

var colors=["red","green"];
colors[colors.length]="black";//在位置2添加
colors[colors.length]="blue";//在位置3添加


检测数组

1.使用instanceof

if(colors instanceof Array){
//执行某些操作
}


存在的问题:

instanceof假定只有一个全局执行环境,如果网页包含多个框架,那么实际上就存在两个以上的全局执行环境,那么就存在两个不同版本的Array构造函数,如果从一个框架向另一个框架传入一个数组,新传入的数组与在第二个框架中原生创建的数组分别具有各自不同的Array构造函数。

2.使用Array.isArray()

ECMAScript5新增Array.isArray()方法,不管它在哪个全局执行环境创建,都可以确定这个值到底是不是数组。

if(Array.isArray(value)){
//执行操作
}


支持的浏览器:IE9+,Firefox4+,Opera10.5+和Chrome

3.使用Object.prototype.toString.call(value);

如果是数组,返回”[object Array]”

如果是方法,返回”[object Function]”

如果是正则表达式对象,返回”[object RegExp]”

数组的方法

所有对象都具有toLocaleString(),toString()和valueOf()方法

toLocaleString();//调用每一项的toLocaleString方法值
toString();//返回一个以逗号分隔,由数组中每个值的字符串形式拼接而成的字符串
valueOf();//返回一个数组
join("#");//使用分隔符串联起数组的每一项,默认或传入undefined时分隔符为逗号


var colors=["red","blue","green"];
console.log(colors.toString());//返回一个以逗号分隔的字符串
console.log(colors.valueOf());//返回一个数组
console.log(colors);//返回一个数组
alert(colors);//red,blue,green
alert(colors.valueOf());//red,blue,green
alert(colors.toString());//red,blue,green


由于alert()要接收字符串为参数,所以它会在后台调用toString()方法,所会得到与直接调用toString()方法相同的结果

如果数组某一项值为null或者undefined,在上述方法返回的数组中以空字符表示(会保留分隔符)

var colors=["red",undefined,"blue",null,"green"];
console.log(colors.toString());//["red",undefined,"blue",null,"green"]
alert(colors);//red,,blue,,green


var person1={
toLocaleString:function(){
return "localeString";
},
toString:function(){
return "string";
}
};
var person2={
toLocaleString:function(){
return "localeString";
},
toString:function(){
return "string";
}
}
var people=[person1,person
4000
2];
alert(people);//string,string
alert(people.toString());//string,string
alert(people.toLocaleString());//localeString,localeString
alert(people.join('*'));//string*string


数组栈方法

栈:先进后出,出栈和入栈都是在栈顶操作

push()//返回数组的长度,入栈
pop()//返回被删除的那个数组项,出栈


数组队列方法

队列:先进先出,出队列和入队列都是在队列头部操作

shift()//出队列,返回出队列的值
unshift()//入队列,返回数组值;


数组重排序方法

reverse()//颠倒数组的每一项的排列顺序
sort()//调用toString()将每一项都转换成字符串,数字也不例外,数字字符串比较会出错,可以传入一个比较函数


function compare(value1,value2){
if(value1<value2){
return -1;
}else if(value1>value2){
return 1;
}else{
return 0;
}
}
colors.sort(compare);


更简单的方法,适用于数值类型或者valueof返回数值类型的对象

通过返回一个小于零,大于零,等于零来影响排序结果

function compare(value1,value2){
return value2-value1;
}


操作方法concat()

创建当前数组的一个副本,将参数里每一项添加到结果数组中,如果不是数组,则简单添加到末尾

slice()

基于当前数组的一项或多项创建一个新数组,返回项的起点到结束为止

只有一个参数,返回起始点到数组末尾全部项;

有两个参数,返回起始点到终点项,但是不包括终点项;

如果有负数,用数组长度加上负数确定位置,如果结束位置小于起始位置,返回空数组;

最强大的splice()

删除 只需要制定两个参数,要删除的第一项的位置和要删除的项数

插入 指定三个参数,起始位置,0(不删除),要插入的项

替换 指定三个参数,起始位置,1(删除起始位置),要插入的项

查找位置的方法

ECMAScript5提供的方法

indexOf() 开头寻找和lastIndexOf()末尾开始找

(“要查找的项”,”查找位置起点可选”)

未找到返回-1,找到返回位置

使用全等操作符

迭代方法

every()some()返回true or false

filter()

map()运行每一项,一一对应的数组

forEach()

归并方法

reduce()从前往后 reduceRight()从后往前
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  javascript 数组