lovecoding
/
VIP32


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107
							<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <ul>
        <li>内容一</li>
        <li>内容二</li>
        <li>内容三</li>
        <li>内容四</li>
    </ul>
    <script>
      var arr = ["小明", "小红", "Lucy"];
      let obj = {
        name: "赵家锐",
        age: 22,
        sex: "男",
      };
      // for(var i=0;i<arr.length;i++) {
      //     console.log(arr[i]);
      // }
      // 1.forEach
      arr.forEach((ele, index) => {
        console.log(ele, "ele"); // 每一项
        console.log(index, "index"); // 下标
      });
      // 2.for of:遍历数组时 key代表数组中的每一项；不可以遍历对象；所以这个一般用于遍历数组
      for (var key of arr) {
        console.log(key, "key");
      }
      // for(var key of obj) {
      //     console.log(key,'key1')
      // }
      // 3.for in:遍历数组时，key代表数组中的索引(下标);遍历对象时 key代表对象中的属性
      for (var key in arr) {
        console.log(key, "in");
      }
      for (var key in obj) {
        console.log(key, "in1");
      }
      let arr1 = [1, 2, 3, 4, 5, 6];
      // 4.filter 过滤 将符合过滤条件的元素返回到新数组中 原数组不发生更改
      let arr2 = arr1.filter((ele) => {
        return ele >= 4;
      });
      console.log(arr2, "arr2");
      console.log(arr1, "arr1");
      let arr3 = [
        {
          age: 12,
          name: "LiLi",
          content: "好好学习",
        },
        {
          age: 22,
          name: "赵某人",
          content: "上课睡觉",
        },
        {
          age: 32,
          name: "Lucy",
          content: "过年",
        },
      ];
      // ele => Element
      let arr4 = arr3.filter((ele) => {
        return ele.age > 20;
      });
      console.log(arr4, "arr4");
      // 5.map 主要是为了映射出一个新数组 将特定的函数条件返给新数组 不会改变原数组
      let arr5 = arr1.map((ele) => {
        return ele * 2;
      });
      console.log(arr5, "arr5");
      console.log(arr1, "arr1");
      // 6.some 判断数组是否符合当前条件 有一个符合 则为true;都不符合 才为false
      var newArr = [34, 23, 56, 76, 54, 18];
      let arr6 = newArr.some((ele) => {
        return ele > 70;
      });
      console.log(arr6, "arr6");
      //7.every 判断数组是否符合当前条件 有一个不符合 则为false;都符合 才为true
      let arr7 = newArr.every((ele) => {
        return ele > 10;
      });
      console.log(arr7, "arr7");
      // 8.reduce 从左到右 累增累减
      let arr8 = newArr.reduce((total, num) => {
        return total + num;
      });
      console.log(arr8, "arr8");
     // 9.find 查找符合当前条件的第一个值并返回
      let arr9 = newArr.find((ele) => {
        return ele > 10;
      });
      console.log(arr9, "arr9");
      // 10.类数组 转为 正常数组 Array.from()
      var list = document.querySelectorAll("ul li");
      console.log(list,'list');
      console.log([...list],'list');
      console.log(Array.from(list));
    </script>
  </body>
</html>