Array [ ] 数组 的一些方法（以及跳出循环）

数组 Array [] 的方法

有下标，有length

Array.from(类数组) 类数组转数组

  1. 将一个类数组对象或者可遍历对象转换成一个真正的数组。
    （类数组：是一个有length，属性名是数字的对象（像数组，却不能用数组的方法）。比如：获取的一组元素/arguments）
  2. Array.from(类数组, ()=>{})还可以接受一个函数为第二个参数，作用类似于数组的map方法，用来对每个元素进行处理，将处理后的值放入返的数组。
  3. 可以将字符串转换为数组
  4. Array.from() 接受一个真正的数组作为参数，会返回一个一模一样的新数组。

更多类数组 转 数组的方法，看另一篇随笔

let arr = [12,45,97,9797,564,134,45642];
let set = new Set(arr);
console.log(Array.from(set, item => item + 1));// [ 13, 46, 98, 9798, 565, 135, 45643 ]

查询类 indexof lastIndexOf findIndex() find() includes Array.isArray()

indexOf 找到数组中指定字符首次出现的索引,需要传参，不会改变原数组，返回位置的索引，找不到返回-1
lastIndexOf 找到数组中指定字符末次出现的索引,找不到返回 -1
findIndex 能够返回符合 callback 条件的那一项的索引， 不改变原数组，没有匹配项就返回 -1
find 找到数组中符合 callback 条件的值，而不是索引，不改变原数组，没有匹配项为 undefined
includes 找到数组中是否包含某一项，返回值是布尔值 true/false
Array.isArray() 检测判断是否为数组

let ary = [0, 2, 4, 6, "hello", 0, 1, 2, 3];
console.log(ary.indexOf(7)); // -1
console.log(ary.lastIndexOf(2)); // 7
console.log(ary.includes("hello")); // true
console.log(Array.isArray(ary)); // true
let b = ary.findIndex((e) => {
  return e === 3
})
console.log(b) // 复合条件的第一项的索引 8
console.log(ary.find((item) => item === 3)) // 复合条件的值 3
console.log(ary) // 不改变原数组

截取类 slice

slice 截取数组指定位置的数据，需要传参，不会改变原数组，返回一个新数组。
ary.slice(n, m) 从第 n 位开始截到第 m-1 位

let ary1 = [0, 1, 2, 3, 4, 5];
console.log(ary1.slice(2, 4)); // [2, 3]

// 只有一个参数 n, 从第 n 位开始截到最后一位
ary1.slice(2); // [2, 3, 4, 5]

// 参数为负数，从后往前截取，ary1.slice(-n, -m)
ary1.slice(-2); // [4, 5]
ary1.slice(-2, -1); // [4]

操作类 push pop unshift shift splice

push 往数组的末尾添加一个或多个数据， 需要传参， 会改变原数组，返回值是新数组的 length。
pop 往数组的末尾删除一个数据， 不需要传参，会改变原数组，返回值就是删除的那个数据。
unshift 往数组的首位添加一个或多个数据， 需要传参， 会改变原数组，返回值是新数组的 length。
shift 往数组的首位删除一个数据， 不需要传参，会改变原数组，返回值就是删除的那个数据。
splice 能够增、删、改、查数组， 需要传参， 会改变原数组，返回值就是删除的那段数组。

let ary2 = [0, 1, 2, 3, 4, 5];
console.log(ary2.push(6, '7')); // 8
console.log(ary2); // [0, 1, 2, 3, 4, 5, 6, "7"]
console.log(ary2.pop()); // '7'
console.log(ary2.unshift('f')); // 8
console.log(ary2.shift()); // 'f'
let a = ary2.splice(1, 2, 'f', 'd', 'd'); // 从第一项开始，删除2个，添加"f",'d','d'
console.log(ary2); // [0, "f", "d", "d", 3, 4, 5, 6]
console.log(a); // [1, 2]

连接 join concat

join 用指定字符拼接数组 需要传参，不会改变原数组，返回值为字符串。
concat 把两个数组拼接成一个，需要传参，不会改变原数组，返回值为拼接后的新数组。

  let ary3 = ['zhu', 'uo'];
  let ary4 = [520, 1314];
  console.log(ary3.join('g')); // 'zhuguo'
  console.log(ary3.concat(ary4)); // ["zhu", "uo", 520, 1314]
  console.log(ary3); // ["zhu", "uo"]

翻转 reverse

reverse 翻转数组，不需要传参，会改变原数组，返回值是翻转后的数组

ary5 = [1, 2, 3, 4, 5];
console.log(ary5.reverse());//[5, 4, 3, 2, 1]
console.log(ary5);

