5.2 Array类型的方法汇总

所有对象都具有toString(),toLocaleString(),valueOf()方法。

1.数组转化为字符串

toString(),toLocaleString() ,数组调用这些方法,则返回由数组每项字符串形式拼接而成的、以逗号分隔的字符串。实际上,为了创建这个字符串,会调用数组的每一项的toString()方法。

valueOf() 返回对象的原始值。

var color = ["red","green","blue"];
console.log( color.toString());//red,green,blue
console.log( color.toLocaleString());//red,green,blue
console.log(color.valueOf());//["red", "green", "blue"]

join()函数,接收一个分隔符的参数,将拼接成以分隔符连接的字符串。

console.log(color.join("|"));// red|green|blue

注:alert()函数接收的参数必须是字符串,如果参数不是字符串,比如说是对象,则在后台默认调用参数的toString()方法。


2.数组元素的添加与删除

push()向数组最后一位添加元素,返回添加后的数组的长度

pop() 删除数组最后一位元素,返回删除的项

shift() 删除数组首位元素,返回删除的项

unshift() 向数组首位添加元素,返回添加后的长度。


3.数组重排序方法

reverse() 翻转数组项的顺序;如:

var arr = [1,2,3];
console.log(arr.reverse());// [3,2,1]

sort() 数组排序。在后台会调用数组中的每一项的 toString()方法,先转换为字符串,然后再比较。按照从小到大排序。如:

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

可能上面并没有得到我们想要的结果,我们可能想要按照数字大小来排序的。

那么可以给sort()函数传递一个比较函数作为参数,比较函数接受两个参数,

如果参数1大于参数2,则返回一个正数;

如果参数1小于参数2,则返回一个负数;

如果参数1等于参数2,则返回0;

如:

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

上面compare()函数,也可以改写如下,执行跟上面一样:

function compare(value1,value2){
    return (value1 - value2);
}

4. 数组和字符串的方法

concat();向数组末尾添加新的元素。如果是字符串调用这个方法,则是向字符串末尾拼接新的字符串。

slice();截取数组中的某些项。如果是字符串调用这个方法,则是截取字符串中的某些字符。可接受两个参数。

splice(); 修改数组中的某些项。详细请见:MDN的网站上的手册:Array.prototype.splice()

indexOf();查找数组中的某项元素第一次出现在数组中的位置 。接受两个参数,即要查找的项,和查找起点位置的索引。

lastIndexOf();类似于indexOf(),但是它是从数组的末尾查找。字符串也有这两个查找元素的方法。都返回元素在数组或者字符串中的位置的索引,如果没有找到,则返回-1。

下面看一个容易出错的小例子:

var person = {name: "Nicholas"}; //这是一个对象
var people = [{name: "Nicholas"}]; // 这是一个数组,包含一个元素,且这个元素是对象
var morePeople = [person];//这是一个数组,包含一个元素,且这个元素也是一个对象
console.log(people.indexOf(person));// -1
console.log(morePeople.indexOf(person)); // 0

为什么第一个语句打印出-1呢,那么说明 people 这个数组里面不包含person这个对象,原因在此:

console.log(people[0] == person);//false 不属于同一个对象

说明 people 数组里面的那个对象元素跟person这个对象并不是同一个对象,虽然内容都一样。后面会讲到面向对象,你将会理解为什么看似内容一样,但是为什么他们并不是同一个对象。

这几个数组与字符串的方法,都是基于他们的副本操作的,也就是说,不影响原来操作的变量。


5.数组的迭代方法

数组的迭代,用我自己的话说就是数组的遍历,即遍历数组的每一项,去执行某些操作。

ES5中为数组定义了5个迭代方法。都接受两个参数,第一个参数:数组中每一项要执行的函数;第二个参数可选:执行该函数的作用域,影响this的值。

作为第一个参数的函数,接受三个参数:数组项的值、该项在数组中的位置、数组对象本身。

every();对数组中每一项都执行函数,如果每一项返回true,则返回true;(返回布尔值)

some();……………………………………. ,如果有一项返回true,则返回true;(返回布尔值)

filter();………………………………………  ,返回 true 项组成的数组(返回数组)

map();……………………………………… .,返回所有项组成的数组(返回数组)

forEach();……………………………………,没有返回值

var numbers = [0,1,5,10,15];

var resultNumbers = numbers.every(function(item,index,numbers){
    return (item > 5);
});
console.log(resultNumbers);// false;

var resultNumbers2 = numbers.some(function(item,index,numbers){
    return (item > 5);
});
console.log(resultNumbers2);// true;

var resultNumbers3 = numbers.filter(function(item,index,numbers){
    return (item > 5);
});
console.log(resultNumbers3);// [10, 15];

var resultNumbers4 = numbers.map(function(item,index,numbers){
    return (item * 2);
});
console.log(resultNumbers4);// [0, 2, 10, 20, 30]

var resultNumbers5 = numbers.forEach(function(item,index,numbers){
    return (item * 2);
});
console.log(resultNumbers5);// undefined 因为没有返回值,所以,即使你return,也会打印出 undefined;

6.数组的归并方法

reduce(),reduceRight()。迭代数组的所有的项,最终返回一个值。详细见:MDN 的Array.prototype.reduce()

更详细的关于数组的操作方法,后面会更新补充。

原文链接:http://www.1024idea.com/archives/358

原文地址:https://www.cnblogs.com/goldWen90/p/6231463.html