第一周学习笔记

学习笔记

5.2 数组类型（Array）

1、数组：数据的有序列表
JavaScript数组与其他语言的差别：

• 数组里面的每一项可以保存任意的数据类型。
• 数组的大小可以动态调整，可以随着数据的添加自动增长以容纳新数据。

2、创建数组的方法

• Array构造函数法
  var colors= new Array();
var colors= new Array(12);//设置数组里面的项目数量，即length
var colors= new Array("red","blue","yellow");//直接给出数组里面的项目的值
var colors= Array();//可以省略new
• 数组字面量表示法
  var colors = ["red","blue","black"];//创建一个包含三个字符串的数组；
var colors = [];//创建空数组；
var colors = ["red","blue",];//不可再最后一项后面添加逗号，否则会造成错误，此时会创建一个包含3个或者是2个项目的数组，三个项目为："red","blue"和undefined。

3、读取和设置数组的值
语法：Array[number] 数组的项的序数是从0开始，即索引数组的第一项使用的数字是0。当设置数组的某个值时序号大于原有数组的length值，则数组会自动将length值增加1，
例如：var colors[0]="red";

4、length属性
length表示数组的中的项数目，colors=["red","blue","black"]的length是3。length的最大值是4294967295
length不只可以读取，还可以设置

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

此时数组中的项数设置成2之后，第三项就被移除，同样，也可以增加数组的项数，增加的项默认为undefined，可以自己设置。

var colors=["red","blue","black"];
colors[3]="white";
alert(colors[colors.length-1]);//white

注意，只要对length进行设置，array里面的项就会进行相应的变化

var colors=["red","blue","black"];
colors[99]="black";
alert(colors[98]);//undefined

此处设置第100项后前面第3项到100项之间都有新的项，默认为undefined。

5.2.1 检测数组

• ECMAScript3:if(value instanceof Array){}
  存在假定只有一个全局执行环境的问题，当网页存在多个框架且不同框架之间传送数组时，不同框架中的数组的构造函数不同。
• ECMAScript5：if(Array.isArray(value)){}
  解决instanceof的缺点，存在兼容性：IE9+，Firefox4+，Safari5+，Opera10.5+和Chrome。

5.2.2 转换方法

• valueOf()
  返回数组
  var colors=["red","blue","black"];
alert( colors.vlaueOf());//red,blue,black

• toString()
  返回数组中每个值的字符串拼接而成的以逗号隔开的字符串。
  var colors=["red","blue","black"];
alert( colors.toString());//red,blue,black

• toLocaleString()
  返回的值一般情况下与前面两种方法一样，但是在特定的环境下会根据特定环境（local）来给出值。
  var colors=["red","blue","black"];
alert( colors.toLocaleString());//red,blue,black

• join()
  可以自己设定字符串中的相邻值之间分隔的符号。
  var colors=["red","blue","black"];
alert( colors.join("||"));//red||blue||black
  join（）默认是逗号
  当数组中的某一项是null或者是undefined时，使用转换方法返回的值是空字符串

5.2.3 栈方法

数组具有类似栈的功能，可以通过ArrayName.push()和ArrayName.pop()来实现数据的推入和删除。

var colors=new Array();
colors.push("red","black","white");
colors.toString();// "red,black,white"
colors.pop();
alert(colors);//"red,black"

5.2.4 队列方法

数组具有队列功能，通过ArrayName.push()和ArrayName.shift()来实现数据的加入和移除。

 var colors=new Array();
    colors.push("red","black","white");
    colors.toString();// "red,black,white"
    var item=colors.shift();
    item；//"red"
    alert(colors);//"black,white"

unshift()可以在数组的前端添加新的项，同时返回数组的长度。

var colors=new Array();
colors.unshift("red","black","green");
colors.pop();
colors;//["red","black"]
colors.unshift("blue");
colors;//["blue","red","green"]

5.2.5 重排序方法

1. ArrayName.reverse()：反转数组项的顺序
   var count=[1,2,3,4,5];
count.reverse();
count;//[5,4,3,2,1]
2. ArrayName.sort()：按升序排列数组项
   sort.()先调用每个数组项的toString()将数组项字符串化，再进行比较排序，也就说sort是根据字符串来比较的，不管数组项的数据类型。
   var count=[1,5,10,16,2,7];
count.sort();
count;//[1, 10, 16, 2, 5, 7]
   可以在sort()中加入一个比较函数来实现数值的按序排列，将比较函数变成sort()的参数。
   function compare(number1,number2){
if(number1>number2){return 1;}
else if (number1=number2){return 0;}
else if (number1 < number2){return -1;}
}
var count=[1,5,10,16,2,7];
count.sort(compare);
count;//[1, 2, 5, 7, 10, 16]
   实现降序排列只需要将1和-1的位置颠倒就可以。

