数组的方法

1. join (原数组不受影响)

该方法可以将数组里的元素,通过指定的分隔符,以字符串的形式连接起来。

返回值:返回一个新的字符串

//将数组用 - 符号连接起来
let arr = [1,2,3,4,5];
let str = arr.join('-');
console.log(str)//str = 1-2-3-4-5;

2. split (原数组不受影响)

该方法是用过指定的分隔符,将字符串分割成数组。

返回值:返回一个新的数组

let str = wqz-ttj；
let arr = str.split('-');
console.log(arr);// arr=['wqz','ttj'];

数组的增删操作(直接改变原数组)

3. push

该方法可以在数组的最后面,添加一个或者多个元素

结构: arr.push(值)

返回值:返回的是添加元素后数组的长度.

4. pop

该方法可以在数组的最后面,删除一个元素

结构: arr.pop()

返回值:返回的是刚才删除的元素.

5. unshift

该方法可以在数组的最前面,添加一个或者几个元素

结构: arr.unshift(值)

返回值: 返回的是添加元素后数组的长度

6. shift

该方法可以在数组的最前面,删除一个元素

结构: arr.shift()

返回值: 返回的是刚才删除的元素.

数组的翻转和排序(改变数组)

7. reverse 翻转数组

结构:arr.reserse()

8. sort

该方法可以对数组进行排序.

let arr = [1,3,5,2,4,23,122,34];
//没有参数:时按照首字符的先后排序
arr.sort()//arr=[1,122,2,23,3,34,4,5];
//有参数
arr.sort(function(a,b){
  return a-b;//从小到大排序
  return b-a;//从大到小排序
})

数组的拼接与截取(原数组不受影响)

9. concat

该方法可以把两个数组里的元素拼接成一个新的数组

返回值: 返回拼接后的新数组

let arr1 = [1,2,3];
let arr2 = [4,5,6];
let arr = arr1.concat(arr2);//arr = [1,2,3,4,5,6];
arr1.push(arr2);//arr1 = [1,2,3,[4,5,6]];

该方法和push的区别: push是直接把后一个元素原封不动的添加到第一个数组的后面;

10. slice 截取出来

该方法可以从数组中截取指定的字段,返回出来

返回值:返回截取出来的字段,放到新的数组中,不改变原数组

结构1:arr.slice(start,end) ;从start下标开始截取,一直到end结束,不包括end

let arr = [0,1,2,3,4,5,6,7];
let newArr = arr.slice(0,3)//newArr = [0,1,2];

结构2:arr.slice(start) ;从start下标开始截取,一直到最后

let arr = [0,1,2,3,4,5,6,7];
let newArr = arr.slice(2)//newArr = [2，3，4，5，6，7];

结构3:arr.slice( ) ;全部截取

let arr = [0,1,2,3,4,5,6,7];
let newArr = arr.slice(2)//newArr = [0,1,2,3,4,5,6,7];

删除或增加元素(任意在任何位置,直接改变原数组,没有返回值)

11. splice

结构1: arr.splice(start,deletedCount) 纯删除

从start下标开始,删除几个

结构2: arr.splice(start,deletedCount,item) 替换

从start下标开始,删除几个,并在该位置添加item

结构3: arr.splice(start,0,item) 纯添加

从start下标开始,删除0个,并在该位置添加item,start开始全部往后移动

let arr = [1,2,6,7,8];
arr.splice(2,0,3,4,5);//arr = [1,2,3,4,5,6,7,8];

查找元素在数组中出现的位置

12. indexOf

该方法用来查找元素在数组中第一次出现的位置

结构: arr.indexOf(元素)

特殊用法:

(1) arr.indexOf (ele,fromIndex),从fromIndex这个下标开始,元素第一次出现的位置

用来判断元素是否存在于数组中!

