js学习笔记:引用类型——Array
来源:互联网 发布:淘宝没给发票 编辑:程序博客网 时间:2024/05/16 07:04
Array类型
与其它语言不同,ECMAScript数组的每一项可以保存任何类型的数据。
而且,ECMAScript数组的大小是动态调整的。
创建数组
创建数组有两种方式:
- Array构造函数
var colors = new Array();
如果预先知道要保存的数据的数量,也可以给构造函数传递该数量,该数量也会变成length属性的值。
var colors = new Array(20);
也可以向Array构造函数传递数组项:
var colors = new Array("red","blue");
给构造函数传一个值也可以创建数组: 传递的值为数值则创建该长度的数组,传递的值为其他类型则创建只包含该值一项的数组。
在使用Array构造函数创建数组时也可以省略new操作符。
- 使用数组字面量表示法:
var colors = ["red","blue"];var names = [];var names = [1,2,]; //这样会创建包含2或3项的数组var options = [,,,,,]; //这样会创建包含5或6项的数组
和object一样,在使用数组字面量表示法时也不会调用Array构造函数。
数组属性
通过方括号和下标访问数组项,如果索引超过了数组现有项数,数组就会自动增加到该索引值加1的长度。
数组的length属性不只是只读的。通过设置length可以从数组的末尾移除项或者向数组中添加新项。(新增的项都是undefined)。
利用length属性可以方便地在数组末尾添加新项:
colors[colors.length] = "black";
是因为数组最后一项的索引是length-1,下一个新项的位置就是length。
var colors = ["red","blue"];colors[99] = "black";colors.length;//100,位置2到位置98都是undefined
- 利用Array.isArray( )方法来检测某个值是否是数组。
转换成字符串
- toString方法:会返回由数组中每个值的字符串形式拼接而成的一个以逗号分隔的字符串。
- 会调用数组每一项的toString方法
- alert一个数组,不管用toString,valueOf还是直接alert数组,都会显示和toString相同的结果,因为alert要接收字符串参数,会自动在后台调用toString方法。
- valueOf方法:返回的还是数组
- toLocaleString方法
- 会调用每一项的toLocaleString方法
join()
上述的三种方法都会返回以逗号分隔的字符串形式,而join方法可以指定分隔符。如果不传参或传undefined的话默认以逗号作为分隔符。
如果数组中某一项是null或undefined,那么该值在上述四种方法的返回中以空字符串表示。
栈方法
ECMAScript提供了可以让数组的行为类似于其他数据结构的方法。
push()
- 可以接收任意数量的参数
- 将他们逐个添加到数组末尾
- 返回修改后的数组长度
pop()
- 从数组末尾移除最后一项
- 返回移除的项
队列方法
shift()
- 移除数组中第一个项并返回该项
结合使用push()和shift(),可以模拟队列来使用数组。
unshift()
- 在数组前端添加任意个项并返回新数组的长度。
同时使用unshift()和pop(),可以反向模拟一个队列。
重排序方法
reverse()
- 反转数组项的顺序
- 返回反转后的数组
sort()
- 按升序排列数组项。
返回排序后的数组
sort会调用每一项的toString方法,然后比较得到的字符串。即使数组相中每一项是数值,sort比较的也是字符串。
- 为了更灵活的排序,sort函数接收一个比较函数作为参数。
- 比较函数接收两个参数
- 第一个应在第二个参数之前:返回负数
- 两个参数相等:返回0
- 第一个应在第二个参数之后,返回正数
- 比较函数接收两个参数
//一个简单的比较函数function compare(value1,value2){ if(value1<value2){ return -1; }else if(value1>value2){ return 1; }else{ return 0; }}var values = [15,10,5,1,0];values.sort(compare);alert(values);//0,1,5,10,15
对于数值类型或者其valueOf方法会返回数值类型的对象类型,可以使用一个更简单的比较函数来实现按数值由小到大排列:
function compare(value1,value2){ return value1-value2;}
操作方法
concat()
基于当前数组中的所有项创建一个新数组
- 先创建当前数组的一个副本
- 将接收到的参数添加到这个副本的末尾
- 返回新构建的数组
有关参数:
- 没有传递参数的情况下只是复制当前数组并返回副本
- 传递了一个或多个数组,该方法会将这些数组中的每一项都添加到结果数组中。
- 传递的不是数组,这些值会被简单地添加到结果数组的末尾
var colors=["red","blue"];var colors2 = colors.concat("yellow",["black","white"]); //"red","blue","yellow","black","white"
slice()
基于当前数组中的一或多个项创建一个新数组。不会影响原始数组。
- 接受一或两个参数,分别代表要返回项的起始和结束位置。
- 只有一个参数时,返回从该参数指定位置开始到数组末尾的所有项。
- 有两个参数,返回起始和结束位置之间但不包括结束位置的项。
var colors = ["red","blue","yellow","black","white"];var colors1 = colors.slice(1); //"blue","yellow","black","white"var colors2 = colors.slice(1,4); //"blue","yellow","black"
- 如果方法中有一个负数,则用数组长度加上该数来确定相应的位置。如在一个长度为5的数组上调用slice(-2,-1)与调用slice(3,4)得到的结果是相同的。
- 如果结束位置小于起始位置,则返回空数组。
splice()
主要用途是向数组的中部插入项。
- 删除:可以删除任意数量的项,需提供两个参数:
- 要删除的第一项的位置
- 要删除的项数
如splice(0,2)会删除数组中的前两项
- 插入:向指定位置插入任意数量的项,需提供三个参数:
- 起始位置
- 0(要删除的项数)
- 要插入的项
如果要插入多个项,可以再传第四,第五个参数。
splice(2,0,“red”“green”)会从数组的位置2插入两个项。
- 替换: 可以向指定位置插入任意数量的项同时删除任意数量的项,需提供三个参数:
- 起始位置
- 要删除的项数
- 要插入的任意数量的项
插入的项数不必和删除的项数相等
如 splice(2,1,“red”“green”)会删除位置2的一项,再从位置2开始插入字符串。
splice方法始终都会返回一个数组,该数组包含了从原始数组中删除的项,如没有删除任何项则返回一个空数组。
var colors = ["red","blue","yellow"];var removed = colors.splice(0,1);//redcolors;//"blue","yellow"removed = colors.splice(1,0,"black","white");//[]colors;//"blue","black","white","yellow"removed = colors.splice(1,1,"red","pink");//blackcolors;//"blue","red","pink","white","yellow"
位置方法
indexOf()
lastIndexOf()
这两个方法都接收两个参数:
- 要查找的项
查找起点位置的索引(可选)
前者从数组开头开始查找,后者则从数组末尾开始查找。
都返回要查找的项在数组中的位置,没找到则返回-1。
在比较第一个参数和数组中的每一项时,都使用全等操作符
var numbers = [1,2,3,4,5,4,3,2,1];numbers.indexOf(4); //3numbers.lastIndexOf(4); //5numbers.indexOf(4,4); //5numbers.lastIndexOf(4,4); //3var person = {name:"nicholas"};var people = [{name:"nicholas"}];var morePeople = [person];people.indexOf(person); //-1;morePeople.indexOf(person); //0//这是由于person和people中的那一项并不是一个对象,因此利用全等比较会不相等,因此返回-1;//而morePeople是由person得来,其中的那一项与person是同一个对象,因此可以找到
迭代方法
每一个迭代方法都对数组中的每一项运行给定函数,都接受两个参数:
1.要在每一项上运行的函数,此函数接收三个参数
- 数组项的值
- 该项在数组中的位置
- 数组对象本身
2.运行该函数的作用域对象(可选)
every()
如果函数对每一项都返回true,则返回true
some()
如果该函数对任一项返回true,则返回true
filter()
返回该函数会返回true的项所组成的数组
forEach()
无返回值
map()
返回每次函数调用的结果组成的函数
以上这些项都不会修改数组中的值。
- 其中最像的是every()和some(),都用于查询数组中的项是否满足某个条件。
var numbers = [1,2,3,4,5,4,3,2,1];var everyResult = numbers.every(function(item,index,array){ return (item >2);}); //falsevar someResult = numbers.some(function(item,index,array){ return (item >2);}); //true
- filter函数则确定是否在返回的函数中包含某一项
var numbers = [1,2,3,4,5,4,3,2,1];var filterResult = numbers.filter(function(item,index,array){ return (item >2);}); //[3,4,5,4,3]
- map则返回函数作用于每一项上的结果所组成的数组
var numbers = [1,2,3,4,5,4,3,2,1];var mapResult = numbers.map(function(item,index,array){ return item*2;}); //[2,4,6,8,10,8,6,4,2]
- forEach只是对数组中的每一项运行传入的函数,没有返回值,本质上与使用for循环遍历数组一样
但并不会修改数组中的值!!
归并方法
reduce()
reduceRight()
这两个方法都会迭代数组所有项,而后构建一个最终返回的值。其中,reduce方法从数组的第一项开始,reduceRight从数组的最后一项开始向第一项遍历。
都接收两个参数:
- 在每一项上调用的函数
- 作为归并基础的初始值(可选)
- js学习笔记:引用类型——Array
- JavaScript学习笔记——引用类型:Array类型
- js 引用类型—Array类型
- JS引用类型——Array
- js学习笔记:引用类型——Object
- js学习笔记:引用类型——Date
- js学习笔记:引用类型——Function
- js学习笔记:引用类型——单体内置对象
- js学习笔记:引用类型——RegExp
- js学习笔记-引用类型
- js数据类型 ——引用类型(Array).1/3
- js数据类型 ——引用类型(Array).2/3
- js数据类型 ——引用类型(Array).3/3
- JavaScript引用类型——Array类型
- JS学习笔记——Date、Array
- 对js中的引用类型的理解(3)——Array类型
- 浅谈JavaScript引用类型——Array
- js学习笔记:基本类型和引用类型
- [UI]自定义View--雷达图
- java I/O流FileInputStream和FileReader使用及乱码问题
- 使用Markdown编辑器写博客
- Docker-Windows 2008 R2安装使用
- Nand Flash基础知识与坏块管理机制的研究
- js学习笔记:引用类型——Array
- 链表中与环相关的问题
- Angular的$broadcast,$emit and $on
- isEmpty和isBlank区别
- js简单学-主计时器
- Android ListView的OnItemClickListener()参数详解
- [电影]《指环王》新老三部曲完全赏析(魔戒再现)
- ajax VS websocket
- ibatis 中like使用