5.2.6 操作方法

1、ArrayName.concat()
首先复制并创建一个与当前数组一样的新数组，同时可以传入参数来增加新数组里面的项。参数可以是值或者是数组，新添加的项会被添加到后面。原始数组不受影响

var numbers=[1,2,3,4];
var numbers1=numbers.concat(4,5,6,[7,8,9]);
numbers;//[1,2,3,4]
numbers1;//[1,2,3,4,4,5,6,7,8,9]

2、ArrayName.slice()
基于当前数组中的一个或多个项创建一个新的数组。可以接受一个或者两个参数，参数表示的是原本数组的项的位置，假设传入参数a和b，则新的数组里面的项是复制原本数组里面从a位置之后到b位置（包含b位置的项）的项，若只有一个参数，则复制从参数位置开始直到结束的所有项。如果参数是负数，则以负数加上数组的项数目，如果结束位置小于起始位置，返回空数组。

var numbers=[1,2,3,4,5];
var numbers1=numbers.slice(1,5);
numbers1;//[2, 3, 4, 5]
 var numbers=[1,2,3,4,5];
var numbers1=numbers.slice(-4,-1);
numbers1;//[2,3,4]

3、ArrayName.splice()
向数组的中部插入项

• 删除：指定连个参数，参数代表要删除的第一项的位置和要删除的项数。
• 插入：向指定位置插入任意数量的项，需提供3个参数，第一个参数代表插入的位置，参数二代表删除的项数，参数三代表插入的项。参数三可以是多个以实现多项插入。
• 替换：向指定位置插入任意数量的项同时删除任意数量的项。3个参数：起始位置、要删除的项数、插入的项。插入的项数目不必与删除的一样多。
  splice方法始终会返回一个数组，包含被删除的项
  var numbers=[1,2,3,4,5];
var numbers1=numbers.splice(1,2);
numbers1;//[2,3]
numbers;//[1,4,5]
var numbers=[1,2,3,4,5];
var numbers1=numbers.splice(1,2,6,7,8);
numbers;//[1, 6, 7, 8, 4, 5]

5.2.7 位置方法

接受两个参数：要查找的项和表示查找起点位置的索引。
1. indexOf()：从前往后查找。
2. lastIndexOf()：从后往前查找。
这两个方法均返回要查找的项在数组中的位置，若没有找到则返回-1

var numbers=[1,2,3,4,5,5,6,6,7,8,9];
var target=numbers.indexOf(5,0);
target;//4
var target1=numbers.lastIndexOf(5,6);
target1;//5
var target2=numbers.lastIndexOf(5,0);
target2;//-1

兼容性：IE9+，Firefox2+，Safari3+，Opera9.5+，Chrome

5.2.8 迭代方法

迭代方法接收2个参数：在每一项上运行的函数和（可选的）运行该函数的作用域对象——影响this值。
函数接收3个参数：数组项的值、该项在数组中的位置和数组对象本身。

1. every()：对数组的每一项运行给定的函数，只有函数对每一项返回true时才会返回true。常用于查询数组中的项是否符合条件。
2. filter()：对数组每一项运行给定的函数，返回该函数会返回true的项组成的数组。
3. forEach()：对函数的每一项运行给定的函数，没有返回任何值。
4. map()：对数组的每一项运行给定的函数，返回每次函数调用的结果的组成的数组。

5. some()：对数组每一项运行给定的函数，任一项返回true，则返回true。常用于查询数组中的项是否符合条件。
   这5个方法均不会修改数组中包含的值
   兼容性：IE9+、Firefox2+、Safari3+、opera9.5+、Chrome

   var numbers=[1,2,3,4,5,6,7];
   var numbers1=numbers.some(function(number,index,numbers){return number>3;});
   numbers1;//true

5.2.9 归并方法

迭代数组的所有项构建一个最终返回的值。
接收两个参数：作用于每一项的函数和（可选的）作为归并基础的初始值。
函数接收4个参数：前一个值、当前值、项的索引和数组对象。
函数返回的值会作为第一个参数自动传给下一项，第一次迭代时，第一个参数是第一项，第二个参数是第二项，所以第一次迭代时发生在第二项。
1、reduce()
从头到尾历遍整个数组。
2、reduceRight()
从最后一项向第一项历遍整个数组。
兼容性：IE9+、Firefox3+，Safari4+，Opera10.5+和chrome

var numbers=[1,2,3,4,5];
 var number=numbers.reduce(function(pre,cur,index,array){return pre*cur;})
number;//120