JavaScript Array的常用方法(一)

来源:互联网 发布:js namespace用法 编辑:程序博客网 时间:2024/05/22 18:22

1. 创建数组的方法

1.1 采用数组构造函数Array()创建

  • 声明或创建一个不指定长度的数组的方式为
var arr = new Array();
  • 声明或创建一个指定长度的数组的方式为:
var arr = new Array(3);//[undefined,undefined,undefined]
  • 声明或创建一个带有默认值得数组的方式为:
var arr = new Array('a','b','c');//['a','b','c']

1.2 采用直接量创建

//创建一个空数组var arr1 = [];//创建一个有三个元素的数组var arr2 = [1,2,3]

1.3 Array.from()方法从一个类似数组或可迭代的对象中创建一个新的数组示例

const fruit = ['apple','banana','blackberry'];Array.from(fruit);//['apple','banana','blackberry'];Array.from('fruit');//['f','r','u','i','t'];

语法

Array.from(arrayLike[,mapFn[,thisArg]])

参数
arrayLike
想要转换成真实数组的类数组对象或可遍历对象
mapFn(可选)
可选参数,如果指定了该参数,则最后生成的数组会经过该函数的加工处理后再返回。
thisArg(可选)
可选参数,执行mapFn函数时this的值。
返回值
一个新的Array实例

用法举例

根据已知数组,创建一个新数组,要求新数组中的每一项都是原数组对应项的2倍。

var arr1 = [1,2,3];var arr2 = Array.from(arr1,x => 2*x );console.log(arr2);//[2,4,6]

创建一个数组,该数组的每一项刚好等于该项的系数,且长度为100

Array.from({length:100,(v,i) => i);//[0,1,2,3,...,99]

1.4 Array.of()方法创建一个具有可变数量参数的新数组实例,而不考虑参数的数量或类型

Array.of()和Array构造函数之间的区别在于处理整数参数:Array.of(3)创建一个具有单个元素7的数组,而Array(7)创建一个包含7个undefined元素的数组。

Array.of(3);//[3]Array.of(1,2,3);//[1,2,3]Array(3);//[undefined,undefined,undefined];Array(1,2,3);//[1,2,3]

如果原生不支持该方法,可以自己创建该方法

if(!Array.of){    Array.of = function() {        return Array.prototype.slice.call(arguments);    }}

2. 合并数组的方法

2.1 concat()方法

concat()方法用于合并两个或多个数组。此方法不会改变现有数组,而是返回一个新数组。

//合并数组var num1 = [1,2,3];var num2 = [4,5,6];var num3 = [7,8,9];var num4 = num1.concat(num2);console.log(num4);//[1,2,3,4,5,6]var num5 = num1.concat(num2,num3);console.log(num5);//[1,2,3,4,5,6,7,8,9]//将非数组值合并到数组里var alpha = ['a','b','c'];alpha.concat('d','e',['f','g']);//['a','b','c','d','e','f','g']

2.2 使用push()和apply()合并两个数组

var num1 = [1,2,3];var num2 = [4,5,6];Array.prototype.push.apply(num1,num2);console.log(num1);//[1,2,3,4,5,6]

3.遍历数组的方法

3.1 Array.prototype.forEach()

forEach()方法对数组的每个元素执行一次提供的函数

array.forEach(callback(currentValue,index,array){    //do something},this);/*    callback为数组中每个元素执行的函数,该函数接收三个参数:    currentValue(当前值):数组中正在处理的当前元素;    index(索引):数组中正在处理的当前元素的索引;    array:forEach()方法正在操作的数组。    thisArg(可选):当执行回调函数时,用作this的值。    返回值为undefined*/
[1,2,3].forEach(function(elem,index,array){    console.log(elem);});//输出1,2,3

如果数组在迭代时被修改了,则其他元素会被跳过
下面的例子输出1,2,4。当到达2时,整个数组的第一项被移除了,这导致所有剩下的项上移一个位置。因为元素4现在在数组更前的位置,3会被跳过。forEach()不会再迭代之前创建数组的副本。

var num = [1,2,3,4];num.forEach(function(e,i){    console.log(e);    if(e === 2){        num.shift();    }});//输出1,2,4

3.2 Array.prototype.map()

map()方法创建一个新数组,其结果是该数组中的每个元素调用一个提供的函数。

array.map(callback(currentValue,index,array){    //do something},this);/*    callback为数组中每个元素执行的函数,该函数接收三个参数:    currentValue(当前值):数组中正在处理的当前元素;    index(索引):数组中正在处理的当前元素的索引;    array:forEach()方法正在操作的数组。    thisArg(可选):当执行回调函数时,用作this的值。    返回值为一个新数组,每个元素都是回调函数的结果*/
//求平方根var num = [1,,4,9];var roots = num.map(Math.sqrt);//roots的值为[1,2,3]
//反转字符串var str = '12345';Array.prototype.map.call(str,function(x){    return x;}).reverse().join('');//输出'54321'
原创粉丝点击