if (arr.indexOf(ele) === -1){//说明元素不存在!!
  console.log('元素不存在!)
} else {
  console.log(' 元素存在! ')
}

13. lastIndexOf

该方法用来查找元素最后一次在数组中出现的位置

ES5新增的遍历数组方法

1. forEach( )

该方法等同于for循环,没有返回值

用法:

arr.forEach(function(item,index,arr){
//里面的function是一个回调函数,
//item: 数组中的每一项;
//index:item 对应的下标索引值
//arr: 就是调用该方法的数组本身
})

2.map( )

映射,该方法使用和forEach大致相同,但是该方法有返回值,返回一个新数组,新数组的长度和原数组长度相等

//里面的function是一个回调函数,

//item: 数组中的每一项;

//index:item 对应的下标索引值

//arr: 就是调用该方法的数组本身

用法:

let arr = [1,32,54,6,543];
let res = arr.map(function(item,index,arr){
  return item*2;
})

3. filter( )

filter方法: 有返回值, 过滤出符合条件的元素

let arr = [1, 3, 5, 2, 4, 6];
let res3 = arr.filter(function(item, index) {
  return item % 2 === 0;
});
console.log(res3);

过滤出布尔类型为true的项

let arr2 = [0, "", false, 1, 3, 4];
let res4 = arr2.filter(function(item, index) {
  return item;
});
console.log(res4);

4. some

判断数组中有没有符合条件的项(只要有,就返回true),如果一个都没有,才返回false

let arr3 = [
  { name: "zs", age: 18, done: "notYet" },
  { name: "ls", age: 20, done: true },
  { name: "ww", age: 22, done: true }
];
let res5 = arr3.some(function(item) {
  return item.done;
});
console.log(res5);

5. every

判断数组中所有的项是否满足要求,如果全都满足,才返回true,否则返回false

let res6 = arr3.every(function(item) {
  return item.done;
});
console.log(res6);

6. find

找到符合条件的项,并且返回第一项

let arr4 = [
  { id: 3, name: "ls", done: false },
  { id: 1, name: "zs", done: true },
  { id: 2, name: "ww", done: true }
];
// var res7 = arr4.find(function(item) {
//   return item.done;
// });
// console.log(res7);

7. findIndex

找到符合条件的项的下标,并且返回第一个

var res8 = arr4.findIndex(function(item) {
  return item.done;
});
console.log(res8);

8.reduce

1.求和计算

*第一次：pre–>1 next–>2 index–>1

pre+next=1+2=3

*第二次：pre–>3 next–>3 index–>2

pre+next=3+3=6

*第三次：pre–>6 next–>4 index–>3

pre+next=6+4=10

第四次：pre–>10 next–>5 index–>4

var arr1 = [1,2,3,4,5] ;
  var new1 = arr1.reduce(function(pre,next,index){
      return pre+next ;
       //pre+next=10+5=15
  })
  console.log(new1);

2.扁平化数组(拼接数组)

  var arr2 = [[1,2,3],[4,5],[6,7]] ;
  var new2 = arr2.reduce(function(pre,next,index){
      return pre.concat(next);  //前数组拼接后数组 .concat()
  })
  console.log(new2);

3.对象数组叠加计算

  var arr3 = [
  {price:10,count:1},
  {price:15,count:2},
  {price:10,count:3}
  ];
  var new3 = arr3.reduce(function(pre,next,index){
      return pre+next.price*next.count;
  },0)  //在原数组第一项添加为0，不改变原数组，则可不操作第一项
  console.log(new3);

应用 : 计算数组中每个元素出现的次数

投票板

var names = ['Alice', 'Bob', 'Tiff', 'Bruce', 'Alice'];
var countedNames = names.reduce(function (allNames, name) {
    // console.log(allNames, '| ' + name);
    if (name in allNames) {
      allNames[name]++;
    } else {
      allNames[name] = 1;
    }
    return allNames;
}, {});
console.log(countedNames);

数组方法大全

数组的方法

1. join (原数组不受影响)

2. split (原数组不受影响)

数组的增删操作(直接改变原数组)

3. push

4. pop

5. unshift

6. shift

数组的翻转和排序(改变数组)

7. reverse 翻转数组

8. sort

数组的拼接与截取(原数组不受影响)

9. concat

10. slice 截取出来

删除或增加元素(任意在任何位置,直接改变原数组,没有返回值)

11. splice

查找元素在数组中出现的位置

12. indexOf

13. lastIndexOf

ES5新增的遍历数组方法

1. forEach( )

2.map( )

3. filter( )

4. some

5. every

6. find

7. findIndex

8.reduce

热门文章

最新文章

相关电子书

数组方法大全

数组的方法

1. join (原数组不受影响)

2. split (原数组不受影响)

数组的增删操作(直接改变原数组)

3. push

4. pop

5. unshift

6. shift

数组的翻转和排序(改变数组)

7. reverse 翻转数组

8. sort

数组的拼接与截取(原数组不受影响)

9. concat

10. slice 截取 出来

删除或增加元素(任意在任何位置,直接改变原数组,没有返回值)

11. splice

查找元素在数组中出现的位置

12. indexOf

13. lastIndexOf

ES5新增的遍历数组方法

1. forEach( )

2.map( )

3. filter( )

4. some

5. every

6. find

7. findIndex

8.reduce

热门文章

最新文章

相关电子书

10. slice 截取出来