ECMAScript数组与其他语言中的数组都是数据的有序列表,但与其他语言不同的是,ECMAScript数组的每一项可以保存任何类型的数据。而且ECMAScript数组的大小是可以动态调整的,即可以随着数据的添加自动增长。

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

第一种是使用Array构造函数:

//1. 使用Array构造函数
var colors = new Array();//2.如果预先知道数组要保存的项目数量,也可以给构造函数传递该数量,改数量会自动变成length的属性值
var colors2 = new Array(20);
alert(colors2.length);    //20//3.也可以向Array构造函数传递数组中应该包含的项。
var colors3 = new Array("red", "blue", "green");//4.给构造函数传递一个值时,如果传递的是数值,表示该数组的长度。如果传递的是其他类型,则会创建包含那个值的数组
var colors4 = new Array(3);    // 创建一个包含3项的数组
var colors5 = new Array("Greg");    //创建一个包含1项的数组//5. 在使用Array构造函数时也可以省略new操作符
var colors6 = Array(3);
var names = Array("Greg");

第二种是使用数组字面量表示法: 数组字面量是由一对包含数组项的方括号表示,多个数组项之间以逗号隔开

var colors = ["red", "blue", "green"];    //创建一个包含三个字符串的数组
var names = [];    //创建一个空数组//在读取和设置数组的值时,要使用方括号并提供相应值的基于0的数字索引
alert(colors[0]);    //red
colors[2] = "black";
colors[3] = "brown";    //索引大于数组项时,自动增加一个
alert(colors.length);    //4

colors[99] = "black";
alert(colors.length);    //100

1.检测数组

instanceof :

Array.isArray(): 确定某个值是否为数组

if(Array.isArray(colors)){alert("yes");
}

2.转换方法

toString() 方法: 返回由数组中每个值的字符串形式拼接而成的一个以逗号分隔的字符串。

valueOf() 方法: 返回的还是数组。

var colors = ["red", "blue", "green"];    //创建一个包含三个字符串的数组
alert(colors.toString());    //red,blue,green
alert(colors.valueOf());    //red,blue,green
alert(colors);    //red,blue,green

上述代码显示的调用了toString()和valueOf()方法,以便返回数组的字符串表示,每个值的字符串表示拼接成了一个字符串,中间以逗号隔开。最后一行代码直接将数组传递给了alert()。由于alert()要接收字符串参数,所以它会在后台调用toString()方法,由此会得到与直接调用toString()方法相同的结果。

数组继承的toLocaleString()、toString()和valueOf()方法,在默认情况下都会以逗号分隔的字符串形式返回数组项,如果使用join()方法,则可以使用不同的分隔符来构建这个字符串。join()方法只接收一个参数,即分隔符的字符串。

var colors = ["red", "blue", "green"];    //创建一个包含三个字符串的数组
alert(colors.join("||"));    //red||blue||green

3. 栈方法

ECMAScript数组也提供了一种让数组的行为类似其他数据结构的方法。

栈是一种LIFO(Last-In-First-Out)的数据结构。也就是最新添加的项最早被移除。栈中项的插入(推入)和移除(弹出),只发生在一个位置上--- 栈的顶部。

push() 方法: 可以接受任意数量的参数,把它们逐个添加到数组的末尾,并返回修改后数组的长度。

pop() 方法: 从数组末尾移除最后一项,减少数组的length值,然后返回移除的项。

var colors = ["red", "blue"];
var count = colors.push("green");
alert(count);    //3

count = colors.push("black");
alert(count);    //4var item = colors.pop();
alert(item);    //black

4. 队列方法

队列数据结构的访问规则是FIFO(First-In-First-Out)。队列在列表的末端添加项,从列表的前端移除项。

push() 方法: 向数组末尾中添加项。

shift() 方法: 移除数组中的第一项并返回该项。

unshift() 方法: 在数组前端添加任意项并返回新数组的长度。

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

