2. Array遍历&&转化&&生成&&查找

循环

ES5 循环方法

1. for 循环

const arr = [1, 2, 3, 4, 5]
for (let i = 0; i < arr.length; i++) {
  if (arr[i] === 2) {
    continue
  }
  // console.log(arr[i])
}

2. forEach 不支持 break continue

arr.forEach(function (item) {
  if (item === 2) {
    // continue
  }
  // console.log(item)
})

3. every 使用 return 控制循环是否继续

arr.every(function (item) {
  if (item === 2) {

  } else {
    // console.log(item)
  }
  return true
})

4. for in 适用于 object，不适合数组，因为他会将数据的属性也遍历出来

// arr.a = 8
for (let index in arr) {
  if (index * 1 === 2) {
    continue
  }
  // console.log(index, arr[index])
}

ES6 循环方法

1. for of 适用于自定义结构的数据类型的遍历

for (let item of arr) {
  // console.log(item)
}

const Price = {
  A: [1.5, 2.3, 4.5],
  B: [3, 4, 5],
  C: [0.5, 0.8, 1.2]
}

for (let key in Price) {
  // console.log(key, Price[key])
}

转换 第二小节

ES5

let args = [].slice.call(arguments) // collection 函数参数
let imgs = [].slice.call(document.querySelectorAll('img')) // NodeList
console.log(args)

ES6

// Array.prototype.from
let args = Array.from(arguments)
let imgs = Array.from(document.querySelectorAll('img'))
imgs.forEach()
// 语法
Array.from(arrayLike,mapFn,thisArg)
let array = Array(5)
for (let i = 0, len = array.length; i < len; i++) {
   array[i] = 1
}
console.log(array)
let array = Array.from({ length: 5 }, function () { return 1 })
console.log(array)
// {0:'a',1:'b',length:2}

生成新数组 第三小节

ES5

let array = Array(5)
let array = [1,2,3,4,5]

ES6

// Array.prototype.of
let array = Array.of(1,2,3,4,5)
console.log(array)
// 填充&&替换数组
// Array.prototype.fill
let array = Array(5).fill(7)
console.log(array)
Array.fill(value,start,end)
let array = [1, 2, 3, 4, 5]
console.log(array.fill(8, 2, 4))

ES5 查找 返回数组，满足条件的所有值

let find = array.filter(function (item) {
   return item % 2 === 0
 })
console.log(find)

// ES6 查找 返回找到的值，只返回第一个符合条件的值，关注有还是没有

// Array.prototype.find 返回值
let find = array.find(function (item) {
   return item % 2 === 0
})
// Array.prototype.findIndex 返回位置
let find = array.findIndex(function (item) {
  return item % 2 === 0
})
console.log(find)

学习视频记录