Array类型

ECMAScript中的数组与其他多数语言的数组有很大的区别。
1、ECMAScript数组的每一项可以保存任何类型的数据
2、ECMAScript数组的大小可以动态调整,即可以随数据的添加自动增长以容纳新增数据。

创建数组的基本方式:
1、使用Array构造函数。

var colors = new Array();
var colors = new Array(20);   //创建length值为20的数组
var colors = new Array("red","blue","green"); //创建数组应该包含的项的数组

//也可以省略new操作符
var colors = Array();
var colors = Array(20); 
var colors = Array("red","blue","green");

2、数组字面量表示法。

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

数组的项数保存在length属性中,这个属性很有意思——不是只读的,可以修改。因此,可以通过设置这个属性,从数组的末端移除项或添加新项。

var colors = ["red","blue","green"];
colors.length = 2;
alert(color[2]); // undefined

var colors = ["red","blue","green"];
colors.length = 4;
alert(color[3]); // undefined

//利用length可以在末尾添加新项
var colors = ["red","blue","green"];
colors[color.length] = "black"; //在位置3添加一种颜色

var colors = ["red","blue","green"];
colors[99] = "black"; //在位置99添加一种颜色
alert(color.length); // 100

检测数组

对于一个网页或一个全局作用域,使用instanceof即可:

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

对于网页中包含多个框架,即存在两个以上不同的全局执行环境,则使用Array.isArray():(支持此方法的浏览器有IE9+、Firefox4+、Safari5+、Opera10.5+、Chrome)

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

转换方法

var colors = ["red","blue","green"]; 
alert(colors.toString()); //red,blue,green
alert(colors.valueOf());  //red,blue,green
alert(colors);            //red,blue,green

可以使用join()方法使用不同的分隔符来构建字符串。

var colors = ["red","blue","green"]; 
alert(colors.join(",")); //red,blue,green
alert(colors.join("||")); //red||blue||green

栈方法 push()、pop()##

var colors = new Array(); 
var count = colors.push("red","blue");
alert(count); // 2
var item = colors.pop();
alert(item); // blue

队列方法 push()、shift()、unshift()##

var colors = new Array(); 
var count = colors.push("red","blue");
alert(count); // 2

var item = colors.shift();
alert(item); // red

//unshift()从前端添加任意个数项并返回新数组长度
count = colors.unshift("red","green");
alert(count); //2
alert(colors); //red green blue

重排序方法 reverse()、sort()##

//reverse()反转数组项顺序
var values = [1,2,3,4,5];
values.reverse();
alert(values); //5,4,3,2,1

sort()默认为升序排列数组->调用每个数组项的toString()方法,然后比较得到的字符串。

var values = [0,1,5,10,15];
values.sort();
alert(values); //0,1,10,15,5

默认的sort()比较的是字符串。而要自定义比较的方法,可以给sort()加上一个比较函数。
tips:我认为可以这样理解,比较函数的返回值大于0,那么说明前后两个参数要交换位置;否则,位置不变。

function compare(value1, value2) {
    if (value1 < value2) {
        return -1;
    } else if (value1 > value2) {
        return 1;
    } else {
        return 0;
    }
}
//更简单的比较函数
function compare(value1,value2){
    return value1-value2;
}

var values = [0,1,5,10,15];
values.sort(compare);
alert(values); //0,1,5,10,15

操作方法concat()、slice()、splice()

concat():创建当前数组的一个副本,然后将接收到的参数添加到副本的末尾

var values = [0,2,1];
var values2 = values.concat(1,[3,4]);
console.log(values);  //0,2,1
console.log(values2); //0,2,1,1,3,4

slice():基于当前数组中的一或多个项创建一个新数组

/* slice( start , end )
 * param:① 只有一个参数:start
 *       ② 有两个参数:start,end(要返回项的起始和结束位置)
 * return:①返回从该参数指定位置 start 开始到当前数组末尾的所有项
 *         ②返回起始 start 和结束位置 end 之间的项——不包括结束位置的项
 * 若参数有负数,则用数组长度加上该数来确定相应的位置。例如:
 * length=5,slice(-2,-1)等价于slice(3,4)
 * 若结束位置小于起始位置,则返回空数组
 */
 var values = [0,1,2,3,4];
 var values2 = values.slice(1); //1,2,3,4
 var values3 = values.slice(1,4); //1,2,3

splice():向数组的中部插入项
总共有三种用法:

/* 
 * ①删除:splice( start , num )
 * param:start 表示要删除的第一项的位置;num 表示要删除的项数
 * return:返回删除的项数组
 */
 var values = [0,1,2,3,4];
 var removed = values.splice(0,2);
 console.log(values);  //2,3,4
 console.log(removed); //0,1