count = colors.push("black");
alert(count);    //3var item = colors.shift();
alert(item);    //red

count = colors.unshift("summer", "chen");
alert(count);    //4
alert(colors);    //summer,chen,green,black

5.重排序方法

数组中已经存在两个可以直接用来排序的方法:

reverse() 方法: 反转数组项的顺序

sort(): 方法:在默认情况下,按升序排列数组项。sort()方法会调用每个数组项的toString()转型方法,然后比较得到的字符串。

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

values.sort();
alert(values);    //0,1,10,15,3,5

sort()方法可以接收一个比较函数作为参数。

比较函数接收两个参数,如果第一个参数应该位于第二个之前——返回一个负数;两个参数相等——返回0;第一个参数该位于第二个之后——返回一个正数。

function compare(value1, value2){if(value1 < value2){return -1;}else if(value1 == value2){return 0;}else{return 1;}
}
var values = [0,15,10,5,1];
values.sort(compare);
alert(values);    //0,1,5,10,15

对于数值类型 或 其valueOf()方法会返回数值类型的对象类型,可以使用下列方法:

function compare(value1, value2){return value2 - value1;
}
var values = [0,15,10,5,1];
values.sort(compare);
alert(values);    //0,1,5,10,15

6.操作方法

concat() 方法: 基于当前数组中的所有项创建一个新数组。具体来说,这个方法会先创建当前数组的一个副本,然后讲接收到的参数添加到这个副本的末尾,最后返回新构建的数组。在没有给concat()方法传递参数的情况下,它只是复制当前数组并返回副本。如果传递给concat()方法的是一或多个数组,则该方法会将这些数组中的每一项都添加到结果数组中。如果传递的值不是数组,这些值就会简单的添加到结果数组的末尾。

var colors = ["red", "green", "blue"];
var colors2 = colors.concat("yellow", ["black", "brown"]);alert(colors);    //red,green,blue
alert(colors2);    //red,green,blue,yellow,black,brown

slice() 方法: 基于当前数组中的一个或多个项创建一个新数组。slice()方法可以接受一个或两个参数,即要返回项的起始和结束的位置。slice方法不会影响原始数组。

var colors = ["red", "green", "blue", "black", "brown"];//1. 在只有一个参数的情况下,slice方法返回从该参数位置开始到当前数组末尾的所有项
var colors2 = colors.slice(1);
alert(colors2);    //green,blue,black,brown//2.有两个参数,该方法返回起始位置和结束位置之间的项,不包括结束位置的项
var colors3 = colors.slice(1,3);
alert(colors3);    //green,bluevar colors4 = colors.slice(3,1);
alert(colors4);    //空数组var colors5 = colors.slice(1,1);
alert(colors5);    //空数组var colors6 = colors.slice(5);
alert(colors6);    //空数组var colors7 = colors.slice(3, 15);
alert(colors7);    //black,brown

splice()方法:主要用途是向数组中部插入项。改方法返回被删除的项。

var colors = ["red", "green", "blue", "black", "brown"];//1. 删除: 可以删除任意数量的项,只需指定第一项的位置和要删除的项数。返回被删除的项
var colors2 = colors.splice(1,3);
alert(colors2);    //green,blue,black
alert(colors);    //red, brown//2.插入:提供三个参数:起始位置、0(要删除的项数)、要插入的项
var colors3 = colors.splice(1,0, "summer", "holiday");
alert(colors);    //red,summer,holiday,brownvar colors4 = colors.splice(-1,0, "summer", "holiday");//起始位置小于0时,按0计算
alert(colors);    //red,summer,holiday,summer,holiday,brownvar colors5 = colors.splice(10,0, "summer", "holiday");//起始位置大于数组长度时,按数组长度计算
alert(colors);    //red,summer,holiday,summer,holiday,brown,summer,holiday
alert(colors.length);    //8//3.替换:可以向指定位置插入任意数量的项,且同时删除任意数量的项,三个参数:起始位置,要删除的项数,要插入的项
var colors6 = colors.splice(1, 4, "green", "blue", "black");
alert(colors6);    //summer,holiday,summer,holiday
alert(colors);    //red,green,blue,black,brown,summer,holiday

