【JavaScript高程总结】array（数组）
1.数组创建
//Array构造函数
var arr = new Array(3)//创建一个lengrh为3的数组但每一项都没有值
var arr = new Array(red,blue,green)//创建一个值为red,blue,green的数组
//字面量方法
var arr = ["red", "blue", "green"];
var arr = [];
Array.length(通过length在数组末尾删除新增项)
数组的length有一个特点他不是只读
因此通过修改这个属性可以从末尾移除项
或者向数组添加新的项（新项由于没有值所以是undefined）
var arr = ["red", "blue", "green"]
arr.length = 2;
alert(colors[2]);//undefined
arr.length = 3;
alert(colors[2]);//undefined
通过length向数组末尾添加新的项
var arr = ["red", "blue", "green"]
arr[arr.length]=pink
alert(arr[2]) //red, blue,green,pink
2.检测数组（instanceof和Array.isArray(value)）
typeof
var s = "Nicholas";
var i = 22;
var b = true;
var u;
var n = null;
var o = new Object();
alert(typeof s);//string
alert(typeof i);//number
alert(typeof b);//boolean
alert(typeof u);//object
alert(typeof n);//object
alert(typeof o);//object
缺点：常有一些无法预知的行为例如正则被判断为函数 null判断为对象）
instanceof
if(value instanceof Array){
//对数组进行操作
}
缺点：
对一个网页或一个全局作用域能得到满意的结果（instanceof是window下的属性）
由于一切引用类型都是object的事例因此value instanceof Object始终返回true
instanceof检测基本类型始终是false
Array.isArray(value)
ECMAScript5新增（是Array构造函数的方法）
支持的浏览器IE9+,Firefox4+，Safari5+Opera10.5+和Chrome
安全的检测方法（通过原型上的toString方法）
var a=["red","blue","pink"]
//toString方法把数组变为字符串
a.toString() //"red,blue,pink"
//toString原型的方法返回的结果
Object.prototype.toString.call(a) //[object Array]
通过原型的方法检测
function isArray(val){
return Object.prototype.toString.call(val)=="[object Array]"
}
//函数检测
function isFunction(val){
return Object.prototype.toString.call(val)=="[object Function]"
}
//正则检测
function isRegExp(val){
return Object.prototype.toString.call(val)=="[object RegExp]"
}
3.转换数组
方法：
valueOf()/toString()/toLocaleString()/join()
var colors = ["red", "blue", "green"]
alert(colors.toString()) // red,blue,gree
alert(colors.valueOf()) // red,blue,green
alert(colors) // red,blue,green
alert(colors.toLocaleString())
上面三个方法都返回red,blue,green
区别是
alert()
只接受字符串所以后台调用原型中的toString()
.valueOf()
其实valueOf()返回的还是数字alert()帮他调用了 toString()
.toString()
调用原型的toString()方法
.toLocaleString()
结果一样但是他调用的是原型中的toLocaleString()
var colors = ["red", "blue", "green"]
alert(colors.join(",")); //red,green,blue
alert(colors.join("||")); //red||green||blue
join()
直接通过指定的字符串拼接数字可以是个空格可以什么都没有
4.数组的操作
堆栈队列：
.push()
--在数组后面追加项（可以任意个项）；返回改变后数组的length
.pop()
--取数组后面项并删除原数组的项；返回取得的项；
.unshift()
--在数组前面添加项（可以任意个项）；返回改变后数组的length
.shift()
--取数组前面项并删除原数组的项；返回取得的项；
image.png
重排序：
.reverse()
--翻转数组顺序（改变原数组）
var values = [1, 2, 3, 4, 5];
values.reverse();
alert(values); //5,4,3,2,1
.sort()
--排序默认升序可以接受一个比较函数作为参数
var values = [0, 1, 5, 10, 15];
values.sort();
alert(values); //0,1,10,15,5
//由于默认比较方法的原因10排在了5的前面
这个时候就要用到比较函数
比较函数接受两个参数
如果第一个参数要位于第二个参数之前则返回一个负数
如果第一个参数要位于第二个参数之后则返回一个正数
两个参数相等返回0
function compare(val1,val2){
if(val1<val2){
return -1
} else if(val1>val2){
return 1
}else {
return 0
}
}
var values = [0, 1, 5, 10, 15];
values.sort(compare);
alert(values); //0,1,5,10,15
function compare(val1,val2){
if(val1<val2){
return 1
} else if(val1>val2){
return -1
}else {
return 0
}
}
var values = [0, 1, 5, 10, 15];
values.sort(compare);
alert(values); //15,10,5,1,0
操作方法
.concat()
以数组a为基础同时添加我要加入的值（参数）组成一个新数组
--返回一个新数组
--不改变原始数组；
--参数可以传入多个数组
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()
我要取得数组中的部分内容形成一个新数组且不改变原数组就用这个方法
--返回一个新数组
--不改变原始数组；
--接受两个参数及要返回项的起始和结束位置
var colors = ["red", "green", "blue", "yellow", "purple"];
var colors2 = colors.slice(1);
var colors3 = colors.slice(1,4);
alert(colors2); //green,blue,yellow,purple
alert(colors3); //green,blue,yellow
.splice()
强大的数组方法可以删除插入替换
可以实现上面的push、pop、shift、unshift方法
--会修改原数组
--返回删除的项没有则返回空数组
var colors = ["red", "green", "blue"];
var removed = colors.splice(0,1);
alert(colors); // green,blue
alert(removed); // red
removed = colors.splice(1, 0, "yellow", "orange");
alert(colors); // green,yellow,orange,blue
alert(removed);//返回一个空数组
removed = colors.splice(1, 1, "red", "purple");
alert(colors); // green,red,purple,orange,blue
alert(removed); // yellow
位置方法
查找一个值在数组中的位置
支持的浏览器IE9+,Firefox2+，Safari3+Opera9.5+和Chrome
.indexOf()
--从数组第一个值往后开始顺序查找
--第一个参数要：查找的值
--第二个参数：从数组第几个值开始找（可选）
.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
var person = { name: "Nicholas" };
var people = [{ name: "Nicholas" }];
var morePeople = [person];
alert(people.indexOf(person)); //-1
alert(morePeople.indexOf(person)); //0
迭代方法（对数组中每一项遍历）
.every()
.some()
上面两个都是返回布尔值
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
上面.every()只有当数组中所有值都大于2才会返回true否则返回false
.some()呢只要有一个值大于2就会返回true
.filter()
例如：想要取数组中所有大于2的值可以用这个方法
--返回符合条件的值
--不修改原数组
var numbers = [1,2,3,4,5,4,3,2,1];
var filterResult = numbers.filter(function(item, index, array){
return (item > 2);
});
alert(filterResult); //[3,4,5,4,3]
.map()
例如：想要得到一个新数组；新数组的值是原数组每一项都乘以2；可以用这个
--返回的数组是在原数组上每一项经过传入函数操作的结果
--不修改原数组
var numbers = [1,2,3,4,5,4,3,2,1];
var mapResult = numbers.map(function(item, index, array){
return item * 2;
});
alert(mapResult); //[2,4,6,8,10,8,6,4,2]
.forEach()
上面的方法其实都可以用.forEach()得到
--数组的遍历
--没有返回值
var numbers = [1,2,3,4,5,4,3,2,1];
numbers.forEach(function(item, index, array){
//执行操作
});
归并的方法
.reduce()
.reduceRight()
这两个方法都会迭代数组所有项然后构建一个最终返回的值
只是.reduce()从数组的前面开始.reduceRight()从数组的后面开始
参数
--每一个项调用的函数【函数参数[前一个值，当前值，项的索引，数组对象]】
--（可选）归并基础的初始值
var sum = values.reduce(function(prev, cur, index, array){
return prev + cur;
});
alert(sum);//15
var sum = values.reduceRight(function(prev, cur, index, array){
return prev + cur;
});
alert(sum);//15