排序 sort

sort 参数是一个函数，函数有两个形参，return a-b是升序，b-a是降序。
会改变原数组

ary5 = [4, 2, 5, 3, 1];
ary5.sort(function (a, b) {
    return a - b
});
console.log(ary5);//[1, 2, 3, 4, 5]

//数组包对象
ary5=[{age:18},{age:19}]
ary5.sort(function (a, b) {
　　return a.age - b.age
});

// 按时间先后排序
var data = [
  {
      name:'1',
      time:'2019-04-26 10:53:19'
  },
  {
      name:'2',
      time:'2019-04-26 10:51:19'
  },{
      name:'3',
      time:'2019-04-26 11:04:32'
  },{
      name:'4',
      time:'2019-04-26 11:05:32'
  }
]
data.sort(function(a,b){
  return a.time < b.time ? 1 : -1
})

循环 forEach 、map 、filter 、some 、every

forEach 专门循环数组的，方法用于调用数组的每个元素，并将元素传递给回调函数，有多少项就执行多少次（不支持continue、break）。

  • 没有返回值，
  • 不会改变原数组

注意: forEach(callback(item[, index, ary]), this) 对于空数组是不会执行回调函数的。
两个参数： 1. 回调函数（1.每一个数据（必须）2.索引（可选）3.整个数组（可选））
　　　　　　 1. 改变 this 的方向（可选，如果这个参数为空，this 会指向 undefined）

map 循环数组，

  • 返回一个新数组，数组里的每一项就是 callback 中返回的值。
  • 有多少项就执行多少次，
  • 不会改变原数组的值。

every 方法用于检测数组所有元素是否都符合指定条件（通过函数提供）。

  • 如果数组中检测到有一个元素不满足，则整个表达式返回 false ，且剩余的元素不会再进行检测。
  • 如果所有元素都满足条件，则返回 true。

some 方法用于检测数组中的元素是否满足指定条件（函数提供）。

  • 如果有一个元素满足条件，则表达式返回true , 剩余的元素不会再执行检测。
  • 如果没有满足条件的元素，则返回false。
  • 不会对空数组进行检测。
  • 不会改变原始数组。

filter 过滤，

  • 返回一个过滤后的数组。（返回符合判断的结果），
  • 不会改变原数组

跳出循环

continue 跳过本次循环，进入下一次循环
break 跳出（结束）整个循环
return 终止此作用域 return 后面的所有代码
（continue 和 break 在循环中的详细对比）

let arr6 = [2, 3, 5, 6, 8, 9];
let b = arr6.forEach(function (ele, i, all) {
  // console.log(ele); // 2  3  5  6  8  9
  // console.log(i); // 0  1  2  3  4  5
  // console.log(all); // [2, 3, 5, 6, 8, 9]  而且返回了length 次
  console.log(this); // #document   输出了length次
  return 1
}, document);
console.log(b); // undefined
/*****************************map********************************/
  let c = arr6.map(function (ele, i, all) {
    // console.log(ele, i, all)
    return ele + 1
  });
  console.log(c); // [3, 4, 6, 7, 9, 10]
/****************************every********************************/
let d = arr6.every(function (item, index) {
  // console.log(item); // 2  3  5  6  8  9
  // console.log(index); // 0  1  2  3  4  5
  return item > 2 // 条件中一个不成立就为false，全部成立就为true。
});
console.log(d);//true|false
/***************************some***********************************/
let e = arr6.some(function (item, index) {
  return item > 4 // 条件中有一个成立就为true，全部不成立就为false。
});
console.log(e); // true|false
/*****************************filter********************************/
let f = arr6.filter(function (item, index) {
  return item > 5; // 把符合条件的放在一个数组总
});
console.log(f); // [6, 8, 9]

缩减：reduce(回调函数，初始值)

当需要计算、统计数组中的每一项的结果时用它
这一次的结果需要上一次的返回
通多一些算法，将一个数组缩减成一个。比如：累加、累减、累乘、累除等等。
arr.reduce((a, b) =>{ return a + b }, 0)

let arr = [2, 4, 6, 8, 10];
let a = arr.reduce((a, b) =>{ // a：代表上一次的结果。  b：是本次循环的那个。
  return a + b
}, 0); // 零是初始值
console.log(a); // 累加  结果是 30
let ary = arr.reduce((a, b) =>{
  a.push(b);
  return a
}, []);  // 初始值可以是数字、数组[]、对象{}
console.log(ary); // [2, 4, 6, 8, 10]
posted @ 2018-10-25 18:27  真的想不出来  阅读(1652)  评论(0)  编辑  收藏  举报