7. 位置方法

ECMAScript提供了两个位置方法,这两个方法都接收两个参数,要查找的项和查找起点位置的索引(可选的)

indexOf() 方法: 从数组的开头(位置0)开始向后查找。

lastIndexOf() 方法:从数组的末尾开始向前查找。

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

alert(numbers.indexOf(6));//-1
alert(numbers.lastIndexOf(6));//-1var person = {name: "Nicholas"};
var people = [{name: "Nicholas"}];var morePeople = [person];alert(people.indexOf(person));    //-1
alert(morePeople.indexOf(person));//0

8. 迭代方法

ECMAScript为数组定义了5个迭代方法。每个方法都接收两个参数: 每一项上运行的函数和运行该函数的作用域对象(可选的)--影响this值。

传入这些方法中的函数接收三个参数:数组项的值、该项在数组中的位置、数组对象本身

every() 方法:  对数组中的每一项运行给定函数,如果该函数对每一项都返回true,则返回true

filter() 方法: 对数组中的每一项运行给定函数,返回该函数会返回true的项组成的数组

forEach() 方法:对数组中的每一项运行给定函数,该函数没有返回值

map() 方法:对数组中的每一项运行给定函数,返回每次函数调用的结果组成的数组

some() 方法:  对数组中的每一项运行给定函数,如果该函数对任一项返回true,则返回true

var numbers = [1,2,3,4,5,4,3,2,1];var everyResult = numbers.every(function(item, index, array){return (item > 2);});
alert(everyResult);    //falsevar someResult = numbers.some(function(item, index, array){return (item > 2);});
alert(someResult);    //truevar filterResult = numbers.filter(function(item, index, array){return (item > 2);});
alert(filterResult);    // 3,4,5,4,3var mapResult = numbers.map(function(item, index, array){return (item + 2);});
alert(mapResult);    //3,4,5,6,7,6,5,4,3

9.缩小方法

ECMAScript有两个缩小数组的方法。这两个方法都会迭代数组的所有项,然后构建一个最终返回的值。这两个方法都接收两个参数,在每一项上调用的函数和作为缩小基础的初始值。

传入这些方法的函数接收四个参数:前一个值、当前值、项的索引、数组对象。这个函数返回的任何值都会作为第一个参数自动传给下一项。第一次迭代发生在数组的第二项上,因此第一个参数是数组的第一项,第二个参数就是数组的第二项。

reduce() 方法: 从数组的第一项开始,逐个遍历

reduceRight() 方法: 从数组的最后一项开始,向前遍历到第一项

var values = [1,2,3,4,5];
var sum = values.reduce(function(prev, cur, index, array){return prev + cur;});
alert(sum);    //15                    var sum2 = values.reduceRight(function(prev, cur, index, array){return prev + cur;});
alert(sum2);    //15

转载于:https://www.cnblogs.com/PrajnaParamita/p/5865487.html