/* 
 * ②插入:向指定位置插入任意数量的项
 * splice( start , 0 , value1 ,...)
 * param:start 表示起始位置;value1,... 表示要插入的项
 * return:返回空数组
 */
 var values = [0,1,2,3,4];
 var removed = values.splice(1,0,5,6);
 console.log(values);  //0,5,6,1,2,3,4
 console.log(removed); //空数组

/* 
 * ③替换:向指定位置插入任意数量的项,且同时删除任意数量的项
 * splice( start , num , value1,...)
 * param:start  表示起始位置;num 表示要删除的项数;
 *        value1,...表示要插入的项
 * return:返回删除的项数组
 */
 var values = [0,1,2,3,4];
 var removed = values.splice(1,3,5,6);
 console.log(values);  //0,5,6,4
 console.log(removed); //1,2,3

位置方法 indexOf()、lastIndexOf()##

/* indexOf( value , start ):从数组的开头(位置0)开始向后找
 * lastIndexOf( value , start ):从数组的末尾开始向前找
 * param:value 要查找的项,start (可选)查找起点位置的索引
 * return:返回查找项在数组中的位置,没找到返回-1
 * 要求:查找的项必须严格相等(使用全等操作符比较)
 * /
 var numbers = [1,2,3,4,5,4,3,2,1];
 alert(numbers.indexOf(4));      //3
 alert(numbers.lastIndexOf(4));  //5
 
 alert(numbers.indexOf(4,4);     //5
 alert(numbers.lastIndexOf(4,4); //3

 var person = {name:"Nicholas"};
 var people = [{name:"Nicholas"}];

 var morePeople = [person];

 alert(people.indexOf(person));     //-1
 alert(morePeople.indexOf(person)); //0
 
 /* 解释上面的-1与0:
  * 用indexOf()查找的时候,所比较的是对象。在 people 这个数组中的这个
  * {name:"Nicholas"} 和 person 并不是同一个对象,而 morepeole 中和
  * person 是同一个对象(因为直接引用了它)。
  * 因此第一个会返回 -1(无法找到),第二个是 0。
  * person==people[0]或者person===people[0] 都是不成立的(false)
  */

迭代方法:5种

这5种迭代方法分别是:
every():对数组中每一项运行给定函数,若该函数对每一项都返回true,则返回true。
filter():对数组中每一项运行给定函数,该函数会返回给定函数返回true的项组成的数组。
forEach():对数组中每一项运行给定函数。无返回值。
map():对数组中每一项运行给定函数,返回每次函数调用的结果组成的数组。
some():对数组中每一项运行给定函数,若该函数对任一项返回true,则返回true。

/* 迭代方法的参数:param1要在每一项运行的函数 function,
 *               param2(可选)运行该函数的作用域对象
 * 要运行的function函数参数:
 * param1:数组项的值
 * param2:该项在数组中的位置
 * param3:数组对象本身
 */
 
 var numbers = [1,2,3,4,5,4,3,2,1];
 var everyResult = numbers.every(function(item,index,array){
     return (item>2);
 });
 alert(everyResult); //false
 
 var someResult = numbers.some(function(item,index,array){
     return (item>2);
 });
 alert(someResult); //true
 
 var filterResult = numbers.filter(function(item,index,array){
     return (item>2);
 });
 alert(filterResult); //[3,4,5,4,3]
 
 var mapResult = numbers.map(function(item,index,array){
     return (item>2);
 });
 alert(mapResult); //[ false, false, true, true, true, true, true, false, false ]
 
 numbers.forEach(function(item,index,array){
     //执行某些操作
 });

归并方法reduce()、reduceRight()

/* reduce():从数组的第一项开始,逐个遍历到最后
 * reduceRight():从数组的末尾开始向前遍历到第一项
 * param:param1要在每一项运行的函数 function,
 *        param2(可选)作为归并基础的初始值
 * 
 * 要运行的function函数参数:
 * param1:前一个值
 * param2:当前值
 * param3:项的索引
 * param4:数组对象
 * return:这个函数的返回值会作为第一个参数自动传给下一项。
 * /
 var values = [1,2,3,4,5];
 var sum = values.reduce(function(prev,cur,index,array){
     return prev + cur;
 });
 alert(sum); //15
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 194,390评论 5 459
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 81,821评论 2 371
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 141,632评论 0 319
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 52,170评论 1 263
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 61,033评论 4 355
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 46,098评论 1 272
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 36,511评论 3 381
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 35,204评论 0 253
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 39,479评论 1 290
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 34,572评论 2 309
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 36,341评论 1 326
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,213评论 3 312
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 37,576评论 3 298
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 28,893评论 0 17
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,171评论 1 250
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 41,486评论 2 341
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 40,676评论 2 335

推荐阅读更多精彩内容