JS引用类型 -- Array类型相关推荐

  1. 引用类型 —— Array类型

    壹.创建数组 一.使用Array构造函数 var colors = new Array(); var colors = Array(); 给构造函数传递值: 1.传递一个值 如果传递的是数值,则会按照 ...

  2. JS引用类型(2)——Array类型

    [2]Array类型 ECMAScript数组的每一项可以保存任何类型的数据,并且大小是可以动态调整的,即可以随着数据的添加自动增长以容纳新增数据. (1)创建数组 1>使用Array构造函数 ...

  3. 【js实例】Array类型的9个数组方法,Date类型的41个日期方法,Function类型

    前文提要:[js实例]js中的5种基本数据类型和9种操作符 Array类型的9个数组方法 Array中有9个数组方法: 1.检测数组 2.转换方法 3.栈方法 4.队列方法 5.冲排序方法 6.操作方 ...

  4. 问题分享:Js引用类型赋值

    今天在微信群里有这样一个问题和大家分享一下: 附上源码: function changeAgeAndReference(person){person . age = 25;person = {nage ...

  5. 【前端2】js:原始类型,运算符,调试,页面加载,轮播图,Bom(对象,时钟),Dom(全选全不选,省市级联,隔行/触摸换色,表单校验)

    文章目录 1.js两种引入:js最终要引入到html在浏览器中运行 2.js五大原始类型:undefined 3.js的运算符和流程控制:js不支持单&和单|性能低 4.案例_99乘法表:So ...

  6. Js基础——变量类型和计算

    JS基础--变量类型和计算 一.基本数据类型 二.引用类型 三.typeof判断数据类型 四.浅拷贝与深拷贝 4.1 浅拷贝 4.2 深拷贝 五.数据类型转换 5.1== 和 === 一.基本数据类型 ...

  7. 扩展typeof来判断js变量的类型

    Javascript 的 typeof可以获取变量的类型,有如下6种返回值:  1)number:  2)string:  3)boolean:  4)object  5)function:  6)u ...

  8. cjson 对象是json数组型结构体_C语言 - cJSON解析特定格式 含有数组array类型的数据...

    在ESP32中使用了cJSON库,发现很好用.最近服务器端的JSON格式越来越多样,还是有些注意点,需要做下笔记记录下来. cJSON *MAC_arry = cJSON_GetObjectItem( ...

  9. Js中Array对象

    Js中Array对象 JavaScript的Array对象是用于构造数组的全局对象,数组是类似于列表的高阶对象. 描述 在JavaScript中通常可以使用Array构造器与字面量的方式创建数组. c ...

最新文章

  1. NTU 课程笔记13:线性规划(对偶性)
  2. 同余(数论) AcWing算法课
  3. PHP JSON数组与对象的理解
  4. 台式计算机 一万元,一万元左右i7-8700K/Z370/GTX1070Ti水冷游戏台式电脑主机配置推荐(2)...
  5. Ceph FINDING AN OBJECT LOCATION
  6. 孔浩HTML,CSS笔记,心得(第二天)
  7. 计数器代码php,php 的计数器程序代码示例
  8. gaussdb 日常运维命令总结【01】
  9. 密码学系列之四:一文搞懂序列密码
  10. html 拼图游戏,HTML5人物拼图游戏
  11. Perl笔记-use strict编译指令
  12. eclipse工程报faceted project problem
  13. htc 8x android,htc8x怎么样 htc8x测评【图解】
  14. 服务器关闭微软小娜,win10小娜总是自动弹出怎么禁止-禁止win10小娜自动弹出的方法 - 河东软件园...
  15. Centos启动界面:You are in emergency mode
  16. 【科普】微波雷达感应与人体红外感应的区别
  17. oracle销售退货业务,Oracle EBS OM RMA销售退货异常处理(Datafix)
  18. 模型放到gpu上训练
  19. 广西单招计算机科学与技术专业,广西单招考什么科目
  20. 小白如何用Python脚本玩转跳一跳

热门文章

  1. VueJS定义组件规则
  2. 筛选染色体连续区域的策略
  3. Android develop 国际化
  4. php中json_decode返回数组或对象的实例
  5. 全国计算机等级考试题库二级C操作题100套(第50套)
  6. 内存四区(代码区 静态区 栈区 堆区)
  7. linux与windows间共享文件夹 FileZilla树莓派文件传输
  8. tp5 php7 报500,记一次TP单元测试报500错误的问题
  9. python qq签到_Yii Framework 中文网每天签到 Python 脚本
  10. rust电器元件需要什么材料_云南自考大专报考需要什